gyelanjjim/pang-yo

제빵사와 오븐, 빵 컨셉의 게시판 서비스

🍞🍦 Pang-yo 빵요

📆 (1차) 2023.05.29 ~ 2023.06.25.

🏆 Pang-yo 목표

• 제빵사와 오븐, 빵 컨셉의 게시판 구현
• 사용자의 게시글 투표에 따라 게시글(빵) 색에 변화를 주어 잘 구운 빵과 탄 빵의 컨셉을 구현
• AWS EC2, Docker를 사용한 웹사이트 배포

📼 DEMO

• 📎 구동 영상

👩‍💻 DB Modeling

📌 담당한 Pang-yo 기능

💻 BE:

1. 특정 오븐 상세 조회 서비스 개선

• 기존의 생성된 빵 정보(제목, 내용, 투표, 댓글) 외에 제빵수험생 수를 추가적으로 구현

2. 특정 오븐 정보 수정 서비스

• 오븐관리자만 title, description을 수정할 수 있도록 권한에 대한 username 유효성 검사

3. 빵 검색 서비스

• 검색 조건 선택에 대한 클릭 수를 줄이고 사용자 편의성을 높이기 위해 하나의 검색값(value)으로 title 또는 body에 값이 있으면 해당 빵을 모두 조회
• 빵이 대량으로 존재할 때 한 번에 모두 불러오지 않고 클라이언트에서 정한 일정 페이지 당 일정 개수(없으면 8개)의 빵을 조회

4. 특정 빵 삭제 서비스

• 특정 빵 삭제시 관련 댓글이나 투표 정보를 남길 수 있게 soft delete 방식으로 삭제
• 특정 빵이 위치한 오븐의 관리자 또는 특정 빵작성자일 때 삭제할 수 있도록 username 일치 여부를 조회

💻 FE:

1. 일정 수 이상의 투표를 받은 빵에 대하여 PostCard 컴포넌트에서 voteScore값에 따라 배경색을 바꾸어 잘 구운 빵과 탄 빵 컨셉의 서비스 구현하여 비추천 받은 빵의 내용은 신경쓰지 않도록 함.

📌 그외 Pang-yo 기능

💻 BE:

1. 회원가입 서비스

• 사이트 정책에 알맞은 가입정보를 입력받기 위한 email, username, password 유효성 검사
• 사용자 유일성을 위한 email, username 중복 검사
• 회원 비밀번호 보호를 위한 password bcrypt 암호화

2. 로그인 서비스

• 사용자가 알맞은 값을 입력하도록 username, password 유효성 검사를 적용
• 로그인 정보를 클라이언트에서 이용할 수 있게 username으로 생성한 JsonWebToken을 쿠키에 담아 반환

3. 로그아웃 서비스

• 쿠키의 token값을 빈문자열("")로 설정하여 구현
• 회원정보나 회원등급에 따라 인증을 따로 하기위한 auth 미들웨어 기능
• 클라이언트에서 활용할 수 있도록 쿠키에 담긴 토큰에서 가져온 username으로 로그인 사용자 정보를 가져오는 user 미들웨어 기능

4. 오븐(커뮤니티) 생성 서비스

• 사이트 정책에 알맞은 오븐 정보를 입력받기 위한 name, title 유효성 검사
• 오븐 유일성을 위한 name 중복성 검사

5. 오븐 목록 조회 서비스

• 각 오븐 name, 오븐 title, 오븐 빵 개수, 오븐 이미지

6. 특정 오븐 이미지 업로드 서비스

• 오븐관리자만 권한을 갖도록 username 유효성 검사,
• 사이트 정책에 알맞은 이미지 개수, 확장자, 파일명만 업로드할 수 있도록 multer 미들웨어,
• 적용할 이미지 영역(프로필/배너)를 구분하고 수정된 이미지를 삭제하기 위한 type, path유효성 검사

7. 빵(게시글) 생성 서비스

• 로그인한 회원만 접근할 수 있도록 user 미들웨어 적용
• 추후 회원정보나 회원등급에 따른 인증을 적용하기 위한 auth 미들웨어 적용
• 보안과 빵 식별을 위해 makeId 함수로 생성한 식별자 identifier
• 제목 식별과 한글 제목의 url 인코딩 대신 영어로 변환하기 위해 transliteration 라이브러리를 활용하여 생성한 slug

8. 특정 빵 상세 조회 서비스

• slug, identifier가 일치하는 빵의 상세 정보(내용, 오븐, 투표)
• 투표 정보가 있을 경우 저장하기 위해 user 미들웨어로 조회하여 user정보 저장

9. 빵 목록 조회 서비스

• 빵목록이 대량으로 존재할 때 한 번에 모두 불러오지 않고 클라이언트에서 정한 일정 페이지 당 일정 개수의 빵을 조회할 수 있도록 하는 기능.
• 투표 정보가 있을 경우 저장하기 위해 user 미들웨어로 조회하여 user정보 저장

10. 특정 빵의 댓글 등록 서비스

• slug, identifier가 일치하는 빵의 정보를 조회하여 댓글 항목에 user정보와 함께 저장.
• 추후 회원정보나 회원등급에 따른 인증을 적용하기 위한 auth 미들웨어 적용

11. 특정 빵의 댓글 목록 조회 서비스

• slug, identifier가 일치하는 빵의 정보 조회하고 그중 빵id가 일치하는 댓글 및 투표 정보를 조회.
• 투표 정보가 있을 경우 저장하기 위해 user 미들웨어로 조회하여 user정보 저장

12. 투표 등록/삭제 서비스

• 댓글식별자 commmentIdentifier값의 유무에 따라 댓글 또는 빵의 투표 정보를 조회
• 조회된 투표 정보와 투표 값에 따라 투표를 등록 또는 삭제
• 투표 정보가 있을 경우 저장하기 위해 user 미들웨어로 조회하여 user정보 저장
• 추후 회원정보나 회원등급에 따른 인증을 적용하기 위한 auth 미들웨어 적용

13. 특정 유저 정보 조회 서비스

• username이 일치하는 제빵수험생의 회원, 빵, 댓글 정보를 조회
• 투표 정보가 있을 경우 저장하기 위해 user 미들웨어로 조회하여 user정보 저장

🛠 PangYo Engineering Stack

• 💻 BE:
  • TypeScript, Node.js, Express.js, AWS EC2, PostgreSQL, TypeORM, Docker
• 💻 FE:
  • TypeScript, Next.js, React, TailwindCSS, ESLint

---

Reference

• 이 프로젝트는 레딧 사이트와 인프런 강의를 참조하여 학습목적으로 만들었습니다. 실무수준의 프로젝트이지만 학습용으로 만들었기 때문에 이 코드를 활용하여 이득을 취하거나 무단 배포할 경우 법적으로 문제될 수 있습니다.

---