본문 바로가기
프로젝트 관련

Jenkins를 활용한 React, Springboot CI,CD 구현(1)

by khds 2023. 1. 18.

 

 

들어가기

 

팀 프로젝트를 진행하다가 개발회사에 다니시는 분으로부터 들은 얘기가 있다. 회사에서는 본격적으로 개발하기 전에 테스트 서버라는 것을 만들어서 디자이너, 기획 등 다같이 프로젝트 현황을 볼 수 있도록 한다고 하셨다.

확실히 다른 사람들도 모두 개발 현황을 볼 수 있어야 한다고 생각을 하기에 앞으로는 차후를 위해 프로젝트마다 테스트 서버를 항상 구현할 생각이다.  그리고 이를 위해서는 CI,CD 가 이뤄져있어야 편하게 진행을 할 수 있다고 생각한다. 

이 글은 인터넷을 찾아보며  CI,CD 구현을 하고 내 생각에 맞춰 작성한 글이다.  

 

CI, CD에 대한 개념이 궁금하다면 https://seosh817.tistory.com/104 를 참고하길 바란다.

 

[CI/CD] CI/CD란? - 지속적 통합(Continuous Integration)/지속적 배포(Continuous Deployment) 기본개념

매번 개발자가 코드를 수정하고 빌드와 테스트를 하고 배포까지 한다면 상당히 많은 시간이 소요됩니다. 하지만 git에 코드를 올리는 것만으로도 누군가가 빌드와 테스트, 배포까지 해준다면,

seosh817.tistory.com

 

 

 

먼저 전체적인 구성은 아래와 같다.

 

 

위 사진과같이 서버는 jenkins가 있는 서버, 실질적인 배포가 이루어진 서버 2개를 활용하여 구성을 할 것이다. 하나의 서버에서 jenkins와 배포를 동시에 이뤄지게는 거의 안한다고 한다. aws 프리티어 사용자도 2개의 서버로 구현하기에 충분하므로 2개를 이용하는 것을 권장하지만 혹시나 하나의 서버에서 돌리고 싶으면 아래의 주소에서 확인하길 바란다. 

https://skyblue300a.tistory.com/14#recentComments

 

[Jenkins] Docker를 활용한 Spring boot 프로젝트 CI & CD

혼자 생각한대로 배포를 진행해봤는데, 이렇게 하는게 맞는지 아직 잘 모르겠다. 포스팅에 문제점이나 잘못된 점이 있다면 피드백을 받을 수 있으면 좋겠다. Docker 설치 먼저, AWS ec2 인스턴스를

skyblue300a.tistory.com

 

 

AWS 서버 설정

1. EC2 인스턴스 생성 및 접속

 

본격적으로 들어가기에 앞서 가장먼저 설정해야한는 것은 서버세팅이다.

먼저 aws 에  EC2로 들어가서 인스턴스 탭으로 들어가서 새로운 인스턴스 시작을 클릭한다.

 

 

인스턴스 시작을 누르면 인스턴스에 대한 세부정보들을 입력할텐데 이름은 편한걸로 지정하고 리눅스로 Ubuntu 20.04를 선택한다. 최신버전은 22.04지만 최신버전에서는 Jenkins가 실행이 잘 안된다. 그 이유는 Java때문이다. Jenkins는 openjdk-11에서만 작동한다. 설치해주고 기본 설정도 바꿔줘야 한다. openjdk-11같은 상위버전에서는 작동하지 않는다.  그렇기에 바로바로 작동되도록 편하게 20.04버전으로 진행을 하겠다.

 

 

위와 같이 설정을 하고 키페어는 생성해둔게 없으면 Create new key pair를 클릭하여 생성하고 다운받길 바란다. 

인스턴스 유형을 보면 메모리가 1GB밖에 안된다. jenkins가 메모리가 생각보다 많이 잡아먹어서 여유를 둬야한다. 그렇기에 jenkins 서버는 디스크 용량을 가상메모리로 전환해서 사용하길 바란다. 전환 방식은 아래 주소에서 확인하길 바란다.

https://co1nam.tistory.com/46

 

리눅스 (AWS) - 스왑 메모리 설정 방법

AWS ec2에서 프리티어(무료) 사용자에게 제공하는 기본 메모리는 1기가입니다. 이것도 감지덕지이지만 웹서버와 DB 등 여러 프로그램을 구동하기에는 가혹한 용량입니다. 그래서 스왑 메모리를 설

co1nam.tistory.com

 

 

그 다음은 스토리지 구성이다.

 

 

