React Study
1.[React] Props와 State 이해하기
[React] Props와 State 이해하기
2.[fastcampus] Ch.1 React Getting Started
리액트 시작하기
3.[fastcampus] Ch.2 React Component
리액트 컴포넌트 기본 개념
4.[fastcampus] Ch.3 Creating React Project
리액트 CRA(Create React App) Project 설치하기
5.[fastcampus] Ch4. React Router (1)
리액트 라우터 (1)
6.[fastcampus] Ch4. React Router (2)
리액트 라우터 (2)
7.[fastcampus] Ch4. React Router (3)
리액트 라우터 (3)
8.[fastcampus] Ch.5 React Component Styling (1)
리액트 컴포넌트 스타일링 (1)
9.[fastcampus] Ch.5 React Component Styling (2)
리액트 컴포넌트 스타일링 (2)
10.[fastcampus] Ch.5 React Component Styling (3)
리액트 컴포넌트 스타일링 (3)
11.[fastcampus] Ch.6-1 HOC (1)
HOC 고차 컴포넌트 이해하기
12.[fastcampus] Ch.6-2 HOC (2)
React Hooks와 비교해서 이해하는 HOC 이해하기
13.[fastcampus] Ch.6-2 Controlled/Uncontrolled Component
리액트 제어/비제어 컴포넌트
14.[fastcampus] Ch7. Hooks (1)
리액트 훅 이해하기
15.[fastcampus] Ch7. Hooks (2)
리액트 커스텀 훅
16.[fastcampus] Ch7. Hooks (3)
리액트 라우터 훅 / 컴포넌트 간 통신 / Context API
17.[Udemy] React가 필요한 이유 (입문)
React라는 기술에 대해 생각하기
18.[Udemy] React - CRA, JSX, State, Props
React 보일러 플레이트 & 주요 개념
19.[Udemy] React 기본 - 일기장 만들기(1)
다양한 사용자 입력 처리 및 입력 데이터 핸들링하기
20.[Udemy] React 기본 - 일기장 만들기(2)
React에서 DOM 조작하기
21.[Udemy] React 기본 - 일기장 만들기(3) READ
React에서 배열 사용하기 1 - 리스트 렌더링 (조회 READ)
22.[Udemy] React 기본 - 일기장 만들기(4) CREATE
React에서 배열 사용하기 2 - 데이터 추가하기 (생성 CREATE)
23.[Udemy] React 기본 - 일기장 만들기(5) DELETE
React에서 배열 사용하기 3 - 데이터 삭제하기 (삭제 DELETE)
24.[Udemy] React 기본 - 일기장 만들기(6) UPDATE
React에서 배열 사용하기 4 - 데이터 삭제하기 (수정 UPDATE)
25.[Udemy] React 기본 - 일기장 만들기(7) Lifecycle 제어 : useEffect
리액트 컴포넌트 라이프사이클 제어
26.[Udemy] React 기본 - 일기장 만들기(8) API 호출하기 : useEffect x fetch
API 호출해 더미 데이터를 일기장에 뿌려줍니다
27.[Udemy] React 기본 - React Developer Tools
크롬 확장 툴 : React Developer Tools(RDT)
28.[Udemy] React 기본 - 일기장 만들기(9) 최적화1 (연산결과 재사용) : useMemo
useMemo로 연산 과정을 최적화해본다
29.[Udemy] React 기본 - 일기장 만들기(10) 최적화2 (컴포넌트 재사용) : React.memo
연산 낭비를 막는 React.memo로 컴포넌트 재사용
30.[Udemy] React 기본 - 일기장 만들기(11) 최적화3 (컴포넌트&함수 재사용하기) : useCallback
일기를 삭제해도 작성폼이 리렌더링 되지 않게
31.[Udemy] React 기본 - 일기장 만들기(12) 최적화 완성
React.memo, useEffect, useCallback을 활용해 일기 목록 렌더링을 최적화
32.[Udemy] React 기본 - 일기장 만들기(13) 복잡한 상태 관리 로직 분리 : useReducer
복잡한 상태 변화 로직을 App 컴포넌트로부터 분리하여 일기장을 업그레이드 한다
33.[Udemy] React 기본 - 일기장 만들기(14) 컴포넌트 트리에 데이터 공급하기 : Context
Props Drilling 해결하기
34.[TIL] 실무 리액트 관련 조사
공부하다 생긴 의문
35.[Udemy] React 실전(감정일기장) - 페이지 라우팅 (1)
React SPA & CSR에 대해 알아봅니다.
36.[Udemy] React 실전(감정일기장) - 페이지 라우팅 (2)
페이지 라우팅 기본 학습
37.[Udemy] React 실전(감정일기장) - 페이지 라우팅 (3)
페이지 라우팅 응용 (react-router의 custom hook 활용)
38.[Udemy] React 실전(감정일기장) - 프로젝트 기초공사1
공통 font, layout, image assets, component 만들기
39.[Udemy] React 실전(감정일기장) - 프로젝트 기초공사2
일기 쓰기, 수정, 조회 로직, 상태관리, Context
40.[Udemy] React 실전(감정일기장) - 일기 홈(/)
페이지 구현1
41.[Udemy] React 실전(감정일기장) - 일기 쓰기(/new)
페이지 구현2
42.[Udemy] React 실전(감정일기장) - 일기 수정(/edit)
페이지 구현3
43.[Udemy] React 실전(감정일기장) - 일기 상세(/diary)
페이지 구현4
44.[Udemy] React 실전(감정일기장) - 흔히 발생하는 버그 수정하기
우연히 버그를 마주 쳤을 때..
45.[Udemy] React 실전(감정일기장) - LocalStorage를 일기 DB로 사용하기
이제 진짜로 작성한 일기를 저장해볼게요 (+삭제하기 포함)
46.[Udemy] React 실전(감정일기장) - 최적화(Memoization, useCallback)
감정일기장 연산 최적화하기
47.[Udemy] React 실전(감정일기장) - 배포 준비 & 빌드
build & deploy...!
48.[Udemy] React 실전(감정일기장) - Firebase 프로젝트 배포 + Open Graph
배포 후 최종 완성!
49.[Study] 리액트 컴포넌트 구현
책으로 복습
50.[fastcampus] Ch11. Redux로 상태관리하기(1)
Redux 기초
51.[fastcampus] Ch11. Redux로 상태관리하기(2)
Redux 기초 (react-redux 안 쓰고 TodoList 만들기)
52.[fastcampus] Ch11. Redux로 상태관리하기(3)
Redux 기초 (react-redux hooks 사용하여 Container로 만들기)