리액트의 동작 원리를 코드 레벨까지 이해하고, 바닐라 자바스크립트로 리액트 코어 구현하기 (feat.TypeScript)
React의 내부 동작 원리를 깊이 이해하여, 프레임워크를 단순히 "사용"하는 것을 넘어 효율적으로 활용하고 문제를 해결할 수 있는 능력을 갖추자. 또한, 바닐라 자바스크립트를 사용해 React의 핵심 개념(예: Virtual DOM, 상태 관리, 컴포넌트 라이프사이클 등)을 직접 구현해 봄으로써, React의 작동 방식과 원리를 보다 실질적으로 체득하자.
- 자바스크립트 객체지향과 함수형에 대한 이해
- 브라우저 렌더링 과정 이해
- 리액트의 탄생 배경(철학)과 컴포넌트 이해
- class 컴포넌트와 function 컴포넌트에 대한 이해
- 리액트 코어 이해
- Virtual DOM
- Diffing Algorithm:
- Reconciliation
- 웹 컴포넌트를 만들며, 컴포넌트 기반 개발(CDD)를 배워보자. (황준일님의 Web Component 아티클 학습)
- 상태관리를 어떤 식으로 만드는지에 대한 방법을 배우자. (황준일님의 상태관리 시스템 아티클 학습)
- Virtual DOM을 만드는 방법에 대해 배우자. (황준일님의 Virtual DOM 만들기 아티클 학습)
- React Hook 만드는 방법에 대해 배우자. (황준일님의 useState Hook 만들기)
- 바닐라 자바스크립트로 SPA 환경을 만들자.
- Babel을 사용해 나만의 미니멀한 리액트를 만들자. (Google Form 구현하기)
- [미정] Server Component 적용하여 SSR을 만들어보자.
FE 이동현 |
FE 이서인 |