과제 체크포인트
배포 링크
https://parksangsoo.github.io/front_6th_chapter1-2/
기본과제
가상돔을 기반으로 렌더링하기
- createVNode 함수를 이용하여 vNode를 만든다.
- normalizeVNode 함수를 이용하여 vNode를 정규화한다.
- createElement 함수를 이용하여 vNode를 실제 DOM으로 만든다.
- 결과적으로, JSX를 실제 DOM으로 변환할 수 있도록 만들었다.
이벤트 위임
- 노드를 생성할 때 이벤트를 직접 등록하는게 아니라 이벤트 위임 방식으로 등록해야 한다
- 동적으로 추가된 요소에도 이벤트가 정상적으로 작동해야 한다
- 이벤트 핸들러가 제거되면 더 이상 호출되지 않아야 한다
심화 과제
Diff 알고리즘 구현
- 초기 렌더링이 올바르게 수행되어야 한다
- diff 알고리즘을 통해 변경된 부분만 업데이트해야 한다
- 새로운 요소를 추가하고 불필요한 요소를 제거해야 한다
- 요소의 속성만 변경되었을 때 요소를 재사용해야 한다
- 요소의 타입이 변경되었을 때 새로운 요소를 생성해야 한다
과제 셀프회고
기술적 성장
가상돔이 실제로 어떻게 생성되고 어떻게 실제돔과 비교해서 바뀐 부분만 렌더링 하는 지 과정에 대해 좀 더 자세히 알게 된 거 같다
코드 품질
테스트 코드가 원하는 값을 받을 수 있도록 구현에만 초점 둬서 코드 품질에 대해서는 어떻게 하면 좋은 품질의 코드가 될 지 고민은 못해본 거 같다
학습 효과 분석
과제 피드백
리뷰 받고 싶은 내용
가상돔이 어떻게 작동하는 지에 대한 과제인 거 같아 뭘 리뷰를 받아야 할 지 모르겠습니다;
과제 피드백
고생하셨습니다 상수님. 과제는 잘 작성해주셨던 것 같아요! 명확하게 목적에 맞춰서 필요한 부분은 잘 구현해주신 것 같습니다.
다만 공부를 하셨던 많은 내용들이 있으셨던 것 같은데, 그 부분들을 글로 옮겨보고 공유해보고 하는 경험이 추후에 공부 한 기억을 오래 갖고가시는데 큰 도움이 될 것 같아요. 지금은 셀프 회고에 가볍게 적어주셨지만 다음 주차부터는 다른 분들 과제를 리뷰해보기도 하고 참고해서 작성해보신다면 더 도움이 많이 될 것 같습니다.
다음 주도 화이팅입니다~