Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[강나현] Week13 #478

Conversation

Nahyun-Kang
Copy link
Collaborator

@Nahyun-Kang Nahyun-Kang commented Dec 3, 2023

요구사항

기본

  • [] [기본] ‘/folder’ 페이지를 Next.js 프로젝트에 맞게 변경 및 이전 했나요?
  • [] [기본] ‘/shared’ 페이지를 Next.js 프로젝트에 맞게 변경 및 이전 했나요?
  • [기본] 다른 페이지로 이동이 필요한 곳에 next/link의 Link를 적용했나요?
  • [기본] Input 컴포넌트에 값이 없는 경우 회색의 placeholder값을 볼 수 있나요?
  • [기본] Input 컴포넌트에 focus in 하면 파랑색 테두리를 볼 수 있나요?
  • [기본] Input 컴포넌트에 눈 모양 아이콘을 누르면 비밀번호 가리기/보기 기능이 토글 되나요?
  • [기본] Input 컴포넌트에 값이 에러케이스일 경우 빨강색 테두리와 에러 메세지를 볼 수 있나요?
  • [기본] Input 컴포넌트에서 focus out 하면 실행할 함수를 설정할 수 있나요?

주요 변경사항

  • next.js 마이그레이션 중
  • input 컴포넌트 페어프로그래밍(민혁님, 수영님이 해주신 걸 그대로 가져왔습니다)

스크린샷

image

멘토에게

  • 템플릿 코드로 해보려다가 공부하는데 오래걸릴 것 같아 일단 제 코드로 설정해두었습니다..
  • 왜인지 모르겠지만 스타일드 컴포넌트 레이아웃이 전부 깨져서.. scss 로 전부 바꿀 계획입니다.. ㅠ scss 공부해볼겸 해보겠습니다
    image
  • 셀프 코드 리뷰를 통해 질문 이어가겠습니다.

@Nahyun-Kang Nahyun-Kang requested a review from devym-37 December 3, 2023 09:14
@Nahyun-Kang Nahyun-Kang added 매운맛🔥 뒤는 없습니다. 그냥 필터 없이 말해주세요. 책임은 제가 집니다. 순한맛🐑  마음이 많이 여립니다.. labels Dec 3, 2023
Copy link
Collaborator

@devym-37 devym-37 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

잘작성해주셨습니다!
scss로 변경하셔도 괜찮은데, 변경하신다면, 스타일드컴포넌트와 다른점 등을 생각해보시면서 변경하시면 좋을 것 같습니다. 그리고 타입의 any가 많이 선언되어있는데, 최대한 any를 줄여가보는 연습을 해보시면 좋을 것 같습니다. props의 함수가 any타입이여서 코드상으로 안전한지 판단이 안되는 부분들이 있는 것 같습니다.
최대한 연습이라고 생각해보시고 천천히 해결해나가보시면 좋을 것 같습니다

//currentFolderId가 바뀔 때마다 새로 카드리스트 업데이트
useEffect(() => {
handleLoadCardList(currentFolderId);
}, [currentFolderId]);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

api 호출시에는 handle보단 onLoad / fetch라는 접두사가 api 호출 함수로 파악하기 쉬울 것 같습니다

setSelectedLinkUrl(link?.url ?? "");
setCurrentModal(MODALS_ID.addToFolder);
}}
/>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

() => {} 함수보다는 어떤 동작을 하는 함수인지, 분리해서 작성해주시면, 좋을 것 같습니다

description={selectedLinkUrl}
buttonText="삭제하기"
onClick={() => {}}
onCloseClick={closeModal}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

onClick에 빈 함수가 들어가는 것 같습니다

const handleBackgroundClick = useCallback(() => {
setIsPopoverOpen(false);
}, []);
const handleDeleteClick: MouseEventHandler<HTMLLIElement> = (event) => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

handleBackgroundClick 해당 함수 useCallback을 사용하신 이유가 있으실까요 ?

const body = await response.json();
return body;
}

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

해당 함수들도 공통 함수로 만들어서 중복을 줄일 수 있을 것 같습니다!

<>
<button className={cx(".styled_button")}>{children}</button>
</>
);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<>가 필요하지 않아 보입니다

@devym-37 devym-37 merged commit 6774d49 into codeit-bootcamp-frontend:part3-강나현 Dec 4, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
매운맛🔥 뒤는 없습니다. 그냥 필터 없이 말해주세요. 책임은 제가 집니다. 순한맛🐑  마음이 많이 여립니다..
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants