# TIL-20210322

# Github actions를 이용해 자동으로 pages 업데이트 하기

# 기존 처리 방식

로컬에서 빌드한다.
새로 빌드한 디렉토리dist에서 새로운 git init을 실행한다.
새로 만든 gitbase에서 원격 저장소를 연결한다.
gh-pages에 강제로 푸시한다.

위 과정은 언제나 똑같다. 어떤 글을 써도 똑같이 진행한다. 이 과정을 한번에 진행할 수 있는 방법을 찾는 중에 vuepress 공식 페이지에서 추천하는 방법들이 있다.

# 자동화 방법

추천하는 방식은 세 가지 이다.

매번 쉘 스크립트를 실행한 후 push하는 것
gitlab을 이용하는 것
Travis CI를 이용하는 것

매번 쉘 스크립트를 실행한 후 push하는 것 ❌
로컬에 빌드하는게 맘에 들지 않았다. 로컬에서는 라이브 서버도 열지 않고 테스트하고 싶은 맘이다.
Travis를 이용하는 것 ❌
지금 vuepress도 처음 쓰는데 Travis까지 한번에 이해하려고 하는건 너무 과하지 않을까라 생각 했다.
gitlab(OR actions)를 이용하는 것 👍 내가 고른것
깃은 평소에도 자주 사용하니까 뭔가 쉽게 눈에 들어오지 않을까란 안일한 판단으로 이게 제일 맘에 들었다.

# 첫 단추

나는 Github actions을 이용하기로 했다.
yaml을 통해서 github actions을 정의 할 수 있다.
yaml 데이터를 통해서 정해진 스크립트가 실행된다.

스크립트가 작동되는 트리거 부터 환경 및 순서 까지 내가 다 정할 수 있었다.
처음에 접근한 방식은 최대한 사용자 정보 없이 데이터를 업데이트 할 수 있는가 였다.

기본적으로 내가 하던 방식을 스크립트로 구현하기로 했다.

# 일단 가상 컴퓨터에서 다시 내 레포를 initialize하고 vuepress를 빌드한다.
- name: npm init & vuepress build
  run: |
    npm install
    npm run build

  # github settings git 관련 기본 세팅을 설정한다.
  - name: git settings actions env
    run: |
      git config --global user.name "Re1one" 
      git config --global user.email j901207@gmail.com
      git config --global init.defaultBranch master

  # 빌드된 파일에서 새 레포를 생성해 pages로 반영한다.
  - name: create new commit and deploy gh-pages
    run: |
      cd docs/.vuepress/dist
      git init
      git remote add origin https://github.com/Reone1/uoM.git
      git add .
      git commit -m "deploy"
      git push -f origin master:gh-pages

# 문제 상황

사용자 정보를 입력했으나, 레포의 주인인지는 정확히 알 수 없는 상태로 남아있었다.
때문에 해당 레포에 대한 접근이 불가능 했고 origin으로의 푸시가 불가능 했다.

# 해결 방법

토근을 심는다.

# 기존 방식
git remote add origin https://github.com/Reone1/uoM.git
# 변경된 스크립트
git remote add origin https://Reone1:${{secrets.TOKEN}}@github.com/Reone1/uoM.git

토큰을 만드는 방법은 다른 포스팅으로 소개 해야 할 것 같다.
간단하게는 내 계정 설정에서 Developer settings에서 생성해서,
해당 레포에 secrets에 등록해서 사용한다.

secrets에 등록한 이름을 통해 actions에서 secrets의 props처럼 접근이 가능하다.

${{secrets.TOKEN}} # 내가 secrets에 설정한 TOKEN이라는 이름의 인증토큰

# 결론

처음에는 뭔가 actions 실행 과정에서 스크립트 실행 순서가 문제가 있는 것으로 생각했다.
일단 세팅 먼저 하고 다음을 진행안하면 문제가 생긴다.

중간에는 커밋도 하지 않고 푸시하려고 해서 문제가 생겼고
커밋 이후에는 해당 레포지토리가 없다는 말이 나와서,
origin이 정상적으로 설정되지 않는 것으로 오해했다.

토큰이 없어서 origin에 접근이 불가능했다는 걸 알고,
결국 토큰을 넣을 수 밖에 없었다.
자연스럽게 인증이 되는 방법은 없는 것 같다.
가만히 생각해보면 아무나 내 레포에 푸시한다는 말인데 말이 안된다...

중간에 진행하면서 알게 된 사실

remote add는 https 요청을 보낸다
remote set-url은 ssh 요청을 보낸다.

두 가지 명령어는 모두 오리진 세팅을 하지만,
프로토콜이 다르다.

사용자 인증 방식이 다른건데 설정을 안하면 큰 차이는 없다. 이후에 오는 주소값이 조금 다르다.

← TIL-20210321 TIL-20210323 →