Node

[새싹X코딩온] 2차 프로젝트 회고록 : Motimates

효진인데요 2023. 11. 29. 13:49

🖥️  프로젝트 소개

 

[ Website ]

⭐️ 로그인 창의 테스트 계정으로 로그인하시면 회원 가입 없이 사이트를 둘러보실 수 있습니다.

Motimates

 

Motimates

 

motimates.xyz

 

[ GitHub ]

https://github.com/SesacProjectTeamA-2

 

SesacProjectTeamA-2

새싹 프로젝트 팀프로젝트 TeamA-2. SesacProjectTeamA-2 has 3 repositories available. Follow their code on GitHub.

github.com

 

[ Notion ]

Motimates

 

Motimates

🌐 웹 사이트 주소

www.notion.so

 

 

 


 

 

🏃🏻‍♂️   개요

  • Motivation + Mates
  • 모임에 가입해 목표를 함께 달성하고 경쟁하며 서로 동기를 부여해 주는 사이트

 

🕰️ 개발 기간

2023.10.18 ~ 2023.11.10

 

 

🔧  개발 환경

 

 

⚙️  ERD

 

 


 

 

🖥️ 담당한 부분

 

1. 담당 파트

  • DB 모델 시퀄라이저를 활용하여 생성, 수정 및 ERD 버전 관리
  • 카카오 소셜 로그인 및 회원 가입 기능
  • JWT를 활용한 토큰 발급 및 검증 미들웨어 설정
    • HS256 알고리즘
    • 유저 시퀀스(DB 고유 값), 닉네임, 이메일 정보 포함
  • 사용자가 가입한/생성한 모임 조회
  • 모임 링크 생성 및 링크로 가입 기능 개발
  • 모임장 권한 위임 기능 개발
  • 게시글 및 댓글 CRUD 개발 및 API 정리
    • 게시글 목록 - 댓글 수 조회
    • 게시글 상세 - 댓글 및 각 작성자 정보 조회

 

2. 기능

  • 카카오 소셜 로그인 구현
  • 소셜 로그인(구글/카카오/네이버) 시 이미 회원가입 이력이 있는 유저인지 조회
    • 초기 로그인 유저일 시 회원 가입 후 JWT 토큰 생성
    • 이미 가입한 유저일 시 로그인 시 바로 JWT 토큰 생성
  • 사용자가 가입한/생성한 모임 조회
  • 모임 초대 링크 조회
  • 모임 링크로 가입 기능
  • 모임 탈퇴
    • 모임 탈퇴 시 해당 사용자가 모임장일 경우 위임 후 탈퇴 가능하도록 로직 개발
  • 모임장 위임
  • 모임의 게시글 리스트 조회 (공지사항/자유/미션) + 각 게시글의 댓글 수 조회
  • 게시글 상세 보기 및 해당 게시글의 댓글 조회
  • 게시글 및 댓글 CRUD

 

3. 에러 처리

  • 백엔드에서 try-catch문을 통해 에러 처리 후 상태 코드 및 메시지 전달, 프론트엔드에서는 해당 상태 코드를 기반으로 사용자 단에 보여지는 부분을 설정
    • 코드에 따라 프론트로 에러 전송 및 처리
    • 리액트 특성 상 4로 시작하는 에러 상태 코드를 처리하는 데에 문제가 있어 메시지로 에러 정보 전달

 

 

🙋‍♀️ 성장한 부분

 

  • 백앤드 기능 개발을 위한 node.js와 ejs 언어 사용 능력 향상
  • 소셜 로그인 구현을 통한 OAuth의 진행 과정의 이해 향상
  • JWT를 활용한 토큰 발급 및 검증 미들웨어 구현 능력 향상
  • 백앤드에서 에러 상태에 따른 status 코드를 전송 능력 향상
  • Swagger 문서 작성Swagger 코드 분리 능력 향상
  • Git을 활용한 협업을 통해 협업 과정의 전반적인 능력의 향상
  • Git의 커밋 컨벤션과 브랜치 규칙 설정 등을 통한 효율적인 협업
  • DB의 설계시퀄라이저의 활용 능력 향상

 


 

 

✏️ 개발 페이지 및 기능 살펴보기

 

⚠️ 에러 처리

4로 시작하는 상태코드는 제외, 성공 여부 및 에러에 대한 메세지 전달

 

 

Notes

  • 백엔드에서 try-catch 를 통해 에러 처리 후 상태 코드를 전달
  • 프론트엔드에서 상태 코드를 기반으로 사용자 단에 보이는 부분 처리 (success 여부 / msg)

Features

  • try..catch를 통해 에러 처리
  • API의 파라미터 체크 후 에러 처리
  • 토큰 유효성 검사 처리

 

 

 

🖱️ 회원가입 요청 (+로그인)

Features

  • DB 값 검증 (uName, uEmail)
    • 회원 가입이 안 된 사용자일 시 (DB에 없는 사용자 일 시) 회원 가입 창으로 이동
    • 이미 회원인 사용자일 시 메인 페이지로 이동 및 토큰 발급
    • uName과 uEmail에 대한 중복 값 검사
  • uName, uEmail, uImg 이 세 정보는 소셜 로그인 시 받아오는 닉네임, 이메일, 프로필 사진의 정보를 가지고 있음

