あーGitHubにpushしたら自動で公開出来たら良いのになー
SSLに対応したドメインだといいなー
サーバー建ててインフラ周りの設定するのはめんどくさいなー
小さいプログラムだから無料がいいなー
それAzure WebAppsで出来ます
この記事を読むと出来ること
- GitHubにpushしたらサーバー上で公開される
- SSL対応のサーバーが建つ
- インフラの設定を気にしなくても良い。
ということで検証環境などにすると良いと思います。
独自ドメインの設定や、サーバースペックがいる場合などは、有料になるそうです。
前提
- GitHubのアカウント
- Azureのアカウント
Azureのアカウントは学生なら無料で作成出来るので、作成しておいて損はないと思います。
Azure for Students – 無料アカウント クレジット | Microsoft Azure
GitHub
リポジトリを作成
リポジトリ名は何でも良いです。
適当にpush
公開したいファイルをpushします
今回は適当にindex.htmlを作成しました。
Azureの設定
WebAppsを起動
AzureのポータルからAppServiceをクリックします
追加を押して新規に作成します
リソースグループは適当に新規作成します。
すみません。あまり良くわかってないです。
これを単体で使う分にはなんでも良いと思います
名前も適当です。ただし、どこかの誰かと同じ名前は入力出来ない(ドメインだだから)ので、注意してください
コードを選択します。
ランタイムスタックはサーバー内で何を動かすかということです。
今回はPHP7.3を選択しました
nodeとかPythonとかRubyとかいろいろあります。
OSはLinuxにしました
地域はどこに建てるかですね
無難にJapan East
サイズは環境によって適宜変えてください。
今回はすごく小さなものなので、Freeでいきます
すべて設定が終われば作成を押します。
GitHubを関連付ける
構築が完了すると、右上の通知欄にリソースへ移動というのが出てくるので、そちらをクリックしてリソースへ移動します
この画面のデプロイセンターをクリック
真ん中のGitHubを選択して、ログインします。
この画面はログイン済みのためアカウント名が出ています
ログインしたら続行
AppServiceのビルドサービスを選択して続行
リポジトリとブランチを設定します
設定したら続行
補足
設定完了できないときは、各言語の名前を確認してください
それぞれ決まっているようです
Azure App Service への継続的デプロイ
URLへアクセス
完了したら概要にいき、URLを確認してアクセスします
GitHubのindex.htmlが反映されていますね。
CSSやJavaScriptももちろん動いています
GitHub
GitHubにpush
phpinfo.phpを作成して、phpが動いているかを確認します
念の為中身
<?php
phpinfo();
?>
Azure
https://hoge.azurewebsites.net/phpinfo.php にアクセスすると…
phpが動いていますね！！
これでGitHubにpushしただけで自動的にサーバーに反映してくれるようになりました。
そしてちゃっかりhttps://~~になっています
最高！