Travis CI 사용해보기! (CI/CD 구성)(React.js, S3, Github)

여러가지 CI/CD 툴을 찾아보다가 가장 많이 쓰이는 Jenkins는 어차피 레퍼런스가 많으니 언제든 해볼 수 있고,

레퍼런스가 아주 적은 툴인 Travis CI를 사용해봤다.

 

github 레포에 최신화된 React.js 웹 코드를 올리고,

s3 버킷에 build된 폴더를 올려 배포하는 형태로 진행했다.

코드

language: node_js
node_js:
  - '16'
install:
- npm install
script:
- CI=false npm run build
deploy:
  provider: s3
  access_key_id: $AWS_ACCESS_KEY_ID
  secret_access_key: $AWS_SECRET_ACCESS_KEY
  bucket: 'test-s3-bucket'
  local_dir: build
  region: ap-northeast-2
  skip_cleanup: true
  on:
    branch: main

스크립트를 작성해보았다.

 

ruby로 작성되어야 해서 진입장벽이 있을까?했는데 생각보다 쉽게 작성할 수 있음

yaml 코드도 매우 쉽고 짧고 가독성 좋게 작성됨!

진행 과정

Travis CI 첫 페이지

https://www.travis-ci.com/

Home – Travis-CI

github에 Travis CI 연동하기

Travis CI 에 연동된 나의 레포

빌드 실패, 순탄치만은 않았던 배포

이렇게 에러를 확인할 수 있음

build 과정을 github에서도 볼 수 있음

깃 commit, push 후 연동된 CI/CD를 통해 최신화된 웹사이트

성공을 github에서 확인할 수 있음

물론 Travis CI에서도 확인 가능

 

결론

• 한줄평 : 생각보다 사용하기 힘들었음 높은 가격 대비 적은 기능 제공
• 걸린 시간 : 2m 30s
• 장점 :
  • 과정이 한눈에 잘 보임
  • yaml파일 github action에 비해 짧고 가독성 좋음
• 단점
  • 진입장벽 높음
    • ruby (근데 ruby 언어를 몰라도 쓸 수는 있긴 함)
  • yaml로 travis ci 코드 구성하는 방식을 알아야함
  • 레퍼런스 적음 공식문서 보는게 제일 나음 근데 다 영어
  • 만 크레딧까지 30일 무료 그 이후는 유료
    • https://docs.travis-ci.com/user/billing-overview/
    • 4번 돌렸는데 90 크레딧 씀 워커페이지 S3에 업로드 기준