뚝딱뚝딱 코딩 기록_

[redux-toolkit] 리액트로 진행한 프로젝트에서 리덕스를 공부한 적이 있는데 리덕스의 보일러 플레이트 코드를 간소화하기 위해 리덕스 툴킷 (redux-toolkit, rtk)를 사용한 적이 있다. 공부하면서 노션에 정리해놓은 것을 다시 복기할 겸 정리하려고 한다. 상태 관리 라이브러리 (state management library) → redux, modox, recoil 등 state가 상위 component로 올라갈수록 관리하기 복잡해지는 현상 해결 Redux toolkit (RTK) Redux 로직을 작성하고 저장소를 설정하는 프로세스(redux 작업)를 단순화 redux 저장소 구성의 복잡성, 많은 패키지 추가, 상용구 코드 해결 위해 사용하는 도구 API configureStore() ..

[Project_HNTECH Hompage Dev] 🚒 프로젝트 소개 🧯 목적 : HNTECH 회사 홈페이지 제작(개발) 🧯기능 제품 정보 확인 (제품 소개 게시판) 자료 업로드 / 다운로드 (사진, 문서) 게시글 업로드 / 댓글 작성 관리자 페이지 - 로그인, 회사 정보 수정 등 PDF 프리뷰어 (미리보기) 반응형 모바일 웹 화면 🧯개발 기간 : 2022.08 - 2022.10 🚒 사용 기술 🧯 front Language : TypeScript, HTML, CSS Library : React, Redux, Material-UI, react-dnd, react-pdf Tool : Redux Toolkit, Vite API : axios 🧯 back Spring Boot (Kotlin), MySQL, Sp..

[React_ useReducer + ContextAPI] ❓ 전역으로 state 관리하기 리액트로 개발을 하면서 느낀 점은 컴포넌트 층이 많아지면 prop로 state를 전달하는 과정(prop drilling)에서 prop을 추적하기 어려워 유지보수에 영향을 미친다는 점이었다. 이러한 현상을 해결하기 위해 상태 관리도구인 Redux, Recoil, Mobx 등을 사용하여 과도한 prop drilling을 줄이는 방법을 사용한다. ❓ useReducer useState를 대체하는 hook으로 state가 여러 하위 값을 포함하는 복잡한 상태거나 다음 state가 이전 상태에 종속되는 경우 선호되는 방법이다. [state, dispatch] 한 쌍으로 반환되며 컴포넌트 밖에 state를 정의하여 사용할 수..