FrontOverflow
처음 만난 리덕스 (Redux)
0. 준비하기
0.1
redux-devtools 소개
0.2
(실습) 개발환경 설정하기
0.3
(실습) redux-devtools 설치하기
1. Redux 소개
1.1
Redux의 탄생
1.2
Flux architecture
1.3
Three Principles of Redux
1.4
Redux Data Flow
1.5
꼭 Redux를 써야할까?
1.6
1장 요약
2. Redux 시작하기
2.1
Redux 구성요소
2.2
Immutability
2.3
어떤 경우에 Redux를 사용해야 할까?
2.4
Redux vs Context API
2.5
(실습) Counter 애플리케이션
2.6
2강 요약
3. Store
3.1
Store
3.2
Dispatcher
3.3
Store 관련 함수
3.4
(실습) TODO 애플리케이션
3.5
(실습) State Logging 버튼 만들기
3.6
(실습) Middleware 적용해보기
3.7
3강 요약
4. Action과 Action Creator
4.1
Action
4.2
Action Creator
4.3
(실습) TODO 애플리케이션에 다양한 Action 정의하기
4.4
(실습) Action Creator 만들기
4.5
4강 요약
5. Reducer
5.1
Reducer
5.2
Rules of Reducers
5.3
Immutable Update
5.4
combineReducers()
5.5
(실습) TODO 애플리케이션에 MEMO 기능 추가하기
5.6
5강 요약
6. Redux와 UI
6.1
Redux와 UI의 관계
6.2
Redux와 UI 연동
6.3
(실습) 신호등 애플리케이션 만들기
6.4
6강 요약
7. Container
7.1
Container
7.2
react-redux
7.3
react-redux의 주요 API
7.4
mapStateToProps()
7.5
mapDispatchToProps()
7.6
connect()
7.7
Redux와 React 연동하기
7.8
(실습) create-react-app을 사용해서 리액트 프로젝트 생성하기
7.9
(실습) Redux와 React 연동하기
7.10
(실습) TODO 애플리케이션 만들기
7.11
(실습) redux-devtools 연동하기
7.12
7강 요약
8. Ducks Pattern
8.1
Pattern
8.2
Ducks Pattern
8.3
Duck
8.4
(실습) TODO 애플리케이션에 Ducks 패턴 적용하기
8.5
8강 요약
9. redux-actions
9.1
FSA (Flux Standard Action)
9.2
redux-actions
9.3
redux-actions 주요 API
9.4
(실습) TODO 애플리케이션에 redux-actions 적용하기
9.5
9강 요약
10. Redux와 Async Logic
10.1
Async Logic
10.2
Side Effects
10.3
Redux와 Async Logic
10.4
Async Function Middleware
10.5
Redux Async Data Flow
10.6
(실습) Async Function Middleware 만들기
10.7
10강 요약
11. redux-thunk
11.1
Thunk
11.2
Thunk를 사용하는 이유
11.3
redux-thunk
11.4
Thunk 함수 작성 방법
11.5
Thunk 사용 패턴
11.6
(실습) redux-thunk 연동해서 Thunk 사용해보기
11.7
11강 요약
12. redux-saga
12.1
Saga
12.2
Generator Function
12.3
redux-saga
12.4
redux-saga 사용 방법
12.5
Thunk vs Saga
12.6
(실습) Generator Function 사용해보기
12.7
(실습) redux-saga 연동해서 Saga 사용해보기
12.8
(실습) 다양한 Effect Creator 사용해보기
12.9
12강 요약
13. redux-persist
13.1
Persist
13.2
redux-persist
13.3
Storage
13.4
데이터 저장 및 복원 과정
13.5
redux-persist 사용 방법
13.6
Migration
13.7
(실습) TODO 애플리케이션에 redux-persist 연동하기
13.8
(실습) Session Storage 연동하기
13.9
(실습) Migration 적용해보기
13.10
13강 요약
14. Redux Toolkit (RTK)
14.1
Redux Toolkit
14.2
Slice
14.3
Redux Toolkit 주요 API
14.4
immer 사용 패턴
14.5
(실습) TODO 애플리케이션에 Redux Toolkit 적용하기
14.6
(실습) Reducer 내에서 state 출력하기
14.7
14강 요약
15. Redux Hooks
15.1
useSelector()
15.2
useDispatch()
15.3
useStore()
15.4
(실습) Redux Container를 Hook을 사용하도록 변경하기
15.5
15강 요약
16. 미니 프로젝트
16.1
프로젝트 기획하기
16.2
(실습) 프로젝트 생성하기
16.3
(실습) 필요한 패키지 설치하기
16.4
(실습) 컴포넌트 구성하기
16.5
(실습) 프로젝트 폴더 구성하기
16.6
(실습) App 컴포넌트 구현하기
16.7
(실습) React와 Redux 연동하기
16.8
(실습) Slice 만들기
16.9
(실습) Board UI 구현하기
16.10
(실습) Todo UI 구현하기
16.11
(실습) Thunk 연동하기
16.12
(실습) redux-saga 연동하기
16.13
(실습) redux-persist 연동하기
16.14
16강 요약
이번 장에서는 Redux의 기초 개념들에 대해서 정리하고, 실제로 Redux를 사용해서 간단한 애플리케이션까지 만들어 보도록 하겠습니다.
개발자를 위한 슬라이드 작성 도구
마지막 업데이트: 2023년 07월 13일 08시 47분
이 문서의 저작권은 이인제(소플)에 있습니다. 무단 전재와 무단 복제를 금합니다.