-
Notifications
You must be signed in to change notification settings - Fork 79
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
[소혜린] Sprint 11 #675
The head ref may contain hidden characters: "React-\uC18C\uD61C\uB9B0-sprint8"
[소혜린] Sprint 11 #675
Conversation
- 타입스크립트 다운 그레이드 - react-hook-form 설치
- custom.d.ts 추가 - 파일 이동 - 디자인 수정
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을 제일 잘 사용하셨다고 생각합니다.
이번 미션도 수고 많으셨습니다 👍
질문 답변
로그인이나 회원가입이 된 경우, 로그인이나 회원가입 페이지로 이동하면 '/'로 리다이렉트 하게끔 했는데, 페이지가 순간적으로 깜빡거리는 현상이 발생합니다. 깜박이지 않게 할 수 있는 방법이 있을까요?
CenterLine 컴포넌트에 달아드린 코멘트를 확인해보시면 될 것 같습니다.
children: ReactNode | ||
} | ||
|
||
const AuthContent = ({ onSubmit, children }: AuthContentProps) => ( |
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.
AuthContent보단 AuthFormWrapper?같은게 어울릴 것 같습니다
공용으로 사용해야하는 복잡한게 컴포넌트에 있는 것도 아니니 회원가입 로그인 form을 그냥 두개 만드시는 것도 좋은 방법일 것 같네요
const navigate = useNavigate(); | ||
|
||
useEffect(() => { | ||
const accessToken = localStorage.getItem("accessToken"); | ||
if (accessToken) { | ||
navigate('/'); | ||
} | ||
}, [navigate]); |
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.
저라면 CenterLIne이라는 컴포넌트가 이 로직을 들고 있을지 상상도 못할 것 같습니다.
이런 방법을 추천드립니다.
@@ -8,25 +7,28 @@ import profile from "../assets/profileIcon.svg"; | |||
|
|||
function Nav() { | |||
const { pathname } = useLocation(); | |||
const accessToken = localStorage.getItem("accessToken"); |
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.
유저와 관련된 값들은 재사용될 확률이 높으니 별도 hook으로 만들어 두시면 좋을 것 같습니다.
@@ -1,6 +1,16 @@ | |||
import { useState, useEffect } from 'react'; | |||
|
|||
function usePagination(initialPage = 1, totalCount, pageSize, asyncFunction) { | |||
type AsyncFunction<T> = (...args: any[]) => Promise<T>; |
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.
이런건 별도로 선언해두면 좋을 것 같습니다.
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.
form 너무 깔끔하고 좋네요
export interface ProductItem { | ||
createdAt: string; | ||
favoriteCount: number; | ||
ownerId: number; | ||
images: string; | ||
tags: string[]; | ||
price: number; | ||
description: string; | ||
name: string; | ||
id: number; | ||
} | ||
|
||
export interface Product { | ||
list: ProductItem[]; | ||
totalCount?: number; | ||
} |
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.
ProductItem이 Product가되고
Product가 ProductResponse같은게 되면 더 낫지않을까 싶습니다.
요구사항
기본
랜딩 페이지
로그인
회원가입
심화
주요 변경사항
질문