nginx (2) 썸네일형 리스트형 젠킨스를 활용한 리액트 CI/CD 자동 배포 구축기 저번에 리액트 프로젝트를 진행하면서 CI/CD 구축의 중요성을 다시금 체감하게 되었다.매번 운영 시마다 로컬에서 배포용 폴더를 만들고, 서버에 직접 올리는 작업을 반복하다 보니 시간도 많이 들고, 무엇보다도 생산적이지 않았다. 그래서 이번 프로젝트에서는 dev 브랜치에 push 하면 자동으로 서버에 배포되는 환경을 구축해보고자 했다.그리고 그 역할을 해줄 도구로 젠킨스(Jenkins)를 사용했다.1. GitHub Webhook 설정Webhook이란, 특정 이벤트가 발생했을 때 서버에 HTTP POST로 알려주는 방식이다. 즉, GitHub에서 특정 브랜치에 push가 발생하면 젠킨스가 이를 감지하여 빌드를 실행하도록 연결하는 것이다. 2. 젠킨스 설정소스 코드 관리깃 레포지토리 URL과 인증 정보 입력빌.. Nginx를 활용해 리액트 프로젝트 배포하기 (멀티 포트 설정) 이번엔 AWS EC2(Linux) 환경에서 Nginx를 사용해 리액트 앱을 배포해봤다. 이미 하나의 서비스가 운영 중인 상태에서, 추가로 하나 더 올리는 작업이 필요했다.즉, 같은 Nginx 안에서 여러 포트를 이용해 리액트 앱을 각각 운영하는 형태다.1. Nginx 기본 구조 확인EC2 인스턴스에서는 Nginx가 기본적으로 /etc/nginx 경로에 설치되어 있다. 설정 파일은 대부분 이 디렉토리 내에서 관리된다.보통 Nginx의 설정은 nginx.conf 파일에서 이뤄지는데, 여러 서비스를 관리해야 하니 설정을 외부 파일로 분리해서 include 시키는 방식을 사용했다. 유지보수하기에도 좋다.2. 설정 디렉토리 만들기cd /etc/nginxmkdir sites-enabledcd sites-enable.. 이전 1 다음