[4주차/챈니] 워크북 제출합니다.

[12234538]

✅ 워크북 체크리스트

• 모든 핵심 키워드 정리를 마쳤나요?
• 핵심 키워드에 대해 완벽히 이해하셨나요?
• 이론 학습 이후 직접 실습을 해보는 시간을 가졌나요?
• 미션을 수행하셨나요?
• 미션을 기록하셨나요?

✅ 컨벤션 체크리스트

• 디렉토리 구조 컨벤션을 잘 지켰나요?
• pr 제목을 컨벤션에 맞게 작성하였나요?
• pr에 해당되는 이슈를 연결하였나요?(중요)
• 적절한 라벨을 설정하였나요?
• 파트장에게 code review를 요청하기 위해 reviewer를 등록하였나요?
• 닉네임/main 브랜치의 최신 상태를 반영하고 있는지 확인했나요?(매우 중요!)

📌 주안점

[qkrdmsthff]

LGTM 챈니 피드백이 늦어졌네요 고생하셨고 merge 권한은 미리 부여드리겠습니다!

[qkrdmsthff]

영화 상세 데이터를 가져오는 로직을 useMovieDetail 이라는 커스텀 훅으로 표현해 보면 MovieDetailPage 가 더욱 간결해지고 코드 가독성 및 재사용성이 증가할 것 같네요!

이번 미션 내용이 아마 해당 내용에 대한 커스텀 훅 적용이였을 텐데 한 번 수정해 보시면 좋을 것 같아용

[jjeunv]

공통 로직을 유틸 함수로 분리한 구조가 깔끔해서 좋네용

[jjeunv]

touched, errors의 초기값이 undefined로 되어 있는데, 현재 코드에서는 optional chaining이나 null 체크 없이 바로 사용하고 있습니다.
특히

setTouched({ ...touched, [name]: true })

와 같이 spread 연산을 사용할 때, 초기 렌더링 시 touched가 undefined이면 TypeError가 발생할 수 있습니다.
초기값을 빈 객체로 설정하면 이러한 문제를 방지하고 더 안전하게 상태를 관리할 수 있을 것 같습니다!!

 const [touched, setTouched] = useState<Record<string, boolean>>({});
 const [errors, setErrors] = useState<Record<string, string>>({});

위 코드의 경우 항상 객체 형태가 보장되기 때문에 처럼 안전하게 사용할 수 있어 더 안정적인 코드가 됩니다!!