영화 검색 사이트) KPT회고✍️

1. Project - 영화 검색 사이트🎬

01. 완성 사이트 엿보기

• 🔽 Header : 이미지 슬라이드

• 🔽 nav : 카테고리별 해당 영화카드 표시 / 스크롤 애니메이션
• 🔽 더보기 기능 : api query param 조작 / 20개씩 추가

• 🔽 모달창 : 해당 영화 정보 표시

• 🔽 검색기능 : 검색 api 사용

• 🔽 북마크 : 로컬스토리지 사용

02. 트러블 슈팅

• 영화 검색 사이트) TroubleShooting 1 : 검색 기능
• 영화 검색 사이트) TroubleShooting 2 : 더보기 기능
• 영화 검색 사이트) TroubleShooting 3 : 북마크 기능

2. Project KPT Review🗒️

01. 개인 회고

• KEEP : 만족하는 부분

- 도전 기능 중 일부(async/await, 영화 검색 기능, 로컬 스토리지 활용 등)을 구현해냈다. 
- 과제에 제시된 기능 외의 추가 기능(더보기, 이미지 슬라이드)을 구현해냈다.
- 트러블슈팅을 열심히 작성했다.

• PROBLEM : 문제가 발생한 부분

[기능부분]
- 함수의 이해가 부족하여 데이터의 흐름이 꼬여버렸다.
- 기능 구현만을 위해 코드를 작성하다 보니 코드가 꼬여서 모듈화를 하지 못했다.
- DOM 조작에 대한 이해가 부족하여 이벤트 중복 문제가 발생하였다.

[기타]
- 너무 울었다...🥲
- 챗GPT에게 조금 의존했다.
- gitHub README/Pull Request 작성법에 대한 요령이 부족하다.

• TRY : 개선방안

[기능부분]
- 함수에 대한 파트를 필히 복습하자!
- 로직을 구상할 때, 모듈화에 대한 부분을 꼭 염두하고 미리 계획을 세우자.
- DOM 조작에 대한 부분을 필히 복습하자!

[기타]
- 욕심을 조금 내려놓자. 개발을 오래 하기 위해 스스로 마인드 컨트롤을 하자.
- 챗GPT를 사용하기 전, 최대한 많이 구글링해보거나 튜터님의 도움을 먼저 받아보자. 
- gitHub README/Pull Request 작성법을 찾아보고, 템플릿을 미리 설정하자.

02. 튜터님의 피드백

• 화려한 디자인, 다양한 기능도 좋지만, 요구 사항을 정확하게 이해한 상태에서 정리하고, 구현하는 것이 더 중요하다.
• main.js 파일에서 미사용 코드가 존재한다. (수정할 것)
• script 태그에 type="module" 속성을 주면, 항상 지연 실행된다. 따라서, defer 속성을 주지 않아도 된다.
• 다음 프로젝트에서는 코드 품질이나 유지보수성을 좀 더 신경써보자.
• 어떤 데이터를 변수로 담아둘지, 이게 커지면 어떻게 함수로 만들지 등을 고민해보자.
• 리드미 작성은 어느 부분에서 힘들었고, 어떻게 해결하려고 했는지 또는 어떻게 해결했는지 등의 과정을 적어주면 더 좋다.

03. 프로젝트 개선을 위한 참고 사이트

• 쓰로틀링/디바운싱 관련 참고 사이트
• module/defer 관련 참고 사이트