[항해99] 7주차 클론프로젝트 회고

회고발표를 마치고 단체 샷

👨‍💻클론 프로젝트 소개

원티드(wanted) 커뮤니티 클론 프로젝트

- 개발자들의 커뮤니티 Sokdak ⌨️ 💬 

- 커리어와 라이프스타일에 대해 자유롭게 이야기 할 수 있어요 🙋🏻 

 

클론 프로젝트 목표

• 미니 프로젝트와 비슷한 규모의 스코프 + 도전하고 싶은 기능 한 가지 (FE/BE 서로 합의 하에!)
• 클론 코딩이라고 모든 것을 복제할 수는 없습니다! 화면 구성은 동일하게 하되, 하나의 기능을 완료 후, 차근차근 추가해보세요

 

FE 기술 스택

• react
• styled-components
• amazon s3
• axios : ajax
• redux-toolkit : 전역 상태 관리 라이브러리
• vite : 빌드 툴
• react-hook-form : 유효성 검사에 유용한 훅
• react-cookie : 쿠키 관련 처리 훅
• react-toastify : 알림 컴포넌트

 

주요 기능

📍 회원가입/로그인

(1) 일반 이메일 회원가입 / 로그인
    - 아이디 중복 확인
    - 아이디 / 패스워드 정규식 확인
    - 랜덤 난수 닉네임 생성

(2) OAuth2(카카오) 회원가입 / 로그인
    - 회원가입 Type 식별 👉 일반 로그인 불가
      (* 일반회원이 카카오로 로그인 시도시  일치하는 ID가 있을 경우 SignUpType 변경 0 → 1)
    - 랜덤 난수 닉네임 생성

(3) 로그인/ 로그아웃 인증
    - JWT Token

📍 커뮤니티

(1) 커뮤니티 내용 등록
    - Category 선택 [ 커리어고민, 취업/이직, 회사생활 , … ,  UI/UX]
    - 사진 업로드 (AWS S3)
    - 제목 / 내용 
    - 글 작성시 닉네임으로 출력되도록

(2) 커뮤니티 내용 조회
    - 전체 조회 
    - 카테고리별 조회 
    - 선택 조회

(3) 커뮤니티 내용 수정
    - 수정시 사진 삭제

(4) 커뮤니티 내용 삭제
    - 게시물 삭제시 연관 내용 전체 삭제

(5) 커뮤니티 글 좋아요 기능

(6) 커뮤니티 댓글 등록/삭제


📍 마이페이지

(1) 내 정보 조회
    - 프로필 사진 업로드
    - 직무, 경력 정보 등록 & 수정

✨새로운 시도

• 깃 컨벤션과 깃 플로우를 정하여 협업
• 로그인 유효성 검사
• 카카오 sns 로그인
• JWT를 로컬스토리지에 저장하지 않고 쿠키에 저장하여 서버와 동일한 만료시간을 갖도록 하였음
• alert가 UX에 좋지 않다고 판단하여 스낵바(토스트)를 구현하였음.

🚀트러블 슈팅

• 게시글 수정하기를 할 때 원래 게시글의 데이터를 가지고 가면서 작성하기 페이지를 재사용하도록 기획하였는데, 수정할 때 작성하기와는 다르게 이미지 데이터가 이미지 url값을 가지고 있어서 어떻게 formData 형태로 다시 가공해야하는지 매우 어려웠음. 어떤 방법을 사용해야할까?
• 유저 정보를 redux를 이용해서 store에 저장하고 관리하면서 비로그인과 로그인 상태를 구별하여 다른 화면을 보여줄 수 있도록 하고 있는데, 유저정보가 제대로 리프레쉬되지 않는 트러블이 발생함.

😔아쉬웠던 점

• 로딩 시 스켈레톤 UI 나 UX를 위한 세부적인 UI 디테일을 더 챙기지 못한 점
• 중복되는 UI를 컴포넌트로 잘 설계하고 폴더 구조를 유용하게 설계하지 못한 점
• 시간 관계 상 무한 스크롤 구현하지 못한 점

---

😎이번주에 나는

정말 정말 바빴다... 되돌아보니 TIL도 쓸 시간이 없었던 것 같다.

컨디션도 챙기면서 프로젝트까지 다 해낸다는 게 말이 안된다고 느껴지던 한주였다.

하루종일 코딩하고 밤을 새우고 또 새워도 시간이 부족했다.

몸이 두개였으면 좋겠다고 간절하게 느꼈다. (프론트 살려줘...)

 

그래도 그렇게 갈아넣고 나서 결과물을 확인해보니 뿌듯한 마음이 든다.

 

조금 아쉬웠던 점은 매일 매일 기록물들이 남아야 뭘했었는지 확인할 수가 있는데

주간 회고글을 작성하다보니 TIL이 없는게 너무 아쉽다.

다음주부터는 아무리 바빠도 짧게 그날 무슨 공부를 했었는지 꼭꼭 기록해야겠다.

 

 

▶관련 TIL 보기

[TIL] 불편함을 못느꼈다면 그건 너무 잘 만든 것

▶깃허브 레포 보러가기

GitHub - Dev-sokdak/FE-sokdak

▶팀노션 보러가기

개발자 커뮤니티 Sokdak 💻