프로젝트/SNS를 통한 운동팀 매칭 서비스 4

배포환경 구축(4) : CI/CD 환경 구축

이번 포스트에는 사진에서 표시한 부분을 구현하겠습니다. 먼저 docker 설치, docker에 jenkins 설치를 진행합니다. 진행 중 docker permission error가 생길 경우 이 블로그를 참고하시면 됩니다. Jenkins 설정 관리 먼저 필요한 플러그인을 설치해 보겠습니다. Jenkins 관리 - 플러그인 관리를 통해 플러그인 목록에 들어갑니다. 설치 가능 탭에 들어가 Git, Gitlab 관련 플러그인, Blue Ocean 관련 플러그인을 다운로드합니다. 그다음 Global Tool을 설정해 보겠습니다. Maven과 NodeJS를 생성해 놓습니다. Jenkins pipeline build 설정 Jenkins 왼쪽 메뉴바 - 새로운 Item - Pipeline을 통해서 새로운 Pipel..

배포환경 구축(3) : Nginx Deploy

이번 포스트에는 위 사진의 표시한 부분을 구현하겠습니다. Front Back 관련 # 프론트엔드 빌드 yarn build # 백엔드 빌드 ./mvnw package # 보안상 외부에서 8080 접근 불가하게 실행하려면 --server.address=127.0.0.1 옵션추가 java -jar target/*.jar --server.servlet.context-path=/api 위 코드로 frontend, backend에서 각각 빌드를 실행하고 backend를 /api로 접근하기 위해서 servlet context 경로를 변경합니다. import org.springframework.boot.context.ApplicationPidFileWriter; @SpringBootApplication public c..

배포환경 구축(2): Server에서 test

먼저 git에 있는 프로젝트를 Server로 가져온 후 잘 되는지 테스트해보겠습니다. git 프로젝트의 제일 상위 폴더는 frontend, backend 폴더로 나누어져 있습니다. 개발 환경 준비를 위해 먼저 DB세팅, NVM 설치, JAVA 설치를 완료합니다. git clone [git주소] # 프론트 테스트 cd [서버에 clone된 프로젝트 폴더에서 frontend 위치] yarn install yarn serve # 백엔드 테스트 cd [서버에 clone된 프로젝트 폴더에서 backend 위치] ./mvnw spring-boot:run 위 코드를 따라 테스트를 진행합니다. Invalid Host header에러 발생 시 frontend 폴더 밑에 vue.config.js 파일을 추가합니다. 파일의..

배포환경 구축(1) : 전체 설명

위 그림이 제가 생각하는 프로젝트의 배포 환경입니다. 먼저 프로젝트에는 AWS EC2 Server가 제공되어 있습니다. NGINX Nginx는 EC2 Server의 80포트를 이용하고 /로 들어오는 주소는 Front로 /api로 들어오는 주소는 Back으로 연결하겠습니다. Jenkins Jenkins는 도커에 구축하고 GitLab과 연결하여 GitLab의 develop branch에 merge request가 승인되면 자동으로 Jenkins에 빌드하고 빌드된 파일을 scp 명령어를 통하여 EC2 Server로 배포하게 됩니다.