[WIL] mini project 'Workout Done Today'

Chaewon Yoon (Jamie)·2022년 9월 11일
0

inovation camp for frontend

목록 보기
28/30

ReadMe

프로젝트 이름 : 오운완 (Workout Done Today)

프로젝트 설명 : 운동을 하고 인증하면 운동해야 하는 사람들이 동기부여를 받아 자신도 운동을 하고 사진으로 인증을 하게끔 하는 웹 페이지

https://github.com/jamie7dev/Workout_Done_Today
(Back Github : [https://github.com/BeomSeogKim/week6])

기능 구현 List

  • 회원가입
    ID 중복 검사
    ID 길이 및 영문, 숫자 유효성 검사
    PW 및 PW Confirm 유효성 검사
  • 로그인
    ID, PW 입력시 공백 유효성 검사
    ID, PW 일치 검사
    Access Token과 Refresh Token을 local storage에 저장하고 모든 페이지에서 로그인 유지
  • 게시글 작성
    게시글 CRUD 구현 (작성자만 수정/삭제 가능)
    댓글도 함께 조회
    이미지 파일 업로드시 미리보기 구현
    게시글 수정시 이미지, 타이틀, 내용 수정 가능하며 리로드 없이 바로 확인 가능
    댓글 작성
    댓글 CRUD 구현 (작성자만 수정/삭제 가능)
    리로드 없이 변경사항 바로 확인 가능
    조회수 count
    상세 게시글 조회시 게시글 조회수 증가
    (메인 페이지 각 게시물에서도 확인 가능)

아쉬운 점

  • 좋아요 기능 구현
    회원은 각 게시글 및 댓글에 대해서 한번씩만 좋아요가 가능함
    좋아요를 누르지 않은 게시글 및 댓글에 대해서는 좋아요 취소가 불가능함
    회원의 좋아요 내역을 알 수 있도록 설계함
    마이페이지 기능 구현
  • 회원이 작성한 게시글 조회 가능
    회원이 작성한 댓글 조회 가능
    회원이 좋아요를 누른 게시글 조회 가능
    회원이 좋아요를 누른 댓글 조회 가능
  • Access Token은 보안상 cookie에 저장하고 Refresh Token만 local storage에 저장하는 걸 구현했으면 더 좋았을 것 같음.

Front) TroubleShooting

새로고침 해야 게시물 변동 사항 반영되는 문제
=> Redux toolkit 사용으로 미리 보여주기로 해결
게시물 및 댓글 요청 응답시 시간 파일이 있어 데이터를 꺼내기 어려운 문제
=> Backend에 요청해 Response 내용 수정 후 기능 구현
헤더에 Refresh-Token 으로 와서 Front 단에서 "-" 를 처리하기 어려워 수정 요청함
=> 헤더에 담기는 토큰 이름을 RefreshToken 으로 수정
작성자만 게시글과 댓글을 수정/삭제 할 수 있는 기능 삼항연산자 이용해서 작성자가 현재 로그인 된 유저일 경우에만 (localstorage에 username까지 저장해서 토큰과 같이 가지고 다님) 수정/삭제 버튼이 보이게 구현

API 명세서

참고링크 : https://www.notion.so/12-SA-0a642b7c476b45c39f7497b9609b46ee

회고

백엔드와 처음 협업한 미니 프로젝트!
API명세서 작성부터 너무 어려운 점들이 많았는데, 어찌어찌 또 일주일이 지나고 한 프로젝트가 끝났네.
지금은 클론코딩 주간이 시작되어 두 번째 협업을 진행하고 있는데
처음 한 미니 프로젝트를 바탕으로 API명세서 작성은 좀 더 수월하게 진행됐다.
부족한 점이 너무 많아서 보충할 시간이 필요한데 바로 클론코딩 프로젝트가 시작됐다 ㅠ.ㅠ
언제 해... 언제 해... 말미잘 파이팅

profile
keep growing as a web developer!🧃

0개의 댓글