---

Github Actions Firebase deploy

• Github과 Firebase를 이용해서 간단하게 CI/CD를 구축할 수 있습니다.
• Github Repository에 push를 하면, Github Actions에서 Build 되어 Firebase에 자동으로 배포됩니다.
• 기본적으로 로컬저장소와 원격저장소의 연결이 되어있어야 하며, Firebase에 새로운 프로젝트가 생성되어 있어야 합니다.

Firebase Tools

• Firebase에서 제공하는 툴을 전역(글로벌) 속성으로 설치합니다.

$ npm install -g firebase-tools

Firebase 초기화 및 셋팅

• 프로젝트 루트에서 $ firebase init 입력.

$ firebase init

     ######## #### ########  ######## ########     ###     ######  ########
     ##        ##  ##     ## ##       ##     ##  ##   ##  ##       ##
     ######    ##  ########  ######   ########  #########  ######  ######
     ##        ##  ##    ##  ##       ##     ## ##     ##       ## ##
     ##       #### ##     ## ######## ########  ##     ##  ######  ########

You're about to initialize a Firebase project in this directory:

  C:\Users\

? Are you ready to proceed? Yes

• Firebase Hosting용 파일 구성 및 GitHub Action 배포(선택 사항) 설정 선택.

? Which Firebase features do you want to set up for this directory? Press Space to select features, then Enter to confirm your choices. (Press <space> to select, <a> to toggle all, <i> to invert selection, and <enter> to    
proceed)
 ( ) Realtime Database: Configure a security rules file for Realtime Database and (optionally) provision default instance
 ( ) Firestore: Configure security rules and indexes files for Firestore
 ( ) Functions: Configure a Cloud Functions directory and its files
>(*) Hosting: Configure files for Firebase Hosting and (optionally) set up GitHub Action deploys
 ( ) Hosting: Set up GitHub Action deploys
 ( ) Storage: Configure a security rules file for Cloud Storage
 ( ) Emulators: Set up local emulators for Firebase products
(Move up and down to reveal more choices)

Project Setup

• 기존 프로젝트 사용(Use an existing project) 선택.

=== Project Setup

First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.

? Please select an option:
> Use an existing project
  Create a new project
  Add Firebase to an existing Google Cloud Platform project
  Don't set up a default project

• Firebase가 로그인 되어있다면, 프로젝트가 뜨고 프로젝트를 선택.

? Select a default Firebase project for this directory:
  sample-7b329 (sample)
  sample-cce0b (sample2)
> coldair-21cd5 (coldair)

Hosting Setup

• 디렉토리 명을 build로 설정.

=== Hosting Setup

Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.

? What do you want to use as your public directory? build

• 단일 페이지 앱 구성과 Github 자동 빌드 및 배포 "Yes" 설정.

? Configure as a single-page app (rewrite all urls to /index.html)? Yes
? Set up automatic builds and deploys with GitHub? Yes
+  Wrote build/index.html

i  Detected a .git folder at C:\Users\
i  Authorizing with GitHub to upload your service account to a GitHub repository's secrets store.

Visit this URL on this device to log in:
https://github.com/login/oauth/authorize?client_id=89cf50f02ac6aaed3484&state=1004208799&redirect_uri=http%3A%2F%2Flocalhost%3A9005&scope=read%3Auser%20repo%20public_repo

Waiting for authentication...

+  Success! Logged into GitHub

• Github 로그인 창에서 로그인.
  
• (Github ID)/(레포지토리 이름) 형태로 Github 저장소 선택.

? For which GitHub repository would you like to set up a GitHub workflow? Github ID/레포지토리 이름

+  Created service account github-action-646210410 with Firebase Hosting admin permissions.
+  Uploaded service account JSON to GitHub as secret FIREBASE_SERVICE_ACCOUNT_COLDAIR_21CD5.
i  You can manage your secrets at https://github.com/settings/secrets.

• 배포전 실행할 스크립트를 설정. (npm ci && npm run build or yarn && yarn build)

? Set up the workflow to run a build script before every deploy? Yes
? What script should be run before every deploy? npm ci && npm run build

+  Created workflow file C:\Users\.github/workflows/firebase-hosting-pull-request.yml
? Set up automatic deployment to your site's live channel when a PR is merged? Yes

• 배포될 사이트와 저장소 브랜치를 선택.

? What is the name of the GitHub branch associated with your site's live channel? master

+  Created workflow file C:\Users\.github/workflows/firebase-hosting-merge.yml

i  Action required: Visit this URL to revoke authorization for the Firebase CLI GitHub OAuth App:
https://github.com/settings/connections/applications/89cf50f02ac6aaed3484
i  Action required: Push any new workflow file(s) to your repo

i  Writing configuration info to firebase.json...
i  Writing project information to .firebaserc...

+  Firebase initialization complete!

• 설정이 모두 끝났다면 push.

마무리

• Github Actions에 workflows에서 확인이 가능합니다.
  
• Firebase에 정상적으로 호스팅이 되는것을 확인할 수 있습니다.
  

---