web-p2-reactcraft
1주차
Learn📚
-
Virtual DOM과 React Fiber
-
상태관리
-
routing
-
historyAPI
-
객체지향원칙(SOLID)
-
babel과 webpack
-
트랜스컴파일 과정
-
jsx 트랜스컴파일
-
컴포넌트 단위 개발
Feature⚒️
클라이언트
- 초기 환경 세팅
- historyAPI를 활용하여 SPA 설계
- 이벤트 페이지마다, 컴포넌트마다 어떤 식으로 위임할지에 대한 설계 및 구현
- Navigation 객체에서 더 필요한 메서드를 분석하고 적용
- 바벨 트랜스파일링 환경 구축
- babel 트랜스파일링을 통해 mhreact 라이브러리를 사용
- mhreact라이브러리를 사용하여 DOM 렌더링
- VirtualDOM 설계 및 구현
- VirtualDOM과 실제 DOM과의 비교 및 리렌더링 최소화 로직 설계 및 구현
- 폴더 구조 정리
- fsd패턴
서버
- 기본적인 서버 구조 설계
- MVC 패턴
- 간단한 todo 객체 설계 및 API 구현
- aws 인스턴스에 mysql 서버 구동
- db 만들고 nodejs와 연결
라이브러리
- Navigation
- HistoryAPI를 활용하여 페이지 이동 없이 화면 전환(navigate)
- CreateElement
- 각 노드를 객체로 변환
- 객체로 변환한 노드를 실제 html element로 변환
- html element로 변환한 것을 DOM상에서 교체
- 교체 과정에서 교체가 필요한 최소 부분만 골라내어 교체