본문 바로가기

전체 글

 (118)
23.02.18: Weekly I learned <Fun English> I joined an English speaking club called 'Fun Enlgish' since early this year, as I satteled down in Korea and knew it's going to be hard to have a conversation in English with people anywhere, anytime like when I used to live in NZ. My vocab was getting worse and I was just repeating same sentence over and over when I spoke to one of my friends in NZ. It was one of my Todo in 2023 and today was ..
23.02.06: React, 깊이 파고들기 실무에서 React를 사용 하면서, 좀 더 깊이 있게 공부 해 보면 좋을 것 같아 주제를 선정하게 되었습니다. 왜 다들 React를 배우라고 하는 것인지, 어떤 점 때문에 이토록 널리 실무에서 사용 되어지고 있는지, Facebook팀은 왜 React를 개발 한건지 알아보고 React가 가진 특장점들은 무엇인지 알아보는 시간을 가져보았습니다. 링크: React, 깊이 파고들기 React, 깊이 파고들기 - 오픈소스컨설팅 테크블로그 Introduction 안녕하세요, 오픈소스 컨설팅의 Playce-Dev 팀 Front-end 개발자 노은지입니다. 저희 Playce-Dev 팀은 현재 React를 사용하여 Front-end 개발을 하고 있습니다. 여러 가지 Front-end development framewor..
23.01.15: JavaScript - Array.from() Array.from() 메서드는 유사 배열 객체(array-like object)나 반복 가능한 객체(iterable object)를 얕게 복사해 새로운 Array 객체를 만듦. 구문 Array.from(arrayLike[, mapFn[, thisArg]]) 매개변수 arrayLike: 배열로 변환하고자 하는 유사배열 객체나 반복 가능한 객체 mapFn: 배열의 모든 요소에 대해 호출할 맵핑 함수 (optional) thisArg: mapFn 실행 시 this로 사용할 값 (optional) 반환 --> 새로운 Array. 인스턴스 Map 에서 배열 만들기 const m = new Map([[1, 2], [2, 4], [4, 8]]); Array.from(m) // [[1, 2], [2, 4], [4, ..
23.01.11: dependency array에는 언제, 뭘 넣어주어야 할까 (useEffect, useMemo, useCallback) React Hooks 중 useEffect, useCallback, useMemo를 사용하면서 언제 dependency array를 추가하고 또 어떤 것을 넣어주어야 할 지 어렴풋이 짐작은 하지만 확실하게 알고 있지 못한 것 같아 공부를 또 해야겠다 싶었습니다. 같은 내용을 몇 번을 쓰고 또 쓰는지 모르겠지만 이렇게 정리하다 보면 완전히 알게되는 날이 올 것이라는 믿음으루... 또 정리 해보겠습니다. 별코딩의 리액트 hooks 강의 예제 및 다른 블로그들의 예제들을 참고 하며 학습 및 정리한 내용입니다. 링크는 본문 하단에 있습니다. # useEffect useEffect는 컴포넌트가 화면에 첫 렌더링이 될 때(Mount), 다시 렌더링이 될 때(Update), 화면에서 사라질 때(Unmount) 특정 ..
23.01.10: React-hook-form 이용한 form 구현(React storybook, typescript) 구현 조건 1. styled 를 활용해 Wrapper 를 만들어주세요. (width: 500px, height: 700px, Wrapper border 속성을 통해서 구분을 주어야합니다.) 2. 사용자로부터 다음의 정보를 입력받을 예정입니다. (id, name, pwd, gender(M, F), email, phone, address, description) 3. description 은 선택 입력입니다. 하단에 체크박스를 클릭하면 descipriton 필드가 노출됩니다. 체크박스를 해제하면 안보입니다. 4. phone, email 은 각각의 형식에 맞게 입력을 받아야합니다. 나머지 필드는 반드시 입력해야 합니다. 5. 비밀번호는 확인을 통해서 입력한 비밀번호가 일치하는지 체크를 해야합니다. 6. 하단에..
22.01.05: typescript, React Storybook 이용 과제 (Arrow Function, currentTarget) 문제 1. (FirstTemplate 에 작성합니다.) 간단한 버튼 3개를 구현해주세요. 버튼 문서는 오른쪽 링크를 참조합니다. (https://mui.com/material-ui/react-button/) 첫 번째 버튼의 속성은 small 사이즈이며 outlined, primary 입니다. 두 번째 버튼의 속성은 medium 사이즈이며 contained, secondary 입니다. 세 번째 버튼의 속성은 large 사이즈이며 text, error 입니다. const FirstTemplate: Story = (args) => { return ( Primary Secondary Error ); }; 문제 2. (SecondTemplate 에 작성합니다.) InputText 에 값이 없을 때 비활성화, 값이..
나의 2022년 돌아보기 2022년은 나에게 정말 많은 일이 일어난 해였다. 뉴질랜드에서의 마지막 락다운이 풀리고 바쁘게 일 하면서, 힘들고 정신 없지만 좋은 동료들 덕분에 즐거운 2021년 하반기와 2022년 1분기를 보냈다. 2022년 2월엔 나의 휴가가 시작 되자마자 코로나에 걸려서 나의 휴가를 반쯤 날려 버렸고, 2020년 12월에 접수만 해 놓은 채로 기약 없이 기다리고 있던 영주권은 우여곡절 끝에 3월에 나왔다. 그렇게 내 속을 까맣게 태웠는데, 막상 받고나서는 그리 기쁘지가 않았다. 코로나 덕분에 오랫동안 한국에 못들어 왔었어서, 영주권을 받고 자체 휴가 기간을 가지려고 생각해왔었다. 그래서 5월에는 일을 잠시 중단하기로 하고 휴가차 한국에 들어왔다. 원래 영주권을 따고 나서 web developer 과정을 수료할 ..
22.12.29: 프로그래머스_다음에 올 숫자 문제 설명 등차수열 혹은 등비수열 common이 매개변수로 주어질 때, 마지막 원소 다음으로 올 숫자를 return 하도록 solution 함수를 완성해보세요. 제한사항 2
반응형

티스토리툴바