프리티어에서 스토리지는 모든 인스턴스 합쳐서 최대 30GB까지 사용할 수 있다. 여유있게  10GB정도씩 설정하자. 

이렇게 jenkins 서버와 배포를 위한 서버를 만들자.

 

 

인스턴스를 생성한다음 탄력적 Ip주소를 할당하자. 기본적으로 생성되는 인스턴스의 주소는 인스턴스를 정지했다 다시킬때마다 IP주소의 변동이 생기므로 항상 고정되어있는 탄력젹 Ip주소를 지정해주는 것이 좋다.

 

 

위와 같이 생성하고 우측에 탄력적 IP 주소 연결을 클릭하여 인스턴스를 적용하면 해당 인스턴스의 주소는 탄력적 ip로 해제를 하지 않는 이상 계속 설정이 된다.

 

그 다음 보안 그룹을 설정해야 한다. 

인스턴스를 클릭하고 보안탭에서 보안그룹을 클릭하면 해당 인스턴스에 적용중인 보안그룹으로 넘어갈 수 있다. 

 

 

넘어간 후 인바운드 규칙 편집을 눌러서 접속을 원하는 포트를 설정을 해주면 된다. 아래는 예시 사진이다.

 

 

jenkins 서버는 8000을 사용해서 들어갈거면  8000을 허용해주면 되고 배포서버는 3000과 8080을 해주면 된다. 22포트는 서버에 접근하기위한 것이므로 따로 설정하지 않아도 기본적으로 설정이 되있다. 

 

 

자 이제 aws ec2에서 만든 인스턴스에 연결을 해보자. 연결은 인스턴스 탭에서 우측에 연결탭을 클릭하면 아래와 같은 창이 뜰 것이다. 

 

 

위 링크를 통해 putty 나 xshell을 통해서 인스턴스 서버에 원격으로 접속할 수 있다. 들어가기 위한 프라이빗 키는 위에서 인스턴스를 생성하면서 만들었었다. 키를 입력하라고 할때 다운받아놓은 키를 지정하면 된다.

 

 

2.  도커를 통한 Jenkins 접속

 

이제 본격적으로 서버 내부에서 작업을 해보겠다. 먼저 Jenkins 를 사용할 인스턴스 서버로 접속한다. 

Jenkins 는 도커를 이용하여 진행하겠다. 먼저 도커를 다운받는다.

 

$ sudo apt-get update
$ sudo apt-get -y upgrade
$ curl -fsSL https://get.docker.com/ | sudo sh
$ docker -v

 

 

위와 같이 도커가 설치된 것을 알 수 있다.

현재 유저에게 docker를 사용할 수 있는 권한이 없으므로 sudo를 붙이고 docker 명령어를 사용해야 한다. 아래와 같이 입력하여 현재유저에 권한을 부여하자.

 

$ sudo usermod -aG docker $USER
$ sudo service docker restart

$ sudo su
$ sudo su ubuntu
#ps는 실행중인 컨테이너 확인
$ docker ps

 

 

이후 도커를통해 jenkins 이미지를 내려받자.

docker pull [이미지]:[버전]

docker pull jenkins/jenkins:lts
#images 는 내려받은 이미지들 확인
docker images

 

 

이후 jenkins image를 통해 컨테이너를 생성하고 실행한다.

docker run -d -p 8000:8080 -v /jenkins:/var/jenkins_home --name test-jenkins -u root jenkins/jenkins:lts

 

