Conversation
bk-git-hub
left a comment
bk-git-hub
left a comment
There was a problem hiding this comment.
예찬님 과제 하시느라 고생많았습니다.
전체적으로 컴포넌트 분리와 Tailwind 기반 레이아웃 정리가 깔끔했습니다
아래에 몇 가지 개선해보면 좋을 부분들 코멘트로 남겨두었습니다.
| }; | ||
|
|
||
| function TodoList({ todo1, todo2, todo3, todo4 }: TodoListProps) { | ||
| return ( |
There was a problem hiding this comment.
현재 구조도 동작은 잘 하지만, todo1, todo2처럼 개별 props를 나열하는 방식은 확장성과 유지보수 측면에서는 아쉬움이 있는 편입니다. 다음 주에는 배열 형태로 데이터를 넘기고 map으로 렌더링하는 방식으로 한 번 구현해보시면 좋을 것 같아요.
|
|
||
| function TodoList({ todo1, todo2, todo3, todo4 }: TodoListProps) { | ||
| return ( | ||
| <div className="self-stretch h-64 flex flex-col justify-start items-start gap-4"> |
There was a problem hiding this comment.
현재 할 일 목록은 의미상 리스트이기 때문에, div대신ul/li 구조로 작성하면 조금 더 시맨틱한 마크업이 될 것 같습니다.
There was a problem hiding this comment.
Vite 템플릿 스타일이 아직 많이 남아 있어서, 실제 과제 코드와 템플릿 잔여 스타일의 경계가 조금 흐려 보입니다. 과제와 직접 관련 없는 기본 스타일은 정리해두면 구조가 더 명확해질 것 같아요.
| @@ -0,0 +1,20 @@ | |||
| type TodoCardProps = { | |||
| text: string; | |||
| isLast?: boolean; | |||
There was a problem hiding this comment.
isLast prop이 정의되어 있지만 현재 TodoList에서 전달되지 않고 있어서 사실상 사용되지 않는 상태입니다. 혹시 isLast가 구체적으로 하는 역할이 있을까요? 만약 필요하지 않다면 제거하고, 필요하다면 실제 사용되는 흐름까지 연결해두면 컴포넌트 책임이 더 명확해질 것 같아요.
There was a problem hiding this comment.
현재 TodoHeader는 작은 UI에 비해 div 중첩이 조금 많은 편입니다. 아이콘과 제목 정도의 구조라면 wrapper를 조금 줄여도 충분히 같은 레이아웃을 만들 수 있을 것 같아요. 그리고 제목 역할을 하는 부분은 div보다는 h1이나 h2 같은 시맨틱 태그를 사용하면 구조의 의미도 더 분명해질 것 같습니다.
2 participants
✅ 제출 정보
✅ 체크리스트 (필수)
main이 아니라 내 GitHub 핸들 브랜치(<handle>)다<handle>-week-xx형식이다🧩 구현 내용 요약
❓ 궁금한 점