飲酒プログラミングの記録
本記事は飲酒プログラミングAdventCalenderの提供でお送り致します。
こんにちは @ymndです。みなさまいかがお過ごしでしょうか。
今回は遊んでしまっているドメインがあるのでFirebase Hostingでブログを展開できればと思います。中尾醸造さんの誠鏡のしぼりたて生原酒からスタートです。
Firebase Hosting
まずFirebaseにサインインし、新しいプロジェクトを作成します。プロジェクト名はSakeBlogとしました。
プロジェクトが作成できたら、開発 > Hostingを選択します。手順に沿って、Firebase CLI のインストール、Google へのログイン、プロジェクトの開始をします。firebase loginを実行するとnodeのバージョンが古いとはねられました。前途多難です。nodebrewでバージョンを切り替え、再度ログインします。firebase loginを実行したところ、Already logged in as hogeと出力されました。そういえば前にログインしたことあったなあ。
firebase initでHostingを選択します。はいエラーです。カーソルをあわせてEnterしただけで選択できていませんでした。再び実行してspaceを押しても何も反応がない。おかしい。一体何が起きているんだ。入力言語が日本語になっていました。本当にありがとうございました。Create a new projectを選択したところ、Please specify a unique project id (warning: cannot be modified afterward)と表示されました。こういう大事なところでタイポしがちなので何度も読み返します。What would you like to call your project? (defaults to your project ID) もよしなにします。で、Enterすると、エラーです。
firebase-debug.logをlessすると、FirebaseError: HTTP Error: 400, Request contains an invalid argument.とのことです。Project IDにunderscoreを入れたのがダメだったのかな。hyphenに変えてみました。エラーです。既に存在するProject IDだそうです。suffixをつけて再挑戦。
🎉🎉🎉 Your Firebase project is ready! 🎉🎉🎉
いえーーーーーい :ultra_fast_parrot:
次のお酒を準備しよ。神雷を注ぐ。
まだ終わってなかった。
What do you want to use as your public directory? public
Configure as a single-page app (rewrite all urls to /index.html)? Yes
よし終わり。firebase deployをしていきます。
できたー！！
カスタムドメインを指定
次にカスタムドメインを指定していきます。Firebase Hostingのページに戻り、ドメインを接続をポチ。TXTレコードをDNSプロバイダに追加してと表示されました。
お名前ドットコムの会員IDを忘れて苦戦しています。ネームサーバーの設定 > DNS設定/転送設定 > DNSレコード設定を選択します。DNSレコード設定 完了通知が来たので、Firebaseに戻って所有者の確認をポチっとします。エラーです。まだ伝播されていなかったようです。お燗してこよ。
6分くらいして再試行したら通りました。表示されたA レコードを登録します。うーんお名前ドットコム、入力欄が別になってるからペーストできないので手入力をしていきます。
★DNS プロバイダから古い A レコードとすべての AAAA レコードを忘れずに削除してください。
忘れるとすごく良くないことが起きるので注意しましょう。
証明書のプロビジョニングが完了するまでの数時間の間は、サイトで証明書に関するセキュリティ警告が表示されます。とのことなのでお酒を飲みつつ待ちます。
1~2時間後( ˘ω˘) :sake:
ステータスが接続されました、になりました。試しにリンクを踏んでみます。Site Not Foundが出ました。うまくいったようです。いや、うまくいってるわけがない。どうして。とりあえず、仙龍を冷蔵庫から取り出す。
Firebaseに向かいます。ドメインの紐付けを行ったプロジェクトにリリース履歴がない。いや、さきほどデプロイしたはずだ・・・。さきほどどこにデプロイした・・・？あ。Create a new projectで新しいプロジェクトを作ってる。それはだめだ。既に存在するProject IDだそうです。のエラーもそのとおりだ。自分で作ってるもの。
気を取り直して。firebase initで、既存のProject IDを選択。既に通った道なので早いです。秒です。deployしました。サイトが表示できました。敗北を知りたい。
GitHub Actions
次はサイトの内容をGitHubで管理し、pushを契機にGitHub Actionsでdeployするようにしてみます。新しいRepositoryを立てました。
このmediumの記事を参考に進めます。firebase login:ciでTokenを取得し、GitHubのRepositoryのSettings > Secretsに登録します。アカウントの方のSettingsじゃないよ。GitHub Actionsを開き、Set up a workflow yourselfを押し自分で設定します。
まずはドキュメントを読んでいきます。複雑なことはしないので、さくっとできました。ymlが書けたらcommitします。
サイトを更新する
奥鹿おいしい。さきほど用意したFirebase HostingのSAPをgit管理下に置き、git remoteにrepositoryを追加します。さて、pushしようとするもpullをしてねと言われました。それはそうだ。GitHub Actionsのymlが取り込まれてないもの。pullをすると、fatal: refusing to merge unrelated historiesが出るのでgit merge --allow-unrelated-histories origin/masterで混ぜ込んでpush。なんかActionsが動き始めた。1mくらい経過するとComplete jobの文字が。いけったっぽい。
完全勝利。余裕オブザイヤーですね。
はい、ここで計測終了です。完走した感想ですが、日本酒おいしいですね。あとFirebase HostingとGitHub Actionsの連携が便利でした。
この記事が気に入ったらサポートをしてみませんか？