EC2+Jenkins CI/CD 자동배포

김기도·2021년 10월 11일
0

EC2 + Jenkins 를 사용하여 springboot, vue 자동배포

MobaXterm를 사용하여 EC2에 접속

login as: ubuntu 입력

초기화면

ec2 ubuntu 환경에 java, jenkins, mysql, npm을 설치합니다.


jenkins 초기화면(처음에는 PJT가 없습니다.)

jenkins 관리 -> 플러그인 관리에서 플러그인을 설치합니다.
설치가능 탭에서 Search 하실 수 있습니다.
Blue Ocean을 검색하고 검색된 모든 플러그인,
gitlab을 검색하고 검색된 모든 플러그인(GitLab Hook 제외),
NodeJS 플러그인을 설치합니다.

Jenkins 관리 > 시스템 설정에 들어갑니다.

중간쯤 GitLab 부분에서
Connection name을 원하는 이름으로 적어주시고
GitLab host URL에 gitlab주소를 적어줍니다
Credentials에 none밖에 없을텐데 Add -> jenkins를 눌러 생성해줍니다.

add를 누르시면 다음과 같은 화면이 나오는데
Kind를 GitLab API token으로 바꿔주시고
API token에서는 gitlab에서 발급받은 personal token을 입력합니다.

Personal token은 gitlab에 로그인하시고 User Settings > Access Token에서 발급 받을 수 있습니다.

원하는 토큰이름과 만료기간을 정해주고 api에 체크해주신 다음
Create personal access token을 눌러주면 화면상단에 토큰이 발급됩니다.

다시 jenkins로 돌아와서 ID에는 gitlab에서 사용하는 아이디를 적어줍니다.
저는 이메일형식인데 @뒤를 제외한 아이디만 적어줍니다.

여기까지 되셨으면 Apply를 눌러 적용시키고 저장을 눌러줍니다.

Dashboard 메뉴에서 새로운Item을 눌러줍니다

Freestyle project를 선택하고 원하는 이름으로 OK해주시면 됩니다

Item 생성 초기화면

구성 -> 소스코드 관리 탭에서 Git을 체크하고
Repository URL (gitlab project 클론)을 적어줍니다.

다음과 같이 Access denied 에러가 뜰 때에는

https://gitlabID:Personal access token@Repository주소

와 같은 식으로 gitlabid:personal@을 앞에 붙혀줍니다
그리고 Credentials에 Add -> jenkins를 눌러줍니다

Kind를 SSH Username with private key로 변경하고
ID와 Username을 써줍니다. Username은 gitlab에 로그인하는 email형식 입니다.

아래로 좀 내리면 Private Key가 있는데 Enter directly를 체크해주고
Add를 눌러줍니다 그럼 key값을 입력하는 입력폼이 나오는데
여기에 ssh key를 입력합니다. ssh key를 발급받아야 하는데
Gitlab으로 돌아옵니다

User Settings > SSH Keys에서 Key를 입력해주어야 하는데
이 때 키는 배포할 서버에서 생성 할 수 있습니다.
MobaXterm으로 돌아갑니다

명령어 입력해서 키를 발급받은 뒤(이메일은 깃랩 아이디)
cd home/ubuntu/.ssh/ 경로에서 cat id_rsa.pub 파일을 열고 ssh-rsa을 제외하고 복사합니다.

gitlab으로 돌아와서 ssh key를 입력해주고 타이틀과 유효기간을 설정해주면 키 생성이 완료되고 이 키를 jenkins에서 key를 입력해줍니다.
jenkins에 Branches to build에서 배포될 브랜치를 정해줍니다.

빌드유발 탭으로 가서
Build when a change is pushed to GitLab. GitLab webhook 체크해주고 고급을 눌러서 맨아래 generage버튼을 누르면
Key가 하나 생성되는데 복사해서 잘 갖고있습니다.
젠킨스 설정을 저장합니다.

GitLab에 배포하고자하는 프로젝트에서 설정 > Integrations로 들어옵니다.

다음과 같이 Go to Webhooks 눌러줍니다.

URL에 Jenkins 프로젝트 URL을 입력해줍니다.(프로젝트페이지 > 구성 > 빌드유발탭에 확인할 수 있습니다.)

Secret token에서는 방금 빌드유발에서 제가 복사해놓으라고 했던 젠킨스 키를 입력해줍니다.
Push events에 푸시가 일어날 브랜치를 입력해줍니다.

아래로 내려가서 AddWebhook 눌러주시고 훅이 생성되면 테스트누르셔서 push events 설정하고 테스트해줍니다.

다음과 같은 화면이 상단에 뜬다면 성공입니다.
이 때, jenkins 에 프로젝트에 가시면

다음과 같이 테스트 빌드가 생성되는것을 볼 수 있습니다.

이제 기본설정이 끝났습니다. Jenkins에서 빌드와 배포를 설정해주겠습니다.

구성 > Build 탭으로 옵니다.
Excute shell에 명령어를 입력할건데

vue를 먼저 빌드하겠습니다.

cd 프론트엔드로 이동하고
npm install
npm run build로 빌드파일을 생성합니다.
이 때 프론트엔드 폴더에 dist폴더가 생성됩니다.

mobaXterm으로 돌아가서 nginx를 설치해줍니다.

nginx를 설치하고 cd /etc/nginx/sites-availavle 경로에서
vi default 명령어를 입력합니다.
nginx를 설정하는 창이 나오는데

빨간줄 한줄 추가해줍니다. 이 경로는 빌드하면서 생성된 dist폴더 경로입니다.

여기도 한줄 추가해줍니다. 라우터 이동할 때,새로고침할 때 404에러가 뜨는걸 막아줍니다.

이렇게 vue.js 자동배포가 끝났습니다.

spring boot를 배포하기위해 spring boot가있는 폴더로 이동합니다.

파일들이 있는 경로까지 들어옵니다.

저같은경우 init폴더 안에 gradle 파일이 있어서 위 사진처럼 shell에 입력해주었습니다.
여기서 gradlew의 권한을 바꿔주고 빌드를 시작합니다. shell명령어는 다음과 같습니다.

cd dist
ln -s ~~ 는 바로가기 파일을 생성하기 위해 추가한 명령어고 신경쓰지 않으셔도 됩니다.
여기까지하면 vue.js가 배포되고 spring boot가 빌드됩니다.
springboot가 빌드되면 build라는 폴더가 생성됩니다.

spring boot를 배포하겠습니다.

바로 아래줄에
fuser -k 8080/tcp
nohup java -jar /var/lib/jenkins/workspace/PJT/Backend/init/build/libs/init-0.0.1-SNAPSHOT.jar &

추가로 입력하면 됩니다. 8080포트의 프로세스를 죽이고
spring boot 빌드파일을 백그라운드에서 실행하는 명령어입니다.

이제 저장하시고
프로젝트 화면에서 Build Now를 클릭하면 build가 생성되고 자동으로 배포를 진행합니다. 감사합니다

profile
안녕하세요 김기도입니다.

0개의 댓글