goumi1009 / team_modi_modi_fe

[11조] FE Repository

🤝 OTT 서비스 계정 공유 플랫폼

🔎 서비스 소개

• MODI(모두의 아이디)는 계정 공유를 통해 구독 서비스를 더욱 저렴하고 현명하게 이용할 수 있도록 도와주는 OTT 서비스 공유 플랫폼입니다.
• MODI를 통해 원하는 인원, 날짜, 규칙으로 다른 유저들과 계정을 공유해보세요!

🌏 기획 배경

• 코로나시대로 인해 더욱 보편화된 구독 경제는 동영상과 음악 등 콘텐츠 영역뿐만 아니라 식료품과 생필품 등 소비 시장 전반에 깊숙이 자리 잡아가는 추세이다.
• 이렇게 다양한 형태로 제공되는 구독 서비스는 여러 이점을 지니고 있지만 구독하는 서비스가 지나치게 많아질 경우 지출되는 고정 비용이 늘어나 부담을 느끼는 소비자가 늘어나고 있기에 구독 서비스를 좀 더 저렴하게 이용하기 위한 효과적인 솔루션이 필요한 상황이다.

🙍‍♂️ 타겟 유저

• 다양한 디지털 컨텐츠를 이용하고 있으며 트랜드에 민감하지만 주머니 사정을 고려해야하는 20's ~30's의 MZ세대

---

🤵 팀원 소개

김현석	장윤지	정예원	이경미
Dorr	Jen	Nancy	Kobi

---

⚙ 주요 기능 및 페이지 소개

메인 페이지	로그인 페이지
파티 모집 현황판 Ott별 파티 찾기 버튼	네이버 소셜 로그인 카카오 소셜 로그인

파티 생성 페이지	서비스 파티 목록 페이지
Ott 선택 시작일 및 기간 설정 파티 규칙 설정 파티 인원 설정 공유 게정 정보 입력	Ott 별 모집 중인 파티 리스트 파티별 상세정보 확인

결제 페이지	내 정보 페이지
파티 가입 및 결제 충전페이지 이동	내 정보 확인 닉네임 변경 내 파티 목록 확인

내 파티 정보 페이지	충전 페이지
내 파티 상세 정보 확인 공유 계정 정보 확인 공유 계정 정보 수정(Only Leader)	포인트 충전

404 페이지	다크 모드
잘못된 경로 알림	다크 모드 지원

---

💌 사용자 피드백

여기에 남겨주세요!

---

📑 프로젝트 사용 방법

• 배포 주소
  https://modipw.netlify.app/
• 실행 방법

  git clone https://github.com/prgrms-web-devcourse/Team_MODI_MODI_FE.git
  npm i
  npm start
  

📝 프로젝트 문서

• 팀 MODI Notion

---

🏗 폴더 구조

.
├── .github
├── node_modules
├── public
└── src
    ├── assets
    │   └── ...
    ├── components
    │   ├── Common 
    │   ├── Main
    │   ├── MyParty
    │   ├── Ott
    │   ├── PartyCreate
    │   ├── PartyJoin
    │   ├── PartyTitle
    │   ├── Payment
    │   └── Skeleton
    ├── contexts
    │   └── ...
    ├── hooks
    ├── constants
    ├── pages
    │   ├── CreatePartyPage 
    │   ├── LoginAlertPage
    │   ├── LoginPage
    │   ├── MainPage
    │   ├── MyPage
    │   ├── MyPartyDetailPage
    │   ├── NotFoundPage
    │   ├── OauthRedirectPage
    │   ├── PaymentPage
    │   ├── PointChargePage
    │   └── RecruitingPartyPage    
    ├── styles
    │   └── ...
    ├── utils
    │   ├── apis
    │   └── ...
    ├── App.js
    ├── Router.jsx
    └──index.js