Board

스프링 부트와 뷰 프레임워크를 사용한 Markdown 기반 게시판 프로젝트

Spring Boot, Vue, AWS, CI/CD, Test에 대한 이해를 목표로 진행한 프로젝트 입니다. TOAST UI Editor를 활용하여 게시글을 작성하고 조회할 수 있도록 구현하였습니다. dev 환경에서는 인메모리 데이터베이스를 연동하고 real 환경에서는 Amazon RDS로 생선한 Maria 데이터베이스를 연결하여 작동합니다.

Features

게시판 조회, 추가, 수정, 삭제
댓글 조회, 추가, 수정, 삭제
로그인/아웃, 회원가입, 회원정보 변경

Skills

Backend
- Java 11, Spring Boot, Spring Data JPA, Spring Security, Spring Validation, JWT, Gradle, Mockito, Junit 5
Frontend
- Vue.js, Vuetify, Vuex, Vue-Router, Axios
Database
- Amazon RDS for MariaDB
- In-memory H2
CI/CD
- Travis CI, AWS CodeDeploy, EC2, S3, Nginx
Tool
- Visual Studio Code

Systen architecture

Github, EC2, S3, Travis CI, CodeDeploy를 통해 CI/CD 환경을 구성하고 8081과 8082 중 동작하지 않는 포트에 배포 후 Nginx를 통해 reload 하여 서비스 중단 없이 배포가 진행되도록 구현했습니다. Spring Boot와 Vue.js를 연동하기 위해 build.gradle에 Vue.js가 먼저 빌드 되도록 설정하였습니다.

ERD

기본적으로 created_at, modified_at을 가지고 있으며 이를 @EnableJpaAuditing를 통해 수정이 발생하면 자동적으로 처리하도록 구현했습니다.

Screen flow

Installation and Getting Started

AWS 프리티어를 사용하고 있어 느리지만, http://board.oognuyh.tech 를 통해 접속할 수 있습니다. 또는,

git clone https://github.com/oognuyh/board-spring.git
cd board-spring
./gradlew bootRun --args='--spring.profiles.active=dev'

인메모리 데이터베이스와 연결하여 로컬에서 확인할 수 있습니다. 서버가 실행된 후, localhost:9998 로 접속하여 확인할 수 있습니다.

Screens

/board
/new-post
/post/{id}
/login
/signup
/my-page

What i learned

Spring boot
Vue
JWT
CI/CD

oognuyh/board-spring