들어가면서

20일 정도의 시간 동안, 아파트 청약 관련 사이드 프로젝트를 만들어봤다. 아직 해당 프로젝트는 점차 확장하는 단계에 있고, 좀더 운영하면서 트러블 슈팅을 거쳐야하는 단계에 있다. 하지만 이렇게 중간 단계를 한번 점검하는 과정을 거치는 것도 나쁘지 않을 것 같아 작성한다.

전체 아키텍쳐

해당 프로젝트는 장기적인 목표로 MSA기반 서비스를 희망한다. 물론 MSA 기반이라고 해서 거창한 아키텍쳐를 지니는 것이 아닌, 도메인간 유기적인 제어를 할 수 있는 아키텍쳐를 지향한다.

샘플

보통 로컬 프로젝트에서 프로젝트를 수행하면, 서버와 클라이언트가 같은 컴퓨터에서 수행하기 때문에 매우 가깝고 부하에 대한 걱정도 적다.

프론트 엔드

일단 프론트 엔드는 Vue.js 기반으로 개발했다. Vue를 처음으로 공부하면서 했던거라 새로웠지만, 생각보다 기존에 했었던 React와 크게 다를게 없어서 배우는데 큰 장애는 없었다. 오히려 Vuex에서 제공하는 비동기적 상태 관리가 매우 맘에 들었다.

vue 라우터와 캘린더 컴포넌트, axios를 이용한 API 통신작업을 진행했고 추가로 localstorage를 이용해서 간단하게 메일을 저장하는 기능까지 만들었다.

배포 부분에선 github page를 사용했는데, 사실 SPA의 경우 별다른 서버가 필요없어서 정적 서버만 있으면 된다.

그리하여, github에서 제공하는 page를 사용해서 커밋과 동시에 브런치에 배포되어 해당 브런치에 빌드된 파일들만 저장되게 된다. 또한, 커스텀 도메인을 제공해서 내가 직접산 도메인을 적용했다.

백엔드

백엔드의 경우, 아직 고칠부분이 많지만 전반적으론 GCP기반의 VM 인스턴스 단위로 서비스를 나누고 이를 묶는 load balancer를 만들고, SSL 등록 후, 인증을 하도록 진행했다. VM 인스턴스 생성 샘플 VM 인스턴스 그룹생성 샘플 로드 벨런서 적용 샘플

하지만, 이 부분에서 아래와 같은 인증서 문제가 발생한다.

샘플

인증서 문제로 아직 명확한 답을 찾지 못한 상태라 나중에 이 문제를 본격적으로 처리하고자 한다.

백엔드 로직 구성

일단 nginx로 게이트웨이를 구성해서 reverse-proxy방식에 따라 외부의 요청에 따라 서비스 호출을 분기했다. 그리고 nodejs cron 라이브러리를 이용해서 서버시간 기준으로 0시 0분에 해당 일자에 청약일정이 시작되는 건들을 찾고, 이를 알람 신청한 사용자들에게 메일을 전송하도록 RabbitMQ 서버에 이를 등록한다.

메일 서버는 현재 heroku를 기반으로 구성되어있다. 이는 일종의 Paas 기반 서비스라 직접 인프라를 구성하지 않아도 되지만, 무료 티어를 사용하고 있기 때문에 서비스를 깨워줘야한다. 그래서 배치가 돌기 전에 서비스에 health check를 진행하고, 그 이후에 메일 배치가 돌도록 개발했다.

아직은 사용을 나밖에 하지 않는 서비스이기에 캐싱 기능은 AP서버 안에 인메모리 방식으로 사용하도록 개발해놨고, 이부분은 추후에 별도의 서버를 구성하는 식으로 진행할 예정이다.

실제 서비스 운영 사진

샘플 샘플

메일 배치 수행시 전달 메일

샘플