GreenPlate

[플레이 데이터] 한화시스템 BEYOND SW캠프
6기 3차 프로젝트 팀 404x

🤚 404x 팀원

Team Leader
오규림
김다윤 이가은 장유정

📌 프로젝트 주제

건강한 삶을 위한 나만의 식재료 추천 사이트

레시피를 추천해주고, 레시피 속 필요한 재료를 한 번에 담을 수 있는 기능을 제공

레시피에 사용된 재료 각각의 칼로리를 보여주고, 장바구니에 상품을 담았을 때 장바구니에 담긴 전체 상품의 칼로리 합계를 보여주는 기능

라이브 스트리밍과 커머스의 합성어인 라이브커머스 서비스 제공
추가 자료

🔧 기술 스택

프론트엔드
Vue.js pinia NginX
백엔드
JWT
DB
MariaDB Amazon RDS Redis
클라우드

협업 툴
Git GitHub Notion Figma

🖥️ 화면설계서

Figma 화면 설계서

🔧 시스템 아키텍처

시스템 아키텍처

Amazon RDS
  • 별도의 설치과정 없이 편리하게 DB를 구성하기 위해 Amazon RDS를 사용했습니다.
Amazon S3
  • 상품의 썸네일, 상세 이미지 등 상품과 관련된 이미지를 저장하기 위해 S3를 사용하였습니다.
Backend Server
  • EC2를 이용하여 서버를 배포했습니다.
  • 동일한 EC2에 In-Memory 기반의 DB인 Redis 서버를 설치하여 이메일 인증을 빠르게 처리할 수 있도록 하였습니다. 또한, 데이터에 유효 시간(3분)을 설정하여 유효 시간이 지난 데이터는 자동으로 삭제되도록 처리했습니다.
Frontend Server
  • Frontend Server와 Backend Server는 각각 다른 인스턴스에서 실행되고 있기 때문에 CORS 에러 없이 통신하기 위해서 Proxy Pass 기능이 필요했습니다.
  • 이 기능을 위해 EC2에 Nginx를 실행시켰습니다.
PortOne
  • 상품 결제를 위해 PG사의 결제 대행 서비스 중 하나인 PortOne을 사용하였습니다.

⭐ 접속 주소

접속 주소

✨ 기능 테스트

User

회원가입

로그인

Company

회원가입

로그인

Item

상품조회

상품검색

장바구니 담기

상품 등록

Cart

장바구니 페이지

Order

카카오페이 결제

카카오페이 환불

Recipe

레시피 등록

레시피 목록

레시피 상세

Mypage(User)

주문내역

주소

키워드

Mypage(Company)

주문관리

주문관리-송장번호입력

상품등록

상품목록 조회/수정