2025/05/07 2

리액트 useReducer 훅이란?

안녕하세요~~ 이번에는 useReducer에 대해 알아보도록 하겠습니다. useReducer가 무엇이고 이 훅을 왜 사용하는지 한번 살펴보도록 하겠습니다.📑목차1. useReducer1-1. useReducer란?1-2. useReducer를 왜 사용할까?1-3. useState VS useReducer 차이점1-4. useReducer 기본 문법1-5. useReducer 동작 순서1-6. reducer 함수 구조1-7. useReducer 사용 예제 코드 서론useReducer 를 학습하시기 전에는 상태 관리를 useState로 했을겁니다. 하지만 애플리케이션이 복잡해지거나 상태 업데이트 로직이 길어지게 되면 useState만으로는 한계가 있기때문에 이런 복잡한 상태 관리 및 업데이트를 해줄 수 있..

React 기록 2025.05.07

리액트 라우터(React router), react-router-dom, Link, useNavigate 훅에 대하여..

안녕하세요~ 리액트에서 중요한 라우터에 대해 알아보겠습니다. 라우터가 무엇이고 왜 사용하는지 살펴보도록 하겠습니다.📑목차1. 라우터(Router)1-1. 리액트에서 라우터란?1-2. 리액트에서 라우터를 사용하는 이유1-3. react-router VS react-router-dom 차이2. react-router-dom 라이브러리2-1. react-router-dom 라이브러리란?2-2. BrowserRouter2-3. Routes2-4. Route2-5. Route 속성 (path, element)2-6. 라우팅 구조2-7. Link2-8. useParams2-9. useNavigate서론이전에는 라우팅을 했을때 이런식으로 하셨을 겁니다. node 환경에서는 다음 코드처럼 라우팅을 해서 클라이언트에게..

React 기록 2025.05.07