Feature/#41 회원가입 페이지

[crazyupinc-design]

이슈 번호

close #41

변경 사항 요약

• 상단 GNB 없는 상태입니다
• API 연결 부분은 현재 비어있는 상태입니다
• 로그인하기 클릭시 로그인 화면으로 이동되도록 화면 연결했습니다
• 반응형 처리했습니다

아래 두파일만 확인부탁드립니다. 제가 작업하지 않은 파일들이 모두 푸시가 된 이유가 뭘까요...;;;;;
pages/signup/index.tsx
components/Input.tsx

테스트 결과

• 현재 설정되어있는 유효성검사에서 성공하면 가입하기 버튼 활성화됨 확인했습니다.
• 각 인풋과 전체 인풋에 대한 유효성 검사 확인했습니다 ( 인풋컴포넌트 파일 수정했습니다)

[junghwaYang]

로그인,회원가입 api 기능은 제외하고 확인했습니다!
스타일 관련해서 리뷰 달았습니다

그리고 추가로 체크해야 할 사항이 있는데

이게 포커싱 아웃 했을때만 유효성 검사를 진행한다는 점 때문에
UI/UX를 살짝 해칠 수 있어요

1. 모든 값을 정상적으로 입력 했지만 (포커싱 아웃 x) 버튼이 활성화되지않아서 유저가 한번 더 input 외에 클릭을 해야 활성화가 된다는 점
2. 값을 입력하고 포커싱 아웃 후 버튼이 활성화 되었지만, 다시 올바르지않은 값으로 수정을 했을경우, 버튼 클릭을 다시 하거나 포커싱아웃을 해야 버튼 비활성화가 됨

이런 두가지의 문제가 발생해요

물론, 기획상의 포커싱 아웃과 키보드 이벤트를 동시에 작성해서 두가지 조건 또한 만족할 수 있는 방법이 있습니다
이 문제는 스프린트 미션때도 동일하게 있었는데요
그래서 스프린트 미션 당시 저또한 이런 문제로 주강사님께 피드백을 받은 적이 있어요

우선, 두가지를 만족하기에는 꽤나 복잡한 로직을 작성해야할 수 있기에 지이님께서 작성하신대로 진행 하고 리팩토링 기간 때 두가지를 만족하는 조건으로 로직 수정 해보시면 좋을 듯 합니다!

추신
그냥 마우스 한번 딸깍하면 다시 유효성 검사가 발동 될텐데 굳이? 라는 생각이 드실 수 있습니다
저또한 그랬구요 하지만 저희가 해당 프로젝트를 서비스화 할 건 아니라서 크게 상관없겠지만
실제 현업에서 저런 문제로 컴플레인을 거는 고객이 있습니다...😭 (아마 지이님도 기획자이시니 고객 컴플레인에 대한 고충은 어느정도 아실거라 생각합니다)
리팩토링 때 생각해보시면 나중에 지이님이 기획자로써 고객에게 해당 컴플레인이 들어온다면 개발자분께 기능 요구사항 전달을 더욱 편하게 하실수있지않을까 싶습니다(개발자 입장에서 기획자 분이 방안까지 얘기해주시면 사랑입니다 ㄹㅇ 개큰감동👍🏻)

[haksoo0918]

에디터 코드가 왜 같이 올라온건가요?

[junghwaYang]

에디터 코드가 왜 같이 올라온건가요?

PR merge 전 브랜치 머지 하셔서 그런것같습니다!