会社のホームページをNuxtで作ってfirebaseでhostingして、Github Actionsでデプロイできるようにした

November 22, 2019,
tags:


このエントリーをはてなブックマークに追加

PartyHard Inc.

最近ホームページみられる機会増えたし、お問い合わせフォームからはウザい宣伝ばかりくるので、ホームページが見られる機会も増えたのでリニューアルしました🎉

前回のホームページよりマシな気がしますが、そんなこともない気がします。
(誰かデザインやってくれる人いないですかね…費用はほとんど出せませんが…)

Nuxtを選んだ理由

とくにないです。

FirebaseでHostingしている理由

無料だしSSLなので便利やなぁーと。

Github Actionsでデプロイできるようにした

うちの社長でも比較的気軽に変更して更新できるように今回はGithub Actionsを使って自動でデプロイできるようにしました。

ブランチとしては master , releaseの2つにわけていて、hubot-github-pr-releaseを使ってSlackからリリース用のPRを作るようにしています。
Releaseブランチが更新されたタイミングでデプロイするようにしています。

で、今回のGithub actionsはこんな感じです。

# .github/workflows/deploy.yml
name: deploy
on:
  push:
    branches:
      - release

jobs:
  deploy:
    name: Build & Deploy
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [12.x]

    steps:
      - uses: actions/checkout@v1
      - name: Run tests with ${{ matrix.node-version }}
        uses: actions/setup-node@v1
        with:
          node-version: ${{ matrix.node-version }}
      - name: npm install, build, and test
        run: |
          yarn install
          yarn lint
          yarn generate
      - name: Deploy to Firebase
        uses: w9jds/firebase-action@master
        with:
          args: deploy
        env:
          FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
      - name: Notification
        env:
          SLACK_BOT_TOKEN: ${{ secrets.SLACK_BOT_TOKEN }}
        uses: pullreminders/slack-action@master
        with:
          args: ‘{\”channel\”:\”CANNEL_ID\",\"text\”:\”デプロイが完了しました\”}’

Firebaseのトークンについて

githubのsecretsでFirebaseのトークンを登録しています。
生成方法は以下のとおりです。

firebase login:ci

出力された結果を貼り付ければおけです。

最後に

お仕事あったらぜひお声がけください。

comments powered by Disqus