Skip to content
@Cafe-Manage-Service-CAFE-IN

Cafe in

카페에 꼭 필요한 서비스

header

🍰 카페 인 - Cafe in 🍩


카페에 꼭 필요한 서비스 ! 메뉴 주문 및 카페 운영 관리 서비스 Cafe-in입니다. 🐰

Cafe-in의 프로젝트 진행 방식 및 과정은 Wiki 페이지에서 확인할 수 있습니다.



💛 Cafe-in 사용 해보기

  • 시작 페이지의 고양이 발 🐾을 클릭하면 관리자 로그인 페이지로 이동합니다. 로그인 비밀번호는 0716입니다.

  • 모두가 접속할 수 있는 서비스이기 때문에, 불건전한 테스트는 삼가해주시길 바랍니다. 🥰



Hits

프로젝트 구성원 🐰


강지윤 FE 안유진 FE 오소민 FE
강지윤 깃허브 프로필 이미지 안유진 깃허브 프로필 이미지 오소민 깃허브 프로필 이미지


프로젝트 개요

💡 프로젝트 주제 : 메뉴 주문 및 카페 운영 관리 서비스

🏃🏻‍♂️ 프로젝트 구현 기간 : 2023.07.16 ~ 2023.08.22

🖼 디자인 시안 : Cafe-in Figma


기술 스택



디자인 시안

카페 인 디자인 시안

핵심 기능 소개

1. 메뉴 조회 및 메뉴 주문

  • 카테고리 별로 메뉴를 조회할 수 있고, 특정 카테고리는 메뉴 선택 시 옵션을 추가할 수 있습니다.
  • 메뉴별 옵션 및 수량을 선택할 수 있습니다.
  • 유저는 결제 시에, 포인트 적립과 포인트 사용이 가능합니다.

2. 메뉴 관리

  • 서비스 관리자는 카테고리, 메뉴를 추가 및 수정, 삭제할 수 있습니다.
  • 카테고리 별 옵션 추가 가능 여부, 재고 상태를 관리할 수 있습니다.

3. 대기 신청 및 대기 관리

  • 서비스 관리자는 카페 운영 상황에 따라 대기 가능과 대기 마감을 선택할 수 있습니다.
  • 대기 가능 시, 사용자는 대기 신청을 할 수 있습니다.
  • 서비스 관리자는 대기 상황을 보며 대기 취소, 착석완료를 설정할 수 있고 대기 명단을 확인할 수 있습니다.


서비스 기능 목록

🎈 사용자 모드

  1. 메뉴 조회 및 메뉴 주문
  2. 포인트 적립 및 포인트 사용
  3. 대기 신청

🍒 관리자 모드

  1. 메뉴 및 카테고리 관리
  2. 대기 관리
  3. 주문 관리
  4. 매출 내역 조회
  5. 포인트 내역 조회
  6. 테마 및 색상 설정


시연 영상

▶ 시연 영상 보러가기



성능 및 웹 접근성 개선

LightHouse 기준 모든 페이지의 접근성, 권장사항, 검색엔진 점수를 100점으로 맞추었고 성능은 90점 이상이 나오도록 개선하였습니다.

  • 키보드로 접근 가능하게 설정하고 색상 대비 (일반 텍스트의 경우 4.5:1, 대형 텍스트의 경우 3:1)을 맞추었습니다.
  • aria-*를 활용하여 웹 접근성을 높였습니다.
  • React.memo, useMemo, useCallback을 활용하여 메모이제이션 작업을 통해 불필요한 렌더링을 줄였습니다.
  • 이미지 요소에 alt 속성을 추가하였습니다.



라이브러리

"dependencies": {
		"@testing-library/jest-dom": "^5.17.0",
		"@testing-library/react": "^13.4.0",
		"@testing-library/user-event": "^13.5.0",
		"@types/jest": "^27.5.2",
		"@types/node": "^16.18.38",
		"@types/react": "^18.2.15",
		"@types/react-dom": "^18.2.7",
		"@types/react-router-dom": "^5.3.3",
		"@types/styled-components": "^5.1.26",
		"eslint": "^8.45.0",
		"eslint-config-prettier": "^8.8.0",
		"eslint-plugin-prettier": "^5.0.0",
		"firebase": "^10.1.0",
		"prettier": "^3.0.0",
		"prop-types": "^15.8.1",
		"react": "^18.2.0",
		"react-dom": "^18.2.0",
		"react-router-dom": "^6.14.2",
		"react-scripts": "5.0.1",
		"recoil": "^0.7.7",
		"styled-components": "^6.0.4",
		"styled-reset": "^4.5.1",
		"typescript": "^4.9.5",
		"web-vitals": "^2.1.4"
	}


footer

Pinned Loading

  1. .github .github Public

Repositories

Showing 2 of 2 repositories
  • cafe-in Public

    카페 운영 관리 및 메뉴 주문 서비스

    Cafe-Manage-Service-CAFE-IN/cafe-in’s past year of commit activity
    TypeScript 0 3 2 0 Updated Dec 27, 2023
  • .github Public
    Cafe-Manage-Service-CAFE-IN/.github’s past year of commit activity
    0 0 0 0 Updated Sep 13, 2023

Top languages

Loading…

Most used topics

Loading…