もくじ
https://tera1707.com/entry/2022/02/06/144447#Azure
やりたいこと
こちらの動画で紹介されていた、Azure app Service を試してみた。
そのときにやったことをメモしたい。
やったこと
Azure App Serviceの登録・準備
azure app service で検索。
ヒットした下記ページの「Azureを無料で試す」を押す。
https://azure.microsoft.com/ja-jp/products/app-service
無料で始める を押す
自分のAzureアカウントを作成するためのあれこれの入力をする。
（メモせず一回通り過ぎてしまったのでメモ無し）
アカウント作成の際には、クレジットカードの登録も行う。Azureの有料プランを使ったときに、支払いを行うためと思われる。（自分の実験では、無料プランで行くつもり）
Azureアカウント登録時には自分のマイクロソフトアカウントを紐づけるので、登録後は、ブラウザでマイクロソフトアカウントにログインしていれば、下記アドレスで、自分のAzureのHomeが開く。
https://portal.azure.com/?quickstart=true#home
Home画面で、App Service を押す。
「作成」を押す。
下記のような画面が開く。
とりあえず一番上の「基本」を開く。
その画面で、下記のような設定をした。
| 項目名 | 値 |
|---|---|
| サブスクリプション | デフォルトの値(私の場合は「Azure Subscription」と出てたのでそれ) |
| リソースグループ | 「新規作成」を押して、好きな名前をつけたグループを作成、それを選んだ |
| 名前 | 自分の好きなアプリ名を付けた。また、それが作ったWebアプリのアドレスになるので、分かりやすいのにする |
| 公開 | 「コード」にした |
| ランタイムスタック | 自分が現状一番知ってる「.NET6(LTS)」にした。 |
| オペレーティングシステム | Windowsにした。 |
| 地域 | 自分ちにちかい「Japan East」にした |
| 価格プラン(Windowsプラン) | 「新規作成」を押して、「F1」のついているプランを選んだ。（初回設定時、どう新規作成したかわすれたが、とにかく無料の「F1」にした） |
| ゾーン冗長 | この辺は、有償プランのみかかわるので今回なにもしてない。物理的なデータセンターの位置を分けて、災害時などの安全性を高めるようなものっぽい |
料金プランは下記のようになってる。今回はとにかくお試しなので無料の「F1」一択。
全部に入力して、「確認および作成」を押したら、下記のような画面になる。
（初回実施時に画面とってなかったが、これと同じような画面だったはず）
「既定のドメイン」に書かれてるアドレスが、自分のwebアプリのアドレス。
Webアプリの実装
VS Installerで下記の2つをインストールする。
VS2022を起動する。
「新しいプロジェクトの作成」で、「Blazor Web Assembly アプリ」を選ぶ。
適当なアプリ名を付けて、
今回は、MSの動画を真似て、下記のように「HTTPS用の構成」と「プログレッシブWebアプリケーション」にチェックを入れておき、「作成」を押す。
Blazorのひな型が作成される。
「Program.cs」がエントリポイントっぽい。で、「Pages」と「Shared」の中にある「.razor」という拡張子のコードが、ページの中身を記述したものっぽいが、現状の自分の知識だとざっくりこれがこれっぽいな、位しかわからないのでとりあえず置いといてビルドする。
ビルドしてF5を押すと、ローカルで作成された成果物がブラウザで実行された。こんな感じ。
とりあえず、これをさっき上で作ったWeb App Serviceにデプロイする。
デプロイ
ソリューションエクスプローラの中のプロジェクトを右クリックして、「発行」を押す。
「公開」ウインドウで「Azure」を選んで、
「Azure App Service (Windows)」を選ぶ。
VSにログインしてると、さっきAzureのポータルページで作ったターゲットとかが勝手に出てくる。（VSでログインしてなければログインを促される）
Azureのポータルの概要ページで言うとココな感じ。ともかくそれを選んで「完了」を押す。
準備が成功したら下記がでる。
下記の画面になるので、「発行」を押す。
成功したら、こんな感じの表示がでる。
「サイトを開く」を押すと、デプロイしたモノが開く。こんな感じで動いた。
所感など
とりあえず、動画で紹介いただいた内容を試してみた。
これだけの手順でwebアプリができちゃうんだなーと思った。
※もともと本格的なwebアプリに携わったことないので、これ以前がどれだけ大変だったのかを知らないが。。。。
以前、自分のqiitaの記事で、「今どきはUIってどうやって作るんだろう？」みたいなことを書いたときのコメントで、web(ブラウザ)でチャチャっとやっちゃうよ、みたいなことを書いていただいたことがあったが、これがそういうことなんだろうか？（確かに、ブラウザでポンと開けるのは便利かもしれない）
Blazorの使い方など、まだ全然わかってないが、C#で書けるということで、他の言語(javascriptなど)などよりもすごくとっつきやすい感は感じる。
（昔javascriptをやってはいたが、それでもやっぱりC#の方がいいなと感じる）
デスクトップアプリ（WinUI3）で作っていた下記のバージョン更新ツールとか、Webアプリ化したら面白いかも？と思った。おいおいやってみる。（できるのかどうかはまだ勉強不足で知らないが、、、）
あと、知ってる人には常識なのかもしれないが、
コードをちょっといじってみて、ビルドして、デプロイ、を行っても、ブラウザ上で変化がないときがある。
多分キャッシュ？のせいだと思うのだが、ブラウザ上で変更後の動作確認したいときってどうされてるのだろう？
その辺のWebアプリの常識がまだわからない。。。
参考
[Japanese] Let's Learn .NET - Azure
