kkoomin/lunch-strange

🍱 1400만개의 점심 메뉴를 보고왔다! 점심 추천 서비스

Lunch Strange

1,400만 개의 점심 메뉴를 보고 왔다.
“오늘은 뭐 먹지?” 라는 고민에 지친 직장인들을 위한 오늘의 점심 메뉴 결정 필터링 서비스

• 🎉 Site is Live! 🎉
• https://lunch-strange.netlify.app/ (서버는 Heroku로 배포)

• '구웅' 팀 프로젝트 :
  • 팀장 구민하 @kkoomin (프론트엔드 개발)
  • 팀원 엄재웅 @EomJaeWoong (백엔드 개발)

---

주요 기능

1. 유저가 설정한 필터를 거친 점심 메뉴 및 음식점 정보 제공

   • 가격, 현 위치로부터의 거리, 음식 카테고리를 필터로 설정
     (ex) 8000원 미만, 현재 위치 기준 500m 이내, 한식, 분식 등)
   • 유저 편의를 위한 클릭형 필터 태그 기능 제공

2. 지도 API를 이용하여 음식점 위치 및 해당 음식점의 메뉴 정보 제공

   • Kakao Map API 적용
   • 지도 위에 필터링 된 음식점 위치 마커로 표시
   • 해당 마커에 마우스를 올리면 음식점 이름이 표시, 마커를 클릭하면 음식점 상세 페이지로 이동
   • 필터링 결과 음식점 리스트는 6개씩 보여지며, 더보기 버튼을 누르면 추가적으로 랜더링 됨
   • 음식점 리스트 화면에서는 필터링 된 가격에 해당하는 메뉴만 볼 수 있고, 음식점 상세 페이지에서 음식점 전체 메뉴를 볼 수 있음

3. 음식점 정보 제공

   • 필터링 된 리스트에서 더보기를 클릭할 시 음식점 상세 페이지로 이동
   • 상세 페이지에서 음식점 이름, 주소, 연락처, 위치, 전체 메뉴, 태그, 사진 등을 확인 가능

4. 구내식당 및 점심부페 메뉴

   • 구내식당의 식단표와 점심 한식 뷔페를 제공하는 음식점의 당일 메뉴를 볼 수 있음
   • 이미지형식으로 보여지므로, 주기적으로 식단표를 제공하거나 홍보 차 올리도록 문의할 수 있는 문의 양식을 제공

5. 편의점 추천 조합 공유 게시판

   • 게시판 글쓰기, 읽기, 수정, 삭제 기능
   • 게시글 좋아요 기능
   • 글쓰기, 수정, 삭제는 로그인한 유저만 사용 가능

6. Kakao Login API을 통한 로그인 기능

   • 로그인, 로그아웃 가능
   • 사용자 Email, Nickname을 사용자 동의 하에 제공받아 사용

추후 적용될 기능

1. 로그인 된 유저에 한하여 음식점 평점 주기 및 리뷰 작성 가능
2. 강남, 역삼 지역권 이상으로 음식점 정보 확대
3. 보다 정확한 현 위치 찾기 기능

기술 스택

• Front-end: Vue.js, SCSS, JavaScript
• Back-end: Node.js, Express, TypeScript
• Database: MongoDB
• Etc: Vuex, Vue Apollo, GraphQL, Apollo Server, Kakao Map, Kakao Login