静的Webサイトをホストしたいなー、なんとなくAzure出やりたいなと考えていたら良さげなサービスを発見。
その名もAzure Static Web Apps。GitHubにソースコードが入ったrepositoryを準備するだけで自動で静的WebAppのデプロイまでやってくれるらしい。しかも無料のSKUもある。
まずはAzureポータルにログイン
検索すると出てくるので選択。
早速つくってみます。
諸々の値を設定するのですが、重要なのはOrganization, Repository, Branchの値。
AzureにGitHubアカウントを連携してあるとここで自分のGitHubのbranchを設定できます。
まずはまだやっていないひとは、AzureとGitHubアカウントを連携しましょう。
また、GitHubでは適当にこれ用のRepositoryを作ります。
すべて終わったらReview+Create。
完成したらOverviewのURLからサイトにアクセスできます。
ただし、このURLはあまりに味気ないので、自前のドメインに変更します。
カスタムドメインから変更可能。
私の場合はお名前.comで購入済みのドメインを使います。
このTXT形式のレコードをお名前.comのサイトで登録することでドメインの所持証明をします。
以下のようにお名前.comで私はレコードを追加しました。VALUEはAzureポータルからコピペします。
しばらくすると認証されるので、続けてCNAMEレコードとAレコードをお名前.comのDNSレコードに登録して、自前のドメインでサイトにアクセスできるようになります。
それでは最後にソースコードをGitHub Repositoryの対象ブランチにコミットします。
適当にindex.htmlとBootstrapのテンプレートを組み合わせて配置。
こんな感じで見られます。
今後は変更をコミットしてリモートにpushしていくだけで、自動で変更がデプロイされます。