[소개] MOS는 코로나 사태로 인한 비대면 결제 시스템입니다. 학교 내 교내 식당이나 카페에서 비대면으로 테이블에 부착 되어 있는 QR코드를 촬영하여 간편하게 메뉴를 주문할 수 있는 시스템입니다. 커피를 주문하기 위해 줄 서서 기다리지 않고 테이블에 앉아서 부담 없이 메뉴를 선택하고 주문할 수 있습니다.

[개발 환경 및 기술] MOS 프로그램은 인텔리제이 통합 개발 환경을 통해서 개발했습니다. 빌드 도구로는 Gradle을 이용했으며 Spring 애플리케이션 프레임워크를 사용했습니다. 로직 레스 뷰 페이지를 구현하기 위해 핸들바와 머스터치를 사용했습니다. 데이터베이스 매핑 기술로는 JPA를 사용했으며 로컬 환경에서의 DB 저장을 위해 H2 데이터 베이스를 사용했습니다. 서버 환경 DB 저장을 위해 마리아 DB를 사용했으며 AWS RDS에 저장했습니다. 서버 환경을 위해 AWS EC2에 리눅스 서버를 구축했으며 AWS S3 온라인 스토리지에 메뉴 이미지를 저장했습니다.

• 비회원 장바구니

  세션 스토리지를 이용하여 비회원 장바구니 기능을 구현하였으며 세션 스토리지의 ID 값을 이용하여 비회원들을 구분하고 주문번호를 부여하였습니다.

• 클라이언트 간 통신

  구매자가 결제를 하면 주문 내역을 웹 소켓에 담아 판매자에게 전달하도록 구현하였습니다. 또한 조리 상태나 결과도 웹 소켓을 통해 구매자에게 전달합니다.

[개발 결과] Spring이 권장하는 Logic-Less-View 개발을 연습하기 위해 Mustache 템플릿을 적극 활용하였습니다. 직전 프로젝트까지 MVC 패턴에서 사용하던 DB연결 방식을 MyBatis에서 JPA로 변경하여 진행하였습니다. 구매자와 판매자의 클라이언트 간 통신 환경 구축을 연습할 수 있는 프로젝트였습니다.

1. 구성

• 구매자

  • 메인 화면
    • 시작 화면
  • 주문 화면
    • 메뉴 선택
    • 장바구니 담기 기능
  • 장바구니 화면
    • 장바구니 내역 확인 및 메뉴 삭제
  • 결제 선택 화면
    • 결제 수단 선택
  • 주문 결과 화면
    • 주문 번호 출력 및 조리 상태 출력

• 판매자

  • 메인화면
    • 시작 화면
  • 메뉴 관리 화면
    • 메뉴 등록
    • 메뉴 수정
    • 메뉴 삭제
  • 판매 화면
    • 주문 리스트
    • 조리 완료 및 주문 취소 기능