そのまま公開可能
ビルドレスな静的サイトなので、`AzureStaticWebApp@0` タスクで即デプロイできます。
Prepared for SWA
静的サイトの良さを最大限に活用
HTML/CSS/JS だけでも、トグル・ログ・カードなど手触りの良い UI を作れます。ここでは練習に役立つ仕掛けをまとめました。
3
主要ファイル
0
ビルドコマンド
1
パイプライン
演習用に用意した 4 つの仕掛け
ルーティング設定済み
`staticwebapp.config.json` に SPA フォールバックとセキュリティヘッダーを設定済み。
テーマトグル
フロントの JavaScript を編集すると自動ビルド → デプロイの動きを確認できます。
ログカード
擬似デプロイログを JS で生成。パイプライン成功後に内容を差し替える想定。
ライト / ダークテーマ
ボタン 1 つでテーマを切り替えできるので、UI 変更のデプロイ動作を試せます。
部分的な編集が容易
ページを分けたことで、`git diff` も分かりやすくなりました。SWA でも必要な HTML だけを置き換え可能です。
Config も併せて練習
ヘッダーやフォールバック設定の更新 → デプロイという構成変更を体験できます。