728x90 전체 글77 신입 프론트엔드 개발자의 입사 6개월 회고 벌써 입사한지 6개월이 되었다 지난 수습기간 3개월 간의 회고록을 작성한 것이 얼마 되지 않은 것 같은데 정신 없이 하루하루를 보내다 보니, 벌써 입사한지 6개월 이상이 되었다,, 이 글에선 그동안 진행했던 프로젝트들과 그 과정에서 느꼈던 점들을 기록해보고자 한다! 무엇을 했는가 🌈 '통합 로그인' 페이지 배포 [사용 기술 | React] : 2023년 새해가 밝자마자 통합 로그인 페이지를 배포하게 되었다. 배포 당일 오전에는 작성된 코드들을 전반적으로 살펴보며 오류가 없는지 점검했다. 늦은 오후에 배포를 하게 되었는데, 나는 아주 자그마한 주니어 개발자이기 때문에 자잘한 오류들을 해결해 나갔다. 그 외의 오류 해결은 시니어 개발자 분들이 맡았고, 그동안 다시 로그인 프로세스를 하나 하나 밟아보며 테스트.. 2023. 3. 12. [React] useMemo와 useCallback 개념 정리 (+ 리렌더링, 메모이제이션, useEffect ...) useMemo와 useCallback의 개념에 대해 정리해보겠습니다 기본적으로 useMemo와 useCallback은 리렌더링을 최적화하는데 도움이 되도록 만들어진 Hook이다. 📌 리렌더링 (re-rendering) ? React는 Virtual DOM을 사용하고 있다. 따라서 리렌더링이 되는 조건에 충족되는 상황이라면, 이전의 Virtual DOM과 현재의 Virtual DOM을 비교하여 변경된 값에 대해 DOM 트리를 업데이트 해준다. 위에서 언급한 리렌더링이 되는 조건은 다음과 같다. 자신의 state가 변경될 때 부모 컴포넌트로부터 새로운 props가 들어올 때 / 변경될 때 부모 컴포넌트가 리렌더링될 때 📌 메모이제이션 (memoization) ? 과도한 리렌더링은 성능 저하의 원인이 된다. .. 2023. 3. 5. [React] Redux Toolkit 사용법 (+ TypeScript 세팅) Redux Toolkit (+TypeScript) 세팅 방법에 대해 정리해보겠습니다 회사에서 프로젝트를 진행하던 중 Redux를 통해 state를 관리하기 위해 세팅해보기로 했다.개인 프로젝트를 진행할 때 Redux Toolkit에 편리함을 느꼈어서 해당 툴을 사용하고자 했다. 📌 Redux Toolkit ?Redux Toolkit은 Redux를 만든 곳에서 공식적으로 효율적인 Redux 개발을 위해 만들어진 툴킷이다.Redux보다 코드가 간결하고 더 개선되어 유지 관리가 쉽기 때문에 사용을 강력히 권장하고 있다. 📌 Redux Toolkit이 제공하는 것| store.jsimport { configureStore, createSlice } from '@reduxjs/toolkit';// news.. 2023. 2. 12. [React] forwardRef 사용법 (useRef, useImperativeHandle...) (함수형 컴포넌트에서) 부모 컴포넌트에서 자식 컴포넌트 안의 DOM element에 접근하고 싶다면? forwardRef를 사용해야 한다. 회사에서 프로젝트를 진행하던 중, 부모 컴포넌트에서 자식 컴포넌트 안의 함수를 사용해야 하는 경우가 생겼다. 자식 컴포넌트에서 부모 컴포넌트의 함수를 사용하려면 props를 사용하면 되었지만 그 반대의 경우는 경험해 본 적이 없어서 어떤 방식이 있는지 찾아보다 forwardRef라는 Hook을 발견하였다. 📌 forwardRef를 사용해야 하는 이유 ? 함수형 컴포넌트는 인스턴스가 없기 때문에 ref 속성을 사용할 수 없다. 따라서, 함수형 컴포넌트를 forwardRef로 감싸주게 되면 ref를 사용할 수 있다. (+ 클래스로 선언된 컴포넌트들은 인스턴스를 가지기 때.. 2023. 2. 5. 이전 1 ··· 15 16 17 18 19 20 다음 728x90
