Project Detail

프로젝트 상세내용 화면입니다.뒤로가기

    DailyC

    오늘의 외출 코디 공유. 유행하는 코디, 계절에 맞는 코디 정보를 확인. 원하는 코디 카드를 저장. 오늘의 출근룩, 데이트 룩을 공유 사이트

    사이트 링크 바로가기(서비스 종료)
    깃허브 바로가기

    작업기간 : 2023-12-01 ~ 2023-12-15 (2주)

    NextJS App Router
    TypeScript
    Tailwind CSS
    recoil
    React-Query(Tanstack Query)
    axios
    supabase
    MUI CSS
  • 프로젝트 소개
  • 프로젝트 주소
  • https://daily-c-zeta.vercel.app/main
  • 프로젝트 설명
  • tjdsksro90/DailyC (github.com)
  • 팀 프로젝트
  • 참여인원 : 프론트엔드 4명
  • 담당 파트
  • 마이 페이지 내가 작성한 글, 북마크한 글, 좋아요한 글을 supabase database를 통해 가져와 보여줍니다. 프로필 수정은 supabase Authentication으로 닉네임과 유저 이미지를 교체 구현
  • 좋아요, 북마크 코디 상세페이지 코디 카드 작성자의 상세 글 내용이 나와있는 정보 페이지 해당 게시물에서 좋아요나 북마크 기능들을 보여줄 수 있다
  • 해시태그 카테고리 작성자가 글을 쓸 때 남긴 해시태그별 리스트 정리 화면 작업
  • 게시물 CRUD 게시물 등록시 Supabase Storage를 이용하여 이미지 등록 최대 5개까지 등록. 해시태그 기능을 게시글 작성시 추가할 수 있게 구현 → 삭제시 DB리스트만 삭제가 아닌 storage 이미지를 추적해서 함께 삭제해서 storage 용량 관리
  • 트러블슈팅
  • 이슈 개시물 등록시 사진 최대 5개, 해시태그 등 많은게 한 페이지에서 이뤄지는데 수정페이지도 있기 때문에 따로 코드를 짜다보니 코드 관리의 어려움
  • 해결 태그가 없을 떄나 등록에서 이뤄지는 모든 input값들을 recoil로 전역적으로 묶어서 관리함으로써 수정 페이지에서도 불러올 때 간단하게 호출