GitHub Organization 프로젝트를 vercel 무료로 연동하기 (+git actions)

김민아·2023년 1월 14일

github Organization에 속한 프로젝트는 vercel에서 유료(team plan)로 배포됩니다. 팀 프로젝트를 개인 레포로 클론해 무료(personal plan)로 배포하는 방법입니다.

부트캠프에서 작업하던 팀 프로젝트를 일찍 배포해버린 덕분에 trial을 소진하고 vercel 결제 후, 실수로 닫아버리는 등 프론트 서버를 배포하는데 많은 시행착오를 겪었습니다. ~~변명이 기네요~~
데모데이부터 이후 N개월 동안 유지할 수 있도록 임시방편으로 아래 방법을 선택했습니다.

팀 프로젝트 hobby에 배포하기

github organization에 소속된 레포의 프로젝트는 vercel로 연동하면 자동 team plan으로 배포된다. 얼마간 트라이얼을 주는데, 어쨌든 배포하기 위해서는 프로젝트 별로 구매가 필요하다.

팀의 작업플로우는 유지하며 최대한 자동화하는 방법으로 찾아보았다. 본 레포에 PR이 되면 actions으로 개인 레포에도 push되고, 개인 레포를 hobby(무료)로 연결하여 배포하는 방법이 있었다. 🥹

아래 나오는 방법은 모두 👉 여기를 참고하여 정리한 것입니다. 🙏

개인 레포에서 할 것

1. 새 repo를 생성 (public)

2. vercel에 연동

hobby(personal) plan으로 연동한다. (생략)

2. 개인 유저의 secret 토큰 발급

개인 github 설정에서 Personal access tokens > Token을 하나 만들어 준다. repo 권한에 체크한다.

ghp_로 시작하는 토큰은 다시 안나오니 잘 복사해 둔다.

팀 레포에서 할 것 (Organization)

이하, Organization repo는 team-repo,
개인 repo는 your-repo를 의미.

1. `build.sh` 파일 생성

경로: /build.sh

#!/bin/sh
cd ../
mkdir output
cp -R ./[team-repo-name]/* ./output
cp -R ./output ./[team-repo-name]/

2. secret 변수 등록

team-repo settings에 들어가면 actions에 사용할 시크릿 변수를 등록할 수 있다. 개인 계정의 이메일과 아까 만든 ghp_로 시작하는 토큰을 등록한다.

3. GitHub Actions 활성화 & 워크플로우 생성

actions 탭에서 new workflow를 선택하고 set up a workflow yourself를 선택하면 위 화면과 같이 yml 파일을 생성할 수 있다. 생성된 yml 파일은 아래 경로에 저장된다.

경로: /.github/workflows/[anyTitle].yml

아래destination-github-username과 destination-repository-name에 개인 레포 소유자의 username과 repo 이름을 적어준다.

API_TOKEN_GITHUB과 user-email에 팀 레포 설정에서 등록한 시크릿 변수 이름을 적어준다.

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.AUTO_ }}
        with:
          source-directory: 'output'
          destination-github-username: [your-repo-github-username]
          destination-repository-name: [your-repo-name]
          user-email: ${{ secrets.OFFICIAL_ACCOUNT_EMAIL }}
          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