Conversation
| data: UserFolder[]; | ||
| } | ||
|
|
||
| interface UserFolders { | ||
| export interface UserFolders { | ||
| created_at: string; | ||
| favorite: boolean; |
There was a problem hiding this comment.
boolean 타입이기 때문에 isFavorite 같은 변수명도 괜찮을 것 같습니다. 혹시 api 명세서에 나온 내용이라면 그냥 냅두셔도 좋습니다.
| data: Link[]; | ||
| } | ||
| interface Link { | ||
| export interface Link { | ||
| id: number; | ||
| created_at: string; | ||
| updated_at: null; |
There was a problem hiding this comment.
updated_at이 무조건 null이라면 굳이 타입으로 지정하지 않으셔도 됩니다.
| mutationFn: async () => { | ||
| const response = await fetcher<UserFolders[]>({ | ||
| url: `/links/${linkId}`, | ||
| method: "put", | ||
| data: { favorite: !isFavorite }, | ||
| }); | ||
| return response.data; | ||
| }, |
There was a problem hiding this comment.
api 요청하는 함수는 따로 작성해서 파일로 관리하셔도 좋습니다.
| }; | ||
| return ( | ||
| <button className={styles.bookmarkButton} onClick={handleButtonClick}> | ||
| <Image src={isFavorite ? starOnImg : starOffImg} alt="즐겨찾기 이미지" /> |
There was a problem hiding this comment.
next/Image 사용하실때 크기 지정도 해주셔야합니다!
| @@ -17,7 +19,15 @@ function CardList({ | |||
| return ( | |||
| LinksData && | |||
There was a problem hiding this comment.
카멜케이스로 작성해주시면 좋을 것 같고, folderListData 처럼 linksData?: FolderLink[]로 작성해주셔도 좋을 것 같습니다.
| <h2>{folder.name}</h2> | ||
| <p>{`${folder?.link_count}개 링크`}</p> |
There was a problem hiding this comment.
위에는 folder.name이고 아래는 folder?.link_count 인데, folder가 nullable 하다면 둘다 ?를 붙여주시는게 좋아보입니다.
| styles.backgroundClipText | ||
| )} | ||
| > | ||
| {" "} |
There was a problem hiding this comment.
이 파일도 내부를 컴포넌트화 해주셔도 좋을 것 같습니다.
There was a problem hiding this comment.
컴포넌트 내부에 로직이 많아서 커스텀 훅으로 분리해주셔도 좋을 것 같습니다.
| @@ -1,4 +1,4 @@ | |||
| const formatDate = (value) => { | |||
| const formatDate = (value: string) => { | |||
There was a problem hiding this comment.
value 보다는 dateString 같은 조금 더 명시적인 이름이면 좋을 것 같아요!
요구사항
기본
[기본] 프로젝트 전반에 필요한 리팩토링, 기능 개선을 진행했나요?
[기본] 즐겨찾기 설정된 카드의 별은 파랑색이 되나요?
[기본] 파랑색 별을 다시 클릭하면 즐겨찾기 설정이 해제되고 회색으로 돌아가나요?
[기본] 즐겨찾기 설정/해제는 PUT ‘/links/{linkId}’ 를 활용했나요?
심화
주요 변경사항
Vercel
보러가기
멘토에게