[김찬희] SPRINT_MISSION_9 #181
Hidden character warning
Conversation
kimchanhee0309
added
매운맛🔥
| router.refresh(); | ||
| router.push("/signin"); |
There was a problem hiding this comment.
다른 페이지로 이동하니까 refresh는 안해도 될거같은데 한번 검토해주세요!!
| <Link | ||
| className={isBoard ? "text-[#3692ff]" : "transition-colors hover:text-[#3692ff]"} | ||
| href="/board" | ||
| > | ||
| 자유게시판 | ||
| </Link> | ||
| <Link | ||
| className={isItems ? "text-[#3692ff]" : "transition-colors hover:text-[#3692ff]"} | ||
| href="/items" | ||
| > | ||
| 중고마켓 | ||
| </Link> |
There was a problem hiding this comment.
className도 변수로 만들기도 합니다! 여기는 Link 자체가 겹쳐서 아에 NavMenu 자체를 공통 컴포넌트로 해서 map 처리해도 되겠네요!
| const uploaded = | ||
| files.length > 0 ? await imageApi.upload(files) : { imageUrls: [] }; | ||
| await articleApi.create({ | ||
| title: values.title.trim(), | ||
| content: values.content.trim(), | ||
| imageUrls: uploaded.imageUrls, | ||
| images: uploaded.imageUrls, | ||
| }); |
There was a problem hiding this comment.
현재는 이미지를 업로드하는 api를 먼저 요청하고, 그 다음에 응답으로 온 이미지 url을 사용해서 상품을 등록하고 있어요.
그럼 이미지만 업로드하고, 상품을 등록하기 전에 에러가 발생한다면 어떻게 될까요?
이미지 업로드만 사용하는 경우가 있다면 괜찮지만, 상품을 등록할 때와 같이 다른 데이터를 저장할 때 이미지 업로드가 필요하다면 api formdata로 이미지를 서버에 전송해서, 이미지 업로드는 서버에서 처리하는 방식도 있습니다. 이 경우에는 중간에 에러가 생기면 transaction으로 한번에 되돌릴 수 있어요!
| onChange={(event) => { | ||
| const selected = Array.from(event.target.files || []); | ||
| setFiles((current) => [...current, ...selected].slice(0, 3)); | ||
| event.target.value = ""; | ||
| }} |
There was a problem hiding this comment.
이벤트 핸들러도 함수를 분리해서 작성하는걸 권장합니다!
이벤트 핸들러 함수를 분리하면 useCallback 등 최적화가 필요할 때 바로 적용하기도 좋고, return을 기준으로 위에는 로직이, 아래는 렌더링 부분만 남아서 구분하기도 좋아요!
| export const queryKeys = { | ||
| me: ["me"], | ||
| products: (page, orderBy, keyword) => ["products", page, orderBy, keyword], | ||
| product: (productId) => ["product", productId], | ||
| comments: (productId) => ["comments", productId], | ||
| articles: (page, orderBy, keyword) => ["articles", page, orderBy, keyword], | ||
| bestArticles: ["articles", "best"], | ||
| article: (articleId) => ["article", articleId], | ||
| articleComments: (articleId) => ["comments", "article", articleId], | ||
| }; |
|
요구사항도 잘 수행해주셨고, 이전 스프린트에 비해 개선된 부분도 많이 보이네요!! 코멘트 중에서는 이미지 업로드가 이번에 새롭게 추가된 기능이라서, 이 부분 위주로 봐주시면 좋을 것 같아요. 백엔드 api 구현한 것과 같이 검토해주세요! |
2 participants
No description provided.