/schoolvery-fe

Schoolvery(스쿨버리) - 교내 배달비 공유 서비스 프론트엔드

Primary LanguageTypeScript

Schoolvery

교내 배달 비용 공유 플랫폼 스쿨버리!


  • 스쿨버리는 기존의 비싼 배달비와 최소 주문 금액 문제를 해결하기 위해 만들어진 서비스입니다.
  • 스쿨버리의 핵심 아이디어는 인접한 사람들과 배달 음식 비용을 공유하는 것입니다.

Feature

a. PoC

  • 사용자 A가 모집 게시글을 등록한다.
  • 사용자 B가 A가 올린 모집 게시글에 참여한다.
  • 사용자 A와 B는 채팅방 안에서 메세지를 보내며 소통한다.

b. Additional Features

  • 회원가입 및 로그인
  • 카테고리, 가게별 필터링
  • 유저 개인 페이지를 통한 개인정보 관리

c. Demo

  • Main Page

  • Posting Page

  • Chat Page

  • User Page


System Architecture


Tech Stack

Front-end

icon icon icon
icon icon icon icon icon
icon icon icon

Emotion
Emotion logo
Recoil
Recoil logo

Vite를 사용하여 빠른 빌드를 목적으로 하고,
React를 사용하여 사용자와의 상호작용을 하는 앱화면을 효율적으로 구성하고,
Recoil을 이용하여 유동적인 값들의 상태를 관리했습니다.
React Query를 사용하여 비동기 관련 로직 및 상태를 관리하고,
Jest, React Testing Library로 테스트 코드를 작성하여 코드의 신뢰성을 높였습니다.


Back-end

icon icon icon
icon icon icon icon
icon icon icon
  • Spring Data JPA(Hibernate)
  • QueryDSL
  • JUnit 5, mockito
  • SLF4J
  • JWT

Springboot로 웹 어플리케이션 서버를 구축하고,
Spring Data JPA(Hibernate)로 객체지향 데이터 로직을 작성했습니다.
QueryDSL로 컴파일 시점에 SQL 오류를 감지하고, 동적인 쿼리를 작성했습니다.
Swagger로 API 문서를 작성하여 클라이언트와 소통하였습니다.
데이터 베이스는 MySQL과 H2를 사용하였습니다.


Infra Structure

icon icon icon
icon icon
  • Github Actions
  • AWS EC2
  • Prometheus, Grafana
  • AWS Route 53

Docker로 동일한 백엔드 환경을 구축하고,
AWS EC2 인스턴스(Ubuntu, t3a.medium)에 서버를 배포하였습니다.
Github Action을 사용하여 지속적인 배포 파이프라인을 만들고,
Prometheus와 Grafana를 통해 서버의 상태를 모니터링했습니다.
Git과 Github을 사용하여 코드를 관리하고, 팀원들과 협업하였습니다.


Communication

icon icon

How to run

Frontend

go ro frontend repo 👉🏻 click here !

프로젝트 실행

yarn start

Backend

go to backend repo 👉🏻 click here !

.env.example 을 참고하여 .env 파일에 있는 환경변수를 작성해준다.

DB_USERNAME=
DB_ROOT_PASSWORD=
DB_DATABASE=
DB_HOST=

JWT_HEADER=
JWT_SECRET_KEY=
JWT_EXPIRE_TIME=

PORT=

AdminMailId =
AdminMailPassword =

slack_api =

jar 파일을 생성해준다.

./gradlew build

# 혹은

./build.sh

앞선 방법으로 빌드가 안될 경우

gradle wrapper

# 혹은

./initialize.sh

루트 경로에서 docker-compose 명령어를 사용하여 어플리케이션을 실행시켜준다.

docker-compose up -d --build

Domain


Team Members

Backend Backend Backend Backend/Frontend Frontend
🦈 김의빈 🐠 정수빈 🦞 한승욱 🐋 김서영 🦭 장동현

If you want to know more bout us click here !


icon
icon