[Picasso] 프로젝트 개요

목차

프로젝트 링크

Picasso

GitHub - donsonioc2010/picasso: temp name

1) 계기 및 개요

내가 코드에 대해 재밌는 요소를 많이 많들어 볼 수 있을만한 소재의 토이프로젝트로, 간단한 미술품 경매 사이트를 만들어 보는것을 해봤다.

해커톤의 개념으로 짧은 기간 개발을 진행해야 했고, 전체적인 팀의 코드관리까지 도맡아 진행했었다.

---

2) 개발 기간 및 역할

23년 09월 13일 부터 시작하여 23년 09월 27일까지 정확히 약 2주에 걸쳐서 진행하였다.

또한 프로젝트에서 내가 맡은 역할은 프로젝트의 전제적인 코드조율, 팀원리딩과 미술품 경매의 시작, 종료(스케쥴링)를 담당하는 기능을 제작, 개발하였다.

---

3) 기술스택

FrontEnd

Thymeleaf

기본적으로 짧은 시간이다보니, 디자인은 전적으로 Bootstrap에 의존을 할 수 밖에 없었다.

또한 Thymeleaf라는 SSR을 사용해서 WAS만으로 모든게 처리가 가능한 방법을 활용하였다.

jQuery의 경우에는 비동기 통신을 함에 있어서 Javascript를 그대로 활용을 해도 상관은 없지만, 조금이라도 타이핑 시간을 줄이고자 Ajax를 전적으로 활용하기 위해서 채택하였다.

BackEnd

JDK17의 경우에는 Spring Boot3를 채택하였기 떄문에 다른 선택지가 존재하지 않았다.

Database를 등재하는 방식은 MyBatis도 존재하였으나, JPA를 채택하였다. 
사유는 Query를 제작할 시간도 아끼자가 주 이유였다.

Database

DB의 경우 MySQL과 H2를 나눠서 활용하였다.
개발서버의 경우에는 MySQL, 로컬에서는 H2를 활용하였다.

아키텍처를 보면 알겠지만, 로컬서버에서 MySQL에 접속할 수 있는 방안을 찾아서 적용을 할 시간이 없었다.
또한 과감하게 같은 테스트를 여러번 해봐야 할 필요가 있기 때문에 부담없이 초기화가 가능한 H2를 로컬에서 채택하였고, 
변형이 되면 안되는 자료들을 MySQL과 개발서버에 활용하였다.

Tool

VCS는 Github을, CI / CD는 Github Actions를 활용하였다.

코드의 개발은 전적으로 Intellij IDEA로 통일하여 최대한 오차를 줄이고자 하였다.
VSCode를 활용한 이유는 CD로 배포된이후 개발서버의 모니터링을 하고자 사용하게 되었다.

 

 

---

4) 아키텍쳐 구조

최고의 관심사는 과연 어떻게 안전하게 정보를 보호할 수 있을까를 메인으로 최대한 정보가 노출되지 않는 방향으로 설계를 진행해봤다.

레포지토리는 무조건 Public을 하였기 때문에 프록시라는 수를 둬봤다.

 

사용자는 프로젝트 도메인을 입력하면, WAS가 실행되고 있는 Application Server에서 바로 페이지를 받아갈 수 있도록 설계하였다.

 

개발자는 Push, PR을 통해 Dev Branch로 Push이벤트를 발생할 경우 GithubActions를 통해 Proxy서버를 경유하여 Application Server에 배포하도록 Private Zone을 구축하였다.

 

또한 MySQL, ObjectStorage의 경우에는 Private Area를 통해서만 접근이 가능하도록 설계를 하였다.

---

5) ERD

Picasso - dbdocs.io

기간이 2주라는 시간으로 짧았기 떄문에 MVP를 개발하는 것에 중점을 두었다. 그러다 보니 필요한 테이블을 검수를 많이 해봤고, 다음의 총 4개의 테이블(엔티티)가 발생하였다.