docker run = [pull] + create + start +[command] 

  run 명령어는 컨테이너를 생성한과 동시에 시작한다. 만약 이미지가 없으면 pull도 하고 다양한 옵션션이 적용된다.

  •  -d: 백그라운드에서 컨테이너 실행 후 컨테이너 ID 등록
  • -p [Host 포트] [Container 포트]:  호스트 포트와 컨테이너 포트를 연결
  • -v: 호스트 경로와  컨테이너 경로의 공유 볼륨 설정 - 컨테이너 내부의 공간을 서버에서 접근하기 쉽게 서버의 특정 공간하고 연결하는 것
  • --name :  실행되는 컨테이너에 이름 부여(미지정 시 자동으로 부여됨: 딕셔너리 워드 랜덤 선택
  • -u: 사용자 이름, 계정 설정

 

위와 같이 실행후 docker ps 로 컨테이너를 확인해보자.

 

위와 같이 실행이 확인 된경우 aws 인스턴스 ip의 8000 포트로 젠킨스에 들어가보자. 아래와 같이 뜰 것이다.

 

 

password는 아래의 명령어를 통해 얻을 수 있다. 

docker logs [container_id]

 

 

위의 빨간 부분이 password다. 입력을 하면 아래와 같은 화면이 되는데 왼쪽을 누르면 된다.

 

아래와 같은 화면이 나오면 기다리면 된다. 

 

 

관리자 계정은 하고싶은데로 설정한다. 이후 url도 설정을 해준다.

 

 

3.  Jenkins를 통한 CI 

 

이제 ci,cd를 원하는 repository를 등록해보겠다. 아래의 사진에 새로운 Item을 클릭한다.

 

제목을 정하고 Freestyle project를 클릭한다.

 

GitHub project를 체크 후 원하는 git repository를 입력한다.

 

소스 코드 관리에서 git을 체크 후 repository url을 입력한다. 브랜치는 어느 브랜치에 push or merge가 이뤄지면 CI/CD를 실행할 지 설정하는 것이다.

 

Credentials는 위 레포지토리에 접근하기 위한 권한을 확인하는 것으로 아래의 Add를 클릭한다. 아래의 방식은 git 계정을 통해 권한을 확인하는 방식이다. 

 

Username 과 Password 는 git계정을 입력하고 ID는 구분하기 위한 이름 으로 지정한 후, Add를 눌러주고 생성된 Credentials를 선택하면 된다. 위 방식은 매우 간단하지만 권장되는 방식이 아니다. github 토큰을 하는 것을 추천하며 이는 아래의 주소에서 확인하길 바란다. 

https://velog.io/@svstar94/Docker-Jenkins-%ED%99%9C%EC%9A%A9-CICD-%EA%B5%AC%EC%B6%95-React-KotlinSpring-2%ED%8E%B8-Jenkins-Github-%EC%97%B0%EB%8F%99

 

Docker, Jenkins 활용 CI/CD 구축 (React, Kotlin+Spring) 2편 - Jenkins Github 연동

저번 Jenkins 서버 설정까지 진행하고 나서, 본격적으로 배포를 위한 셋팅을 해야한다. 순서 >0. 전체 흐름 github 토큰 생성 Jenkins에 github 토큰 등록 자동배포를 진행할 레포 등록 0. 전체 흐름 Architec

velog.io

 

 

Credentials는 Jenkins 관리 - 시스템 설정에서도 확인할 수 있다.

이후 '지금 빌드'를 클릭함으로서 build를 진행하여 성공하는 것을 볼 수있다. 아래는 여러번 시도한 사진이고 각 빌드마다 체크표시가 생기면 테스트 및 빌드가 성공인 것이다. 

 

 

간혹 aws 패스워드같이 포르젝트 파일들 중 github에 올리지 않고 로컬로만 혹은,  Private한 폴더에 등록을 한 파일이 있을 것이다. 그런 파일들을 직접 젠킨스 컨테이너 내부에 들어가서 파일을 생성해주면 된다.

docker exec -it  [컨테이너 ID] /bin/bash

 

위 명령어를 통해 컨테이너 내부로 들어갈 수 있고 

 

경로는 위와 같다.

 

 

이제 위의 기능을 github repository에 push 또는 merge를 하는 동시에 일어나게 해보자. 

먼저 Jenkins 관리 - 플러그인 관리로 들어가서 github integration plugin을 검색한 후 다운받은 후 재시작 해준다. 

 

webhook을 걸고 github에서 jenkins서버로 이를 알려줘야한다. 그렇기에 aws 인스턴스 보안그룹에서 다음의 세가지 ip를 허용해야한다고 한다. 

192.30.252.0/22
185.199.108.0/22
140.82.112.0/20

 

그리고  CI/CD를 원하는 github repository에 Settings에 들어간 후 Webhooks를 클릭한다. 

 

Add webhooks를 클릭 후 Payload URL만 수정후 Add webhooks를 클릭하면 된다. Payload URL은 http://jenkins주소:8000/github-webhook/ 으로 하면 된다.

 

설정 후 아래와 같이 됐으면 성공이다.

이제 jenkins에 만든 레포에 구성에 들어가서 빌드유발에 GitHub hook trigger for GITScm polling 를 체크하고 저장을 누른다. 그렇게 하면 github repository에 지정한 branch에 push 또는 Merge를 하면 자동으로 jenkins 상에서 build가 이루어진다. 

 

 

이후 내용은 다음 글에서 작성하겠다.  아래 주소를 클릭하길 바란다.

https://khdscor.tistory.com/68

 

aws jenkins(docker)를 활용한 react, springboot CI,CD 구현(2)

아래 내용에 이어서 계속 진행하겠다. https://khdscor.tistory.com/67 aws jenkins(docker)를 활용한 react, springboot CI,CD 구현(1) 팀 프로젝트를 진행하다가 개발회사에 다니시는 분께서 개발 회사에서는 본격적

khdscor.tistory.com

 

 

 

참고

 

도커, 컨테이너 빌드업 - 이현룡

https://velog.io/@svstar94/Docker-Jenkins-%ED%99%9C%EC%9A%A9-CICD-%EA%B5%AC%EC%B6%95-React-KotlinSpring-1%ED%8E%B8-Jenkins-%EC%84%9C%EB%B2%84-%EC%84%A4%EC%A0%95

 

Docker, Jenkins 활용 CI/CD 구축 (React, Kotlin+Spring) 1편 - Jenkins 서버 설정

SSAFY 프로젝트 진행 중 인프라를 구축하는것에 진심인 친구가 Jenkins, Docker를 활용해 자동배포 시스템을 구축한 것을 보고 CI/CD에 관심이 생겼다. CI/CD는 내용이 많기 때문에 3편 정도로 나누어서

velog.io

 

https://velog.io/@tunakim/AWS-EC2-Nginx-%EC%9D%B4%EC%9A%A9%ED%95%B4-React-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%EB%B0%B0%ED%8F%AC

 

AWS EC2, Nginx 이용해 React 프로젝트 배포

EC2, Nginx를 이용해 React 앱을 배포하는 방법은 검색해보면 많이 나오니깐 보고 하시면 될 것 같습니다.적용하는 과정에서 헤맸던 부분, 오류 해결하는 과정을 정리한 글입니다.참고 글AWS EC2에서 N

velog.io

 

https://dang2dangdang2.tistory.com/187

 

AWS 서버에서 NGINX 사용해서 REACT 배포하기

일단 node.js 와 npm이 깔려 있다는 전제로 시작하겠읍니다. 참고로 전 react 깃랩에서 git clone해서 땡겨왔읍니다. nginx 설치 sudo apt-get install nginx -y 기본적인 nginx 명령어 #nginx 시작 sudo service nginx start

dang2dangdang2.tistory.com

 

https://okky.kr/articles/884329

 

OKKY - AWS EC2 프리티어 쓰시는분들 참고하세요!

일기장에 기록해둔건데 프리티어 쓰시는 분들에겐 좋은 정보일것 같아 남깁니다.제 일기장에서 긁어온거라 폼이 많이 깨지긴 했는데 감안하고 봐주세요!   AWS 프리티어 EC2를 사용 중 겪은 문제

okky.kr

 

https://junjunrecord.tistory.com/112

 

[에러] error: internal/modules/cjs/loader.js와 같은 에러 발생시

경로가 꼬인 경우인 경우가 있다고 한다 -> 실제로 해결되었다. (내 케이스도) rm -rf node_modules rm -f package-lock.json npm cache verify npm install 출처: https://selfish-developer.com/entry/error-internalmodulescjsloaderjs883

junjunrecord.tistory.com

 

https://euriion.com/?p=413340 

 

Ubuntu 22.04에 Jenkins 설치하기 - 토탈 데이터과학 - Total Data Science

Ubuntu 22.04에 Jenkins를 설치하면 실행이 잘 안됩니다. 우분투 22.04는 최신 LTS 버전이라서 정말 쉽게 되야 할텐데 이상하죠?...

euriion.com

 

https://seosh817.tistory.com/104

 

[CI/CD] CI/CD란? - 지속적 통합(Continuous Integration)/지속적 배포(Continuous Deployment) 기본개념

매번 개발자가 코드를 수정하고 빌드와 테스트를 하고 배포까지 한다면 상당히 많은 시간이 소요됩니다. 하지만 git에 코드를 올리는 것만으로도 누군가가 빌드와 테스트, 배포까지 해준다면,

seosh817.tistory.com

 

https://skyblue300a.tistory.com/14#recentComments

 

[Jenkins] Docker를 활용한 Spring boot 프로젝트 CI & CD

혼자 생각한대로 배포를 진행해봤는데, 이렇게 하는게 맞는지 아직 잘 모르겠다. 포스팅에 문제점이나 잘못된 점이 있다면 피드백을 받을 수 있으면 좋겠다. Docker 설치 먼저, AWS ec2 인스턴스를

skyblue300a.tistory.com