충남대 FE_강병현 5주차 과제 Step2 #94
Conversation
| }; | ||
| onChange: (e: ChangeEvent<HTMLInputElement>) => void; | ||
| submitButton: ReactNode; | ||
| isSignUp?: ReactNode; |
There was a problem hiding this comment.
isSignUp처럼 is로 시작하는 이름은 보통 boolean을 하기에 다른 네이밍을 쓰는게 더 적절해보여요.
| isSignUp?: ReactNode; | ||
| } | ||
|
|
||
| export default function AuthForm({ userInfo, onChange, submitButton, isSignUp }: AuthFormProps) { |
There was a problem hiding this comment.
AuthForm이 회원가입과 로그인에서 동시에 사용될 수 있도록 재사용성을 높여서 컴포넌트 인터페이스를 구성하신거 같네요. 저는 이러한 케이스를 재사용성과 유연성을 중시한 나머지 여러 책임과 역할이 복잡하게 혼재된 상태라서 과하게 재사용 가능하고 유연하다고 진단할 거 같아요.
회원가입과 로그인이 같은 점은 UI가 이메일과 비밀번호를 넣고 버튼이 있다는 점이고 다른 점은 버튼의 문구가 다르며 회원가입과 로그인을 위해 요청하는 API가 다를 것이고 성공과 실패시 각자 안내해야하는 것과 이동해야하는 페이지 path도 다를 것이라는 점이에요. UI가 같다고 해서 추상화했더니 서로 다른 부분을 처리하기가 복잡해졌죠. 또한 유저 타겟으로 구분해봐도 회원가입은 제품에 첫 유입된 사용자일테고, 로그인은 첫 유입 이후에 지속적으로 활용하는 사용자일테니 각자 다른 타겟군이기에 중요하게 여기는 수치가 다를 수 있고, 결과적으로 발전되는 방향도 다를 확률이 높을 수 있겠죠.
그래서 저라면 로그인을 위한 LoginForm 그리고 회원가입을 위한 SignUpForm을 분리해서 컴포넌트를 만들고 Form, Input, InputField, Button UI 컴포넌트까지만 재사용할 수 있게 구현할 거 같아요. 컴포넌트가 UI/UX에서 책임지려는 역할과 책임이 명확하게 나눠졌을 때 얻는 효과가 재사용성과 유연성이라고 바라보고 있어요. 더 중요한 가치가 있고, 선후 관계가 다른거죠.
No description provided.