본문 바로가기
카테고리 없음

[엘리스 SW Engineer 트랙 7기] 웹 프로젝트 2주차 - 두 번째 학습 정리 -

by 띵코딩 2023. 11. 15.

 

 

 

진행한 사항

개발한 기능
저번 시간에 로그인 페이지의 UI와 기능을 어느 정도 완성하였기에 이번 시간엔 회원가입 페이지를 구현하였습니다. 따로 와이어 프레임을 제작했었지만 생각보다 복잡한 구조였기에 디자인을 바꿔 진행하였습니다. 먼저 api 데이터 명세서에 따라 필요한 정보들을 입력할 input창과 중복확인 버튼을 구현하였습니다.
아이디와 비밀번호는 모두 required값이고 나머지는 option값으로 설정하였습니다. 중복확인은 api 호출을 통해 db에 있는 값들과 input값을 비교하여 확인하였습니다. 주소 입력창은 Daum 우편 주소 api를 사용하여 비교적 손쉽게 해결하였습니다. 회원가입 버튼을 누를 시 입력된 값들의 형식을 검사한 후 가입되도록 하였습니다.
회원 가입 후 로그인에 성공할 시 헤더에 사용자의 이름이 표시되도록 설정하였습니다.
메인 부분에 베스트 상품과 리뷰를 판매량 순, 최신 순으로 나타나도록 구현하였습니다.
간단하게 sort함수를 사용하였습니다.

진행 중 겪었던 이슈
회원가입을 할 때 입력된 정보들을 api 명세서에 나온 자료형에 따라 보내줬어야 했지만, 그걸 인지 못한 부분에서 어려움이 있었습니다. 그러한 사실을 몰랐기에 백엔드 분들에게 도움을 요청하여 자료형에 맞게 보내줘야한다는 사실을 알게되었고 다행히 해결하게되었습니다.

진행할 사항
회원가입 페이지까지 완성하였고, 이제는 관리자 페이지 쪽을 맡아 상품, 주문내역들을 설정할 수 있도록 구현할 예정입니다. 그 외에 다른 디테일적인 부분도 수정할 예정입니다.

느낀점
다른 팀원분들과 코드를 합치게되면서 잦은 오류들이 발생하기 시작했었습니다. 이러한 문제들을 팀원들과 공유하며 같이 해결해 나가면서 팀원들의 소중함을 한번 더 깨닫게 되었습니다. 앞으로도 활발한 소통을 해야될 것 같다고 생각했습니다.

#엘리스트랙 #엘리스트랙후기 #리액트네이티브강좌 #온라인코딩부트캠프 #온라인코딩학원 #프론트엔드학원 #개발자국비지원 #개발자부트캠프 #국비지원부트캠프 #프론트엔드국비지원 #React #Styledcomponent #React Router Dom #Redux #Typescript #Javascript