📌 SUMMARY: 회원 가입 이력에 따라 화면 이동 및 토큰 발급 여부 결정

 

 

 

🖱️ 모임 토큰 조회 및 토큰으로 가입

Features

  • 모임 생성 시 자동으로 생성되는 해당 모임 고유 토큰 조회
  • 해당 토큰 입력 후 요청 날릴 시 해당 그룹으로 바로 가입되도록 기능 구현
  • 존재하는 모임에 대한 토큰인지 DB 검증 후 처리 결과 반환

 

 

 

🖱️ 모임 탈퇴 및 모임장 위임

Features

  • 모임 탈퇴 시 해당 사용자의 모임에서의 역할에 따라 동작
    • 모임원 : 요청 성공 시 바로 모임 탈퇴 가능
    • 모임장 : 모임에 속한 다른 모임원에게 모임장 권한 위임 후 탈퇴 가능
  • 해당 사용자가 정상적으로 모임에 속한 사람인지, 위임하려는 사람이 모임에 속한 사람이 맞는지에 대한 DB 검증 시행

📌 SUMMARY: 모임 역할에 따라 탈퇴 로직 동작에 차이 존재

 

 

 

🖱️ 게시글 및 댓글 기능

Features

  • 각 모임에 대해 3가지 유형의 게시글 존재 (공지, 자유, 미션)
    • 미션의 경우 모임 생성 시 필수로 1개 이상 생성, 이후 추가 및 삭제 가능
  • 게시글 전체 보기 - 각 게시글의 댓글 수 조회 후 전달
  • 게시글 상세 보기 - 해당 게시글의 댓글 및 댓글 작성자 정보 조회 후 전달
  • 모든 게시글 및 댓글에 대해 CRUD 기능

📌 SUMMARY: 게시글 및 댓글 수정, 삭제는 토큰 검증 후 작성자와 같을 경우에만 수행 가능

 


 

 

💭 회고

 

👍️ 잘했다

1. 스웨거 API 문서 작성 및 코드 분리

  • 1차 프로젝트 당시 API 문서를 엑셀로 작성하였는데, 정확한 정보 전달의 오류와 어려움이 있었음
  • 2차 프로젝트에는 이를 개선하기 위해 스웨거를 활용하여 API 문서 작성
  • 전체적인 기능 확인이 용이하고, 기능 수정 시 바로바로 업데이트가 되기에 정확한 정보 전달 가능
  • JWT 토큰 인증 시 확인할 수 있는 인증 기능 추가하여 실제 동작 시 필요한 정보 확인 가능
  • 코드 분리를 통한 코드 단축 및 재 사용 등의 효율성 증가

 

2. 칸반 보드의 타임 라인 기능

  • 1차 프로젝트 당시 아쉬웠던 점인 칸반 보드의 타임 라인 기능을 활용하지 않았던 것을 고려하여 이번에는 각각 기능들에 대해 타임 라인을 추가하기로 팀원들에게 의견 전달
  • 진행 과정을 한 눈에 볼 수 있어 좋았고, 특히 프로젝트 완료 후 각 기능들에 대한 개발 일정을 파악하는데 도움이 많이 되었음

 

 

👊 분발하자

1. 정보의 depth

 

  • Sequelize를 활용하여 게시글의 댓글 및 댓글 작성자를 불러오는 과정에서 모든 글 및 댓글의 작성자 정보가 한 사람의 정보를 가져오는 오류를 확인
    • Sequelize와 덜 친해서 발생한 오류로 추정 → 해결 완료
  • 테이블을 여러 번 타고 들어가야 하기 때문에 정보의 depth가 굉장히 깊음
    • depth를 조금 얕게 하려고 이런저런 방법을 시도해 보았으나 join을 바로 하는 관계를 추가하는 방법 외에는 방법을 찾지 못함
    • 정보의 depth를 조금 꺼내서 보내는 방법을 더 찾아보고자 함

 

 


 

 

✏️  정리

 

두번째 프로젝트는 첫 프로젝트보다 기간이 조금 더 길고 인원이 한 명 더 많아서 그랬는지 초기에 프로젝트를 기획할 때 너무 판을 크게 짰던 것 같기도 하다.

 

(그래서 초기에는 기획도 많이 바뀌고 그에 따라 ERD도 계속 수정되어서 조금 힘들었다,, DB 데이터 날리기 아까웠던 적도 있었지만 뭐 어쩔 수 없지 ㅎ )

 

계속 변경되는 ERD를 팀원들과 공유하기 쉽게 노션에 변경 사항들을 작성해서 정리해 두었는데 나중에 한눈에 보기 편했고 다른 팀원들도 공유가 되는 점이 좋았다.

 

 

 

 

 

 

1차 프로젝트 당시 적용하지 못했던 API 문서인 스웨거를 적용했는데, 초기에는 어려운 점이 많았으나  한 번 틀이 잡히고 나니 재사용성도 좋고 화면으로 보이는 점도 팀원들과 공유가 쉬워 훨씬 효율이 올라가는 것을 몸소 느낄 수 있었다. 

이번 기회를 통해 스웨거랑 조금은 사이가 가까워진 것 같으니 다음에 사용할 일 있으면 슬쩍 사용해봐야겠다 ㅎㅎ

 

 

728x90