Skip to content

short-form-challenge/Ddaychill-front

Repository files navigation

Dday Chill

서비스 컨셉

  • 브랜드 이름: Dday7(chill)

     단기목표를 정해서 습관을 들이기 위해 7일동안 숏폼 영상을 올리는 플랫폼입니다.
    
  • 자신이 정한 목표 카테고리에 영상을 올리고 사람들과 공유합니다.

  • 7일 연속 영상을 업로드하면 뱃지(보상)를 받을 수 있고, 혼자 하는 것보다 사람들과 영상을 공유하면서 함께 의지를 다지기위한 목적을 가지고있습니다.

배포

🔗 배포 링크 이동

(현재 백엔드 배포 중지로 서비스 이용 불가)

기술 스택

nextjs ,eslint, react-query, react-hook-form, typescript,styled-components

주요 구현 내용

  • form 사용 시 react-hook-form과 yup을 사용한 validation
  • email과 nickname 입력 시 debounce로 api 요청하여 중복 체크 validation
  • 을 Component화 하여 각 form에 맞는 함수 실행
  • sessionStorage에서 token을 검사하여 회원전용 페이지에 진입 시 가입유도 모달
  • 비디오, 이미지의 용량과 파일타입 등을 validation 하여 api 호출 전에 진행 막음
  • react-query 에서 제공하는 infinite query 를 이용하여 가장 마지막 비디오의 아이디를 백엔드로 요청보내 다음 비디오 부터 10개 가져오는 방식으로 무한스크롤

프로젝트 실행

$ yarn
$ npm run dev

페이지

도전 리스트 & 상세

dday7 영상리스트 dday7 영상 상세

회원가입 & 로그인

dday7 회원가입 dday7 로그인

프로필

dday7 프로필 dday7 내 정보편집 dday7 뱃지

타겟 고객(영상 업로드 고객, 영상 시청 고객)

  1. 공통
    1. 목표를 세우되 3일 이상 실천하지 못하는 고객
      1. ex) 아가리어터 등
    2. 같은 목표를 가진 사람과 함께 목표를 실천하고 싶은 고객
    3. 자신의 일상을 공유하는 것을 좋아하는 MZ세대
  2. 운동 (Health)
    1. 운동 등 취미를 공유하고 싶은 고객
    2. 운동 방법을 공유 하고 싶은 고객
    3. 운동에 대한 조언을 받고 싶은 고객
      1. 댓글 기능 추후 개발 예정
  3. 공부 (study)
    1. 공무원 등 장기 시험을 준비하는 고객
    2. 혼공 생활에 긴장감을 주고 싶은 고객

장기적인 비지니스 모델

  1. 운동 (Health)

image

  1. 공부 (Study)

image

About

숏폼 프로젝트 프론트엔드

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •  

Languages