COURSE MAP
5개 트랙으로 나눈 React 학습 경로
분량이 큰 주제라 트랙 단위로 나눴습니다. 트랙 A와 B는 순서대로 보는 것을 권하고, 이후 트랙은 필요한 주제부터 골라 봐도 됩니다. 본문은 React 19 기준으로 쓰고, 18과 달라지는 부분은 각 파트 끝에 따로 정리합니다.
선언형 UI 개념과 컴포넌트, state, 폼 처리까지 기본 작동 방식을 익힙니다.
이펙트와 렌더링을 이해하고 상태 관리, 서버 데이터, 프로젝트 구조를 정리합니다.
타입스크립트, 테스트, 빌드와 성능, AI 활용 기준을 다룹니다.
전체 14개 파트가 모두 공개돼 있습니다. 순서대로 학습하거나 필요한 파트만 골라 봐도 됩니다.
트랙 A · 기초
기초
선언형 UI 개념부터 컴포넌트, state, 폼 처리까지 React의 기본 작동 방식을 익힙니다.
React는 무엇을 해결했나
직접 DOM을 조작하던 방식의 한계와 선언형 UI의 의미, 가상 DOM에 대한 흔한 오해를 정리합니다.
컴포넌트와 JSX
JSX 문법과 props로 데이터를 전달하는 방법, 조건과 목록 렌더링, key를 올바르게 쓰는 기준을 다룹니다.
state와 렌더링
useState의 동작, 렌더링이 일어나는 시점, 불변성 규칙, 상태를 어디에 둘지 판단하는 기준을 다룹니다.
이벤트와 폼
이벤트 처리 방식, 제어 컴포넌트와 비제어 컴포넌트의 차이, 폼 제출과 검증 처리 방법을 다룹니다.
트랙 B · 동작 원리
동작 원리
이펙트와 렌더링, 최적화와 커스텀 훅처럼 잘못 쓰면 문제가 생기는 영역을 다룹니다.
트랙 C · 실무 구조
실무 구조
상태 관리 전략, 서버 데이터 처리, 라우팅과 프로젝트 구조를 정리합니다.
트랙 D · 품질과 운영
품질과 운영
타입스크립트, 테스트, 빌드와 성능까지 운영 관점을 다룹니다.
트랙 E · AI 활용
AI 활용
AI가 만든 React 코드에서 반복되는 문제와 검토 기준을 정리합니다.
이 코스를 쓰는 방법
- React를 처음 본다면 트랙 A를 순서대로 끝내는 것을 권합니다.
- 이미 쓰고 있다면 이펙트와 렌더링을 다루는 트랙 B부터 봐도 됩니다.
- 각 파트 끝의 완료 기준으로 이해 상태를 스스로 점검합니다.
- 이 코스는 React 자체에 집중합니다. 서버 렌더링 프레임워크는 별도 주제로 다룹니다.
REFERENCES
공식 참고 자료
React는 변화가 빠른 편입니다. 판단이 필요한 순간에는 공식 문서를 함께 확인합니다.
| 자료 | 내용 | 바로가기 |
|---|---|---|
| React 공식 문서 | 개념 설명과 API 레퍼런스 | 공식 페이지 |
| React 버전 목록 | 버전별 릴리스와 문서 아카이브 | 공식 페이지 |
| React 블로그 | 릴리스 공지와 보안 안내 | 공식 페이지 |
| Vite | React 프로젝트 생성과 빌드 도구 | 공식 페이지 |