Vercel로 GitHub Organization 무료 배포하기 (w. github actions)
SODA 프로젝트 중간 발표를 앞두고 배포를 해야 했다.
백엔드는 배포 완료했는데, 프론트 배포를 안했다. aws s3로 배포할까 고민하다가 어차피 무료이고 몇 번 해봤던 vercel로 배포하기로 했다. 도메인 주소는 샀는데 아직 추가하지는 않았고, 일단 배포는 완료했는데 이 과정에서 생긴 일들을 기록해보려고 한다.
우선 vercel.
이전에 배포했을때는 몰랐는데, github organization 내부에 존재하는 repository는 배포할때 무료가 아니었다.
2주 무료 플랜이긴 한데 어차피 그 이후에 돈을 내야 했기에 우회해서 배포하는 방법에 대해 검색해보다가 다행히 찾았다.
바로 팀 Repo를 fork해서 개인 계정으로 가져온 다음, 그. repository를 통해 배포하는 것이었다.
그리고 매번 업데이트 될 때마다 포크하고 다시 배포할 수 없으니까 github action 통해서 자동으로 같이 복사되도록 추가해주었다.
1. 개인 계정으로 fork
orgaization에 존재하는 SODA FE repository를 개인 계정으로 fork 해왔다.
2. 개인 계정에서 github token 발급받기
Developer settting ➡️ Developer Settings ➡️ 토큰 발급 (classic)
여기서 체크한 것처럼 꼭 repo 체크를 해야 한다.
발급된 토큰은 다시 보여주지 않으니까 꼭 이 때 복사해두어서 저장해서 사용해야 한다.
3. build.sh 파일 생성 (organization의 팀 Repo)
organization에 존재하는 팀 repository 내부 프로젝트 루트 경로에 build.sh 파일을 생성해야 한다.
#!/bin/sh
cd ../
mkdir output
cp -R ./[레포이름]/* ./output
cp -R ./output ./[레포이름]/
이 스크립트를 통해 팀 repo에서 개인 repo로 코드를 복사할 수 있다.
4. secret key 설정
팀 repo에 secret key를 설정해야 한다.
Settings ➡️ Secrets and variables ➡️ Actions 여기서 설정하면 된다.
본인이 원하는대로 이름을 정해주면 되고,
AUTO_ACTION에는 아까 발급받았던 개인 계정의 token을 추가하면 된다.
EMAIL은 본인 계정의 이메일을 추가하면 된다.
5. github action 세팅
마찬가지로 팀 repo에 github action을 추가해야 한다.
.github/workflows/[원하는 파일명].yaml
저 위의 버튼을 클릭해서 내 마음대로 yml 파일을 설정할 수 있다.
name: git push into another repo to deploy to vercel
on:
push:
branches: [main]
jobs:
build:
runs-on: ubuntu-latest
container: pandoc/latex
steps:
- uses: actions/checkout@v2
- name: Install mustache (to update the date)
run: apk add ruby && gem install mustache
- name: creates output
run: sh ./build.sh
- name: Pushes to another repository
id: push_directory
uses: cpina/github-action-push-to-another-repository@main
env:
API_TOKEN_GITHUB: ${{ secrets.[깃허브토큰 secret key] }}
with:
source-directory: 'output'
destination-github-username: [fork한 깃허브 계정]
destination-repository-name: [fork한 repo 이름]
user-email: ${{ secrets.[이메일 secret key] }}
commit-message: ${{ github.event.commits[0].message }}
target-branch: main
- name: Test get variable exported by push-to-another-repository
run: echo $DESTINATION_CLONED_DIRECTORY
그리고 이걸 추가해주면 된다.
main 브랜치에 PR merge되거나 커밋된 코드들을 자동으로 개인 계정 레포에 복사해주는 역할을 해준다.
그러면 만약 main 브랜치에서 변경이 되면,
fork한 개인 레포에도 업데이트가 되는 걸 알 수 있다.
6. vercel 배포
이미 배포를 완료해서 임시로 캡처해서 가져왔다.
vercel 배포야 금방 할 수 있으니 과정은 생략해야지.
아무튼, 이러한 과정을 거쳐서 성공적으로 배포할 수 있게 되었다.
물론 아직 여러 세팅이 완료되지 않아서 제대로 동작하지 않지만 내일 안으로 해결할 것 같다.
빌드 하기 전에 수많은 오류들을 만났지만...타입스크립트 타입 오류가 너무 많았어서 오늘 안에 다 해결할 수는 있었다.
사실은 이렇게 우회해서 하는 것보다 정식 과정을 거치거나 다른 걸로 배포하는게 좋겠지만...
어쩔 수 없는 선택이었다고 생각하고 ㅋㅋ
그나마 오늘 안에 배포할 수 있어서 다행이라고 생각한다.
참고 출처