Miobiki

  1. HOME
  2. github
  3. GitHub Actionsを使ってGitHub Pagesにデプロイ

GitHub Actionsを使ってGitHub Pagesにデプロイ

作ってみたいアニメーションがあり、そのデモ環境としてGitHub Pagesを利用した。
最初はローカルからgh-pagesを利用してデプロイしていたが、面倒なのでGitHub Actionsでデプロイされるようにした。

GitHub Actionsの流れはこんな感じ。

push
  
masterブランチでfilter
  
npm install
  
npm run deploy

workflowとpackage.jsonはこんな感じ。

そんな感じでできたのがこちら
リポジトリ(GitHub)
DEMO(GitHub Pages)

GitHubでダミーのメールアドレスを使用する
アドレスはこちらQiitaを参考にした。

ただ、gh-pagesへデプロイをActionsでやって、スムーズにいったためしがない。
素直にローカルからデプロイするか、netlifyを利用したほうが楽。

このリポジトリは、Zedd, Alessia Cara - Stay (Official Lyric Video) の歌詞表示がクールだったから、JSでのサンプル実装。