Bitbucket 배포 환경 만들기

AWS S3 + CloudFront + Bitbucket 배포 환경 구성을 이어서 적어보았다.

 

이전의 글 참고 🔽

https://eonhwa-theme.tistory.com/185

AWS S3 + CloudFront 배포 생성

 

 

🍒 Bitbucket pipeline 이 뭔데?

🍒 AWS S3+CloudFront +  Bitbucket 연동 

🍒 Bitbucket tag base 배포

 

 

 

 

 

 

---

Bitbucket pipeline

---

Bitbucket 의 CI/CD 통합 서비스

Bitbucket 이 내부적으로 클라우드에 컨테이너를 만들고 명령을 수행한다.

 

 

Bitbucket Pipelines 를 사용하면 수동으로 트리거할 수 있는 사용자 지정 파이프라인을 구성할 수 있다.

options:
  Global options page
clone:
  Git clone behavior page
definitions:
  Cache and service container definitions page
image:
  Docker image options page
pipeline:
  Pipeline start options page
    parallel:
      Parallel step options page
    stage:
      Stage options page
    step:
      Step options page

 

 

 

레파지토리에 push 할 때마다 pipeline trigger 된다 [✳️ 특정 tag, branch, bookmark 를 trigger 로 설정 가능]

config file(bitbucket-pipelines.yml) 을 기반으로 빌드, 테스트, 배포를 자동화 할 수 있다.

 

 

 

 

 

배포 동작

---

1️⃣ Bitbucket 저장소에 코드를 커밋한다.

소스를 변경하고 Bitbucket 저장소에 코드를 커밋한다.

 

 

2️⃣ Bitbucket Pipeline 이 컨테이너를 생성한다.

코드가 커밋되면 자동으로 Bitbucket Pipeline이 실행된다.

Pipeline은 컨테이너를 만들어 명령을 수행할 수 있는 환경을 제공한다.

 

3️⃣ 배포할 이미지를 S3에 복사한다.

Pipeline 이 생성한 컨테이너에서 배포할 소스 코드를 압축한 이미지를 생성한다.

이 이미지를 AWS CLI 를 사용해 AWS S3 로 복사한다.

 

4️⃣ AWS CodeDeploy 에 배포를 생성한다.

Pipeline 이 생성한 컨테이너에서 AWS CLI 를 사용해 AWS CodeDeploy에 배포를 생성한다.

 

5️⃣ AWS CodeDeploy가 배포를 진행한다.

배포가 생성되면 AWS CodeDeploy 는 AWS S3에서 배포 이미지를 가져온다.

이미지를 압축 해제 한 다음 이미지에 포함된 스크립트에 따라 배포를 진행한다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

AWS S3+CloudFront +  Bitbucket 연동 

S3 와 cloudFront 설정이 완료되면, 아직 버킷에 파일이 없기에 CloudFront 에서 제공해주는 도메인 주소로 브라우저에서 접근해도 아무것도 볼 수 없다.

CloudFront에서 제공하는 도메인 형식. → https://~~.cloudfront.net

bitbucket의 pipeline 설정을 통해 버킷에 파일을 올린다.

루트 경로에 아래와 같이 bitbucket-pipelines.yml 파일을 생성하거나, 아래의 예시 파일을 참고한다.

 

pipelines:
  branches:
    develop: 

// 위의 설정은 develop 브랜치가 머지되거나 커밋이 올라올 때마다 아래의 ci/cd 가 실행된다는 의미

pipelines:
  branches:
    tags:

// 위의 설정은 git tag 가 커밋에 붙을 경우, tag 의 네이밍에 따라 아래의 ci/cd 가 실행된다는 의미

 

 

 

[tag base] bitbucket-pipelines.yml 

options:
  docker: true
pipelines:
  branches:
    develop:
      - step:
          ~~~~~~
 
 tags:
    dev/project-name/*:
      - step:
          oidc: true
          name: build project-name development
          image: node:18.19.1
          caches:                        //캐시: Node.js 및 pnpm 캐시를 사용하여 빌드 속도를 향상시킵니다.
            - node
            - pnpm
          script:                        //스크립트: 빌드 및 배포를 위한 스크립트를 실행
            - export NODE_OPTIONS=--max_old_space_size=3072
            - corepack enable
            - corepack prepare pnpm@latest-8 --activate
            - pnpm i
            - pnpm project-name build:dev       //프로젝트를 개발 환경으로 빌드
            - pipe: atlassian/aws-s3-deploy:1.1.0  //AWS S3에 빌드된 애플리케이션을 배포
              variables:
                AWS_OIDC_ROLE_ARN: $AWS_OIDC_ROLE_ARN
                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION
                S3_BUCKET: $S3_REVERP_DEVELOP_BUCKET_NAME
                LOCAL_PATH: ''
                EXTRA_ARGS: '--delete'
            - pipe: atlassian/aws-cloudfront-invalidate:0.6.0   //AWS CloudFront 캐시를 무효화하여 변경 사항을 즉시 반영
              variables:
                AWS_OIDC_ROLE_ARN: $AWS_OIDC_ROLE_ARN
                AWS_DEFAULT_REGION: $AWS_DEFAULT_REGION
                DISTRIBUTION_ID: ''
                PATHS: '/index.html'
    stag/project-name/*:
    ...

위와 같이, 빗버킷에서 제공하는 ci/cd 환경에서 도커를 이용해 배포를 하게 된다.

 

 

script, S3_BUCKET, LOCAL_PATH, DISTRIBUTION_ID 부분을 보면

script: 
	- npx pnpm projectname:build:dev

어떤 환경으로 프로젝트를 빌드하여 static 파일을 만들지를 정한다.

 

variables:
  S3_BUCKET: $S3_SA_DEVELOP_BUCKET_NAME
  LOCAL_PATH: 'packages/project/dist'

 

bitbucket의 레파지토리의 환경 변수에서,

• S3_BUCKET: 위에서 만든 버킷의 이름이 담긴 버킷 환경변수 값과,
• LOCAL_PATH: static 파일이 생성되어 위치할 파일 경로를 설정한다.

- pipe: atlassian/aws-cloudfront-invalidate:0.6.0
        variables:
          DISTRIBUTION_ID: 'CloudFront의 ID'

• DISTRIBUTION_ID: cloudFront의 ID 값을 넣어줍니다.

 

bitbucket 환경설정도 완료되었습니다. 브랜치나, 태그를 이용하여 자동/수동으로 배포가 가능하다.

 

 

 

 

 

 

 

 

 

 

 

bitbucket 수동 배포

---

로컬환경에서 배포하고 싶은 브랜치 (develop or master) 로 이동한 뒤에 tag 를 하나 만든다.

git tag prod/projecct-name/20240428 

// dev or prod (테스트 서버냐, 운영서버냐)

 

그 다음 해당 origin 으로 push 해준다.

git push origin prod/projecct-name/20240428

 

 

🌀그러면 파이프라인이 돌게 된다

 

https://bitbucket.org/product/ko/features/pipelines