1차 개발 : 2025.03.12 ~ 2025.03.16(5일)
2차 개발 : 2025.03.30(1일), 2025.05.11(1일)
전체 개발 기간 : 1주일
2025.03.17 ~ 2025.07.22
총 4개월 가량 운영
https://baro-bob-fe-v2.vercel.app
점심시간은 한정되어있고, 아카데미와 계약된 식당은 정해져 있습니다.
점심시간은 붐볐고, 가끔은 자리가 없어서 대기할 때도 있었습니다.
또한 점심 식대는 정해져 있었고, 누군가는 저렴한 메뉴를, 누군가는 식대를 초과하는 메뉴를 먹을 때도 있습니다.
식당측에서도, 이용자 측에서도 식대의 총 합을 계산하기 어려워, 총 식대를 초과하지 않았어도 1인당 식대를 초과한 이용자들은 차액을 결제했어야 했습니다.
- 장부에는 수기 싸인이 꼭 필요하다.
- 아카데미의 팀프로젝트 기반 프로그램이라 식사는 팀별 식사를 지향한다.
- 당일의 식대는 당일에만 사용해야하며, 다른날 혹은 저녁시간에 사용할 수 없다.
- 식사를 했다면, 점심시간 내의 영수증 혹은 주문 내역이 필요하다.
- 식당 점심시간은 바쁘기 때문에, 본격적인 점심시간 이전인 11시 30분에 연락을 주면 무리없이 받을 수 있다.
- 당일 방문 예정 시각을 알려주면 그 시간에 맞춰 미리 세팅할 수 있다.
- 방문 팀마다 정확한 인원수를 알려준다면 그 인원수에 맞게 테이블 세팅을 하는게 효율적이다.
- 주문 및 방문 인원을 미리 알려주면 식당측도 시간과 공간을 아낄 수 있어 환영이다.
- 아카데미 측을 위해 무료 공기밥 추가 및 점심특선 메뉴 할인 적용하겠다.
- 총 방문 인원과 총 식대를 초과하지 않는다면, 팀별 초과금액은 지불할 필요 없다.
- 오래걸리는 메뉴는 주문 메뉴로 지양해달라.
- 아카데미 학생들만 사용하는 서비스이고, 개별 주문이 아닌 팀별 주문 기반이기 때문에 회원가입 및 로그인을 통해 개인화된 주문 보다 누구든 조를 선택해 팀당 대표 1인이 주문하는 방식으로 결정
- 배포 후 사이트를 통해 주문내역을 확인하는 방식보다는 관리자가 직접 메뉴를 취합해 문자 혹은 메신저를 통해 전달 -> 식당측 응답을 통해 주문 요청 확인
- 가능한 메뉴만 메뉴로 등록, 할인되는 점심 특선 메뉴 적용
- 이용자는 당일 오전 9시 ~ 11시30분까지 팀명, 주문메뉴를 정해 주문합니다.
- 관리자는 주문 받은 메뉴를 정리해 오늘의 주문 메뉴와 방문 예정 시간을 식당에게 전달합니다.
- 주문 전달 후 12시 까지 주문 수정이 필요하다면, 운영자에게 직접 연락해 주문을 수정할 수 있습니다.
- 메뉴 보기: 다양한 카테고리별 메뉴를 확인하고 상세 정보를 볼 수 있습니다.
- 장바구니: 원하는 메뉴를 장바구니에 담고 수량을 조절할 수 있습니다.
- 주문하기: 장바구니에 담은 메뉴를 간편하게 주문할 수 있습니다.
- 주문 내역: 오늘의 주문 내역을 확인할 수 있습니다.
barobob-front-v2/
└── src/
├── app/ # Next.js App Router (페이지, 레이아웃)
├── components/ # 🧩 아토믹 디자인 기반 UI 컴포넌트 라이브러리
│ ├── ui/ # - Atoms/Molecules: 가장 작은 UI 단위 (Button, Input)
│ ├── modules/ # - Organisms: 기능별 복합 UI 모듈 (CartDrawer, MenuSection)
│ ├── pages/ # - Templates: 페이지 단위의 콘텐츠 조합
│ ├── layouts/ # - Page Layouts: 공통 페이지 구조 (Header, Footer)
│ └── ...
├── actions/ # ⚡️ Next.js 서버 액션 (데이터 변경 로직)
├── hooks/ # 🎣 공통 커스텀 훅 (useToast, useDebounce)
├── store/ # 🏪 전역 상태 관리 (Zustand)
├── providers/ # 🌐 전역 프로바이더 (React Query, Context API)
├── lib/ # 🛠️ 공통 유틸리티 함수 (utils.ts)
├── types/ # 🏷️ 전역 TypeScript 타입
└── data/ # 📝 메뉴 관련 데이터
git clone https://github.com/your-repository/barobob-front-v2.git
cd barobob-front-v2pnpm을 사용하여 의존성을 설치합니다.
pnpm install다음 명령어를 실행하여 개발 서버를 시작합니다.
pnpm dev |
 |
초기 운영을 하며 이용자들의 피드백을 받음
- 메뉴가 담기는데, 효과가 없어서 담겼는지 잘 모르겠다.
- 주문하고 오래된 주문이 밀리면서, 누가 먼저 주문했는지 보기가 어렵다.
- 이미지가 없어서 메뉴 보기 힘들다.
<팀선택 화면>
<장바구니 담기>
- zustand와 framer-motion을 이용해서 장바구니 담을 시 애니메이션과 장바구니로 날아가는 효과 적용
<주문 내역>
기존 서비스에는 인증, 인가가 구현되어 있지 않아 누구든 주문 가능하고, 삭제 가능했다. 그래서 누군가가 다른 팀의 주문을 실수로 삭제할수 있고 범인을 찾을 수 없다. 실제로 그런 일이 일어남
서비스 긴급 공지 및 삭제 기능은 개발자만 가능하게 임시로 수정(주문 삭제나 수정이 필요할 시 직접 개발자에게 전달)
바로밥으로 인해 하루 약 15~20분 정도
약 점심시간의 30%에 해당하는 시간을 아낄 수 있었다는 응답을 받음
 |
 |