-
Notifications
You must be signed in to change notification settings - Fork 51
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
[안성재] Week14 #517
The head ref may contain hidden characters: "part3-\uC548\uC131\uC7AC-week14"
[안성재] Week14 #517
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
리뷰가 늦었네요🙇♂️
수고하셨습니다!
피드백 한 부분은 잘 적용해준 것 같아요.
디렉토리도 부자연스럽다고 느껴지는 것은 없었습니다.
새로 만든 컴포넌트와 페이지의 경우 react-hook-form을 차용하면서 ui 코드가 복잡해지는데 이 부분을 커스텀 훅을 통해 녹여내면 더 좋아질 것 같아요!
const handleOpenPopover = useCallback((e: MouseEvent) => { | ||
e.preventDefault(); | ||
setPopoverIsOpen(!popoverIsOpen); | ||
}, []); | ||
|
||
const handleClosePopover = useCallback(() => { | ||
setPopoverIsOpen(false); | ||
}, []); | ||
|
||
const handleOpenModalDeleteLink = useCallback((e: MouseEvent) => { | ||
e.preventDefault(); | ||
setModalDeleteLinkIsOpen(true); | ||
}, []); | ||
|
||
const handleCloseModalDeleteLink = useCallback((e: MouseEvent) => { | ||
e.preventDefault(); | ||
setModalDeleteLinkIsOpen(false); | ||
}, []); | ||
|
||
const handleOpenModalAddLink = useCallback((e: MouseEvent) => { | ||
e.preventDefault(); | ||
setModalAddLinkIsOpen(true); | ||
}, []); | ||
|
||
const handleCloseModalAddLink = useCallback((e: MouseEvent) => { | ||
e.preventDefault(); | ||
setModalAddLinkIsOpen(false); | ||
}, []); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
커스텀 훅으로 분리하면 좀 더 UI에 집중할 수 있는 컴포넌트가 될 것 같네요!
const onSubmit = (data: IFormInput) => { | ||
submitForm(data); | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
이 함수는 없어도 되지 않을까요?
const response1 = await apiRequest({ url: '/sample/folder' }); | ||
const folder = response1.data?.folder; | ||
|
||
const response2 = await apiRequest({ url: '/sample/user' }); | ||
const profile = response2.data; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
response1의 통신이 종료될 때까지 response2는 대기될 텐데, 그럼 네트워크 통신에 병목이 생길 수 있습니다. 이를 해결하려면 어떻게 하는 것이 좋을까요?
요구사항
기본
심화
주요 변경사항
Input
컴포넌트와 로그인, 회원가입 페이지 구현Nav
컴포넌트가 페이지 컴포넌트에서 페칭한 데이터를 prop으로 받아서 렌더링하도록 리팩토링스크린샷
멘토에게
Input
컴포넌트와 로그인, 회원가입 페이지에서 개선해야할 부분이 있는지 궁금합니다.