1.png

분류 : 카페 홈페이지 + 스마트 오더 사용 기술 : Git, Spring, mySql, myBatis, JQuery, BootStrap, JSP, javascript, css, html

설명 : 가상의 카페 브렌드를 만들어 매장과 메뉴 및 매장(체인점) 추가, (매장 및 메뉴는 Hollys 브랜드 참고) 카페의 정보를 확인하고 맴버십을 볼 수 있으며 스마트 오더로 매장 지정하여 메뉴 주문 가능

본인 구현 기능 :

스마트 오더 전체(카카오맵 API를 활용한 매장 선택, 장바구니 및 주문, 결제), 관리자 페이지 전체(유저 관리, 마일리지 관리, 메뉴 및 매장 추가) , 채팅 전체 (Ajax를 활용한 채팅 구현), 게시판 댓글 무한스크롤 구현, 마이페이지 주문내역 및 포인트, 등급 확인 구현, 전체 CSS 통합 및 관리


본인 구현 기능

스마트 오더 기능(Ajax, 카카오 API, PORT ONE)

order1.png

매장 검색시 카카오맵 API를 활용하여 매장 위치를 확인하고 선택 할 수 있는 기능 구현하였습니다.

매장 선택 후 DB에 존재하는 메뉴 목록을 불러와 화면에 표시, 장바구니에 담거나 담은 물건의 개수를 변경,삭제가 가능합니다.

메뉴 선택 완료 시 주문 내역 표현, 포인트 사용 여부 선택 가능합니다.

이후 결제방식 선택후 주문하기로 넘어갑니다.

카카오 페이 API

카카오 페이 API

PORT ONE API

PORT ONE API

스크린샷 2024-01-23 215656.png

카카오 레프레시, 액티브 토큰을 이용하여 지정 된 사용자(관리자)에게 카카오톡 메시지 보내기를 구현, 관리자에게 사용자의 주문 내역이 카카오톡으로 전송될 수 있게 하였습니다.

결제를 완료하면 주문 내역과 대기 번호가 사용자에게 부여되고 이 주문 내역을 추후 사용자가 마이페이지에서 확인 할 수 있습니다.

order3.png


관리자 페이지(Ajax)

그림.png