[Rookies 개발 2기] React + SpringBoot + MySql CI/CD (2)

백엔드 시작

이번엔 백엔드 파트이다. 설정등 많은 부분이 프런트와 비슷한 결이므로 빠르게 진행하겠다.

작업 순서는 아래와 같다.

 

1. Spring의 보안 설정 후
2. GitAction Security 설정
3. EC2 업로드 및 배포

Security

Spring 설정

먼저 `application.properties` 파일로 가서 맨 아래에 ip주소를 변수로 만들어 주자.

 

#Custom settings (protocol, domain, port)
app.release_ip=http://내 ip주소
app.release_domain=http://www.example.com
app.dev_ip=http://localhost:3000

 

여기서 제일 중요한건 `release_ip`이며 나머지는 추후를 위해 생성해 둔 것이다.

 

그렇다면 이 변수를 받아서 쓸 파일을 찾아야 하는데, 바로 `config` 폴더에 있는 `SecurityConfig`이다.

 

@Configuration
@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {
    @Autowired
    private Environment env;

    ```
    생략
    ```
    public CorsFilter corsFilter() {
    
        ```
        생략
        ```
        
        //config.addAllowedOrigin("http://localhost:3000");// 기존 프런트단 리액트 서버

        String release_ip = env.getProperty("app.release_ip");
        String release_domain = env.getProperty("app.release_domain");
        String dev_ip = env.getProperty("app.dev_ip");

        System.out.println(release_ip);
        // 일괄 등록
        config.setAllowedOrigins(Arrays.asList(
                release_ip,     // 리액트 상용 서버 ip 주소
                release_domain, // 리액트 상용 서버 도메인
                dev_ip          // 리액트 개발 서버 ip 주소
        ));
        
        ```
        생략
        ```

 

위와 같이 추가해 주면 된다.

원래의 `http://localhost:3000` 를 아까 `application.properties` 에서 설정한 변수 값으로 대입시키는 것이다.

이렇게 넣어주지 않으면 CORS에 위배되어 접근을 거부당할 수 있다.

 

Action 설정

이제 최상단 폴더에서 아래와 같이 디렉터리와 `. yml` 파일을 생성하자.

 

 

이번엔 지난 포스트와 달리 `application.properties` 전체를 security 변수로 두어 사용하겠다.

 

name: Backend for ci/cd

on:
  push:
    branches:
      - main

jobs:
  cicd-backend:
    runs-on: ubuntu-latest
    steps:
      - name: Github Repository 내 파일들 checkout(불러오기) 수행
        uses: actions/checkout@v4

      - name: JDK 17 버전 설치
        uses: actions/setup-java@v4
        with:
          distribution: 'temurin' # See 'Supported distributions' for available options
          java-version: '17'

      - name: application.properties 동적 생성
        run: |
          mkdir -p ./src/main/resources
          echo "${{ secrets.APPLICATION_PRO }}" > ./src/main/resources/application.properties

      - name: 단위 테스트 및 빌드
        run: |
          chmod +x ./gradlew
          ./gradlew clean build

      - name: 관리상 빌드된 결과물의 이름을 변경 처리
        run: |
          mv ./build/libs/*SNAPSHOT.jar ./run.jar

      - name: EC2에 jar파일 업로드
        uses: appleboy/scp-action@v0.1.7

        with:
          host: ${{ secrets.EC2_HOST }}
          username: ${{ secrets.EC2_USER }}
          key: ${{ secrets.EC2_KEY }}
          source: run.jar
          target: /home/ubuntu/server/demo

      - name: SSH로 ec2에 정리후, 접속후 서버가동
        uses: appleboy/ssh-action@v1.2.0

        with:
          host: ${{ secrets.EC2_HOST }}
          username: ${{ secrets.EC2_USER }}
          key: ${{ secrets.EC2_KEY }}
          script_stop: true
          script: |
            rm -rf /home/ubuntu/server/web
            mkdir /home/ubuntu/server/web
            mv /home/ubuntu/server/demo/run.jar /home/ubuntu/server/web/run.jar
            cd /home/ubuntu/server/web
            sudo fuser -k -n tcp 8080 || true
            nohup java -jar run.jar > ./output.log 2>&1 &
            rm -rf /home/ubuntu/server/demo

 

지난번에 만든 `deploy-cicd` 파일을 참고하여 입력해 주면 된다.

(전체적인 진행방식은 동일하다.)

 

자 그럼 우린 이제 Git Action 변수에 `EC2_HOST` `EC2_USER` `EC2_KEY` 그리고 `APPLICATION_PRO` 파일을 만들어야 한다.

 

그런데 여기서 `EC2_HOST` `EC2_USER` `EC2_KEY` 는 앞서 프런트 설정과 같아서 설명은 넘어가겠다.

(Backend 레퍼지스토리에서 설정해야 한다.)

 

`APPLICATION_PRO` 설정은 그냥 `application.properties` 전체를 복사 붙여 넣기 하면 된다.

 

그리고 이제 `application.properties` 는 더 이상 github에 올릴 필요가 없어졌으므로

`. gitignore` 파일에 추가해 주면 된다.

 

자 설정이 완료되었다면 Commit&Push를 해보자.

 

 

별다른 오류가 없다면 성공적으로 진행될 것이다.

 

현재까지 `. jar` 파일로 빌드한 뒤 실행까지 진행되었으며,

리액트에서 API 요청을 보내면 스프링과 데이터베이스까지 잘 연결이 진행되어야 한다.

 

최종

 

성공적으로  React + SpringBoot + MySql을 커밋 한 번에 AWS EC2까지 배포할 수 있게 되었다.

 

이번 과정을 통해 Spring Boot와 GitHub Actions를 활용한 CI/CD 파이프라인 구축에 대해 깊이 이해할 수 있었다. 특히, 보안 설정과 EC2 배포 과정에서 발생할 수 있는 문제들을 해결하면서 실무적인 경험을 쌓을 수 있었고, 자동화의 중요성을 다시 한번 느끼게 되었다. 앞으로 더 효율적이고 안정적인 배포 환경을 만들어 나갈 수 있을 것 같다.