봄비(Bomvi)는 나만의 플레이리스트를 꾸미고 공유하는 모바일 SNS 웹앱 서비스를 제공합니다.
이 서비스는, 플레이리스트 추천 및 탐색, 구독 플레이리스트 타임라인, 나만의 마이페이지, 미니 영상 플레이어를 경험할 수 있습니다.
 |
 |
 |
 |
 |
|---|---|---|---|---|
| 권혁준 | 김승민 | 이윤환 | 임효정 | 신혜진 |
| @red-dev-Mark | @miniseung | @unanbb | @dyeongg | @clara-shin |
| 홈페이지 검색페이지 구독페이지 동영상 업로드 좋아요/구독 기능 |
공통컴포넌트 로그인페이지 플리메인페이지 구현 |
댓글 페이지 댓글 삭제 구독 페이지 공통 컴포넌트 |
홈페이지 퍼블리싱 댓글 작성 무한스크롤 playwright 테스트코드 공통컴포넌트 |
미니영상플레이어 플리메인페이지 마이페이지 플리생성, 라우터 레이아웃 공통컴포넌트 |
- 겁먹지 않고 새로운 기술을 도입해보기
- 토이2에서 사용했던 상태관리 툴과 비교해서 Zustand와 TanStack Query를 경험해보기
- 조금 더 타입스크립트에 익숙해지기
- 사용자들이 서로 인터랙션하는 데이터 흐름을 구현해보기
-
나만의 플레이리스트를 꾸미고 공유하는, 영상공유 SNS 모바일 웹 서비스 개발
-
서비스가 추구하는 핵심가치:
- 영상/음악 시청과 탐색을 동시에 할 수 있는 멀티 서비스 제공
- 나만의 개성이 드러나는 개인 공간을 꾸미기 기능
- 익숙하고 눈이 편안한 디자인 및 이해하기 쉬운 UI/UX
-
타겟: 영상공유 플랫폼에 익숙한 2-30대
-
사용 규모: 50명
-
서비스 필요한 이유:
- 항상 모바일을 손에서 놓지 않는 2-30대는 창의적이고 트렌드에 민감하며 새로운 콘텐츠를 발굴하고 공유하는 것을 즐긴다
- 나와 취향이 비슷한 플레이리스트만 탐색하고 구독하고 싶다
-
페르소나
- 김지우 / 20대 / 여성 / 영상콘텐츠학과 대학원생 / 서울 / 창의적 / 트렌드에 민감함
- 취미: 새로운 콘텐츠 공유하기 / 항상 어딜가나 휴대폰을 손에 들고 있다
- 기획(피그잼): 예시 디자인 시안 확인하며 기능명세서, 데이터베이스 설계 및 컴포넌트 정의서 설계
- 디자인, 와이어프레임 (피그마)
- 재능기부: 봄비 로고제작 @서윤님
8월 19일(월) ~ 9월 9일(월) (약 3주)
-
1주차: 기획 및 설계/디자인(7일 소요), 개발환경 세팅
-
2주차: 개발 집중기간, 컴포넌트 및 페이지 개발, 서버 연동
-
3주차: 개발 집중기간, 테스트 및 수정
React, TypeScript, Emotion을 사용하여 컴포넌트 기반의 UI를 효율적으로 개발하고,
정적 타입 체크로 코드 안정성을 높이며, CSS-in-JS로 동적 스타일링을 손쉽게 관리합니다.
클라이언트 상태 관리와 서버 상태 관리의 필요성을 효율적으로 해결해 주며,
복잡도를 줄이면서도 확장 가능한 애플리케이션 구조를 지원하기 때문에 선택했습니다.
firestore, 인증, 호스팅 등을 사용하여 빠르고 효율적인 개발을 위해 Firebase를 사용했습니다.
Vite는 빠른 개발 환경과 최적화된 빌드 성능을 제공하기 때문에 선택했습니다.
E2E 테스트 기능, 그리고 자동화된 디버깅 도구를 제공하여, 신뢰성 있는 웹 애플리케이션 테스트를 위해 선택했습니다.
