기획서

BookUs 📒👥

Festa Clone!

아이디어 개요 (사용자 집단, 서비스 유형 및 목적)

• 서비스 유형 및 목적
  • Bookus는 손쉽게 이벤트를 주최하고, 등록할 수 있는 공간입니다. 분야에 상관없이 행사를 주최할 수 있으며, 무료 및 유료 티켓을 판매할 수 있습니다.
  • 티켓 발매와 등록 과정이 간단해 시간을 절약할 수 있고, 절약한 시간만큼 이벤트 내용을 풍성하게 만들 수 있습니다.
• 사용자 집단
  • 이벤트를 주최하거나 참석하려는 사용자
  • 이벤트 조회 및 예약 서비스

해당 서비스를 기획한 배경, 필요성

순간적으로 많은 트래픽이 몰리더라도 죽지않는 안정적인 선착순 예약 서비스를 목표로 합니다. Deview, FEConf 등의 이벤트에는 초대할 수 있는 한정된 인원이 있고, 이것을 선착순 예약으로 초대 기회를 제공하고 있습니다. 선착순 예약을 접수하기 위해 짧은 시간에 많은 트래픽이 몰리게 되며, 예약 서버가 죽지 않고 안정적으로 예약을 접수받을 수 있어야 합니다.

기능 목록 (사용자 관점에서 사용자에게 가치를 제공하는 기능과 설명, 기대 효과)

계정

• OAuth(Naver, Kakao)를 이용해서 로그인을 할 수 있다.
• 첫 로그인 시, 회원가입을 진행한다.
  • 이름, 전화번호 입력
• 로그아웃을 할 수 있다.
• 예약 완료된 이벤트를 조회할 수 있다.

메인

• 다가오는 이벤트의 티켓을 modal 형식으로 보여준다.
• 현재 예약 가능한 가장 가까운 이벤트들을 grid 형식으로 보여준다 무한 스크롤이 가능하며, 스크롤을 할 때마다 이벤트들이 추가된다.
• 각각의 이벤트는 이미지와 제목, 이벤트 날짜, 내용과 가격정보를 보여주며 클릭시 이벤트의 상세정보를 조회할 수 있다.
• 상단에는 이벤트를 생성할 수 있는 버튼이 있다.

이벤트 조회 (상세)

• 이벤트에 대한 상세한 내용을 조회할 수 있다.
  • 티켓의 좌석 점유 현황이 실시간으로 새로고침 없이 표시된다. (optional)
  • 이벤트 주최 장소가 (네이버) 지도로 표시된다.
  • 이미지와 이벤트 상세 내용, 제목, 열리는 날짜 등의 입력한 모든 내용을 보여준다.

이벤트 주최 (등록)

• 이벤트를 등록할 수 있다.
  • 공개여부
  • 대표이미지
  • 제목
  • 날짜 및 시간
  • 장소 / 상세주소(네이버 지도) / 장소설명
  • 내용(에디터)
  • 티켓
    • 이름
    • 설명
    • 가격
    • 수량 / 수량숨김여부
    • 1인당 구매 가능 개수
    • 판매 기간
    • 환불 마감 날짜

이벤트 예약 (구입)

• 구매할 티켓 내용이 보여진다.
• 실제 결제는 이루어지지 않음

호스트 조회 (주최자 조회 페이지)

• 주최자의 정보를 보여준다.
• 프로필 사진과 테마 이미지, 상세정보와 현재까지 개최했던 이벤트에 대해 보여준다.

내 페이지

• 우측 상단의 내 이름을 눌렀을 때 접근이 가능하다.
• 내 티켓, (나의) 호스트, 프로필 상세정보(수정가능), 주최한 이벤트 내용을 보여줌
• 상단의 탭 형태의 디자인이며 각각을 누를때마다 다른 기능을 보여준다.

주최자 페이지

• 참석자의 출석을 조회하고 체크할 수 있다.
• 참석자에게 이메일을 발송할 수 있다. (이건 옵션이 좋을 것 같아요.)
• 이벤트의 내용(날짜, 제목, 공개여부, 이미지, 주소, 설명)을 수정할 수 있다.
• 티켓 정보를 수정할 수 있다.(티켓 이름/유형, 설명, 수량, 가격, 수량 숨김 표시)

기술적인 도전 과제

• 과중한 트래픽이 몰려도 정해진 숫자만큼의 사용자만 예약되는 시스템
• 예약이 필요할 경우에만 서버의 개수가 늘어나는 Scheduled Scaling 시스템
• 호스트가 직접 좌석 배치에 대한 편집할 수 있는 기능 제공 (개발 후 오픈소스 시도)
• Storybook + Cypress 를 이용한 Bulletproof 컴포넌트 작성

개발 환경 (프로젝트에 필요한 기술, 작동 환경, 라이브러리 등 자세할 필요없음)

• Language

  • Typescript

• Convention

  • Airbnb style

• Front-end

  • React, Storybook (no css library)

• Back-end

  • Node.js, Express

• Test

  • Jest, Cypress, Supertest
  • ngrinder

• Infra

  • ncloud 기반
  • Travis CI -> Docker -> Kubernetes
  • 예약시 예약에 대한 서버의 Orchestration
  • Codecov를 통한 test coverage 측정

• API Document

  • swagger

• Libary (의존성, 미정)

  • 이메일 발송 및 이벤트 등록시 장문의 글을 작성할 때에 사용할 에디터
  • 날짜 선택 시 사용하는 달력