---
title: Codex × GitHub Actions × Azure Storageで実現する静的サイト構築と自動デプロイ
tags:  #azure #github #github actions #azure storage #クラウド #自動デプロイ #認証 #認可 #entra id #codex #ci/cd  
author: [束野通洋](https://www.docswell.com/user/6910381277)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/57GLWYDDEL.jpg?width=480
description: 2026年9月12日 第5回 JAZUG Shizuoka 登壇枠(静岡県民枠)で発表した資料になります。 https://jazug.connpass.com/event/400263/
published: September 13, 26
canonical: https://www.docswell.com/s/6910381277/KGNVGQ-2026-09-13-110131
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/57GLWYDDEL.jpg)

Codex × GitHub Actions × Azure Storage
で実現する
静的サイト構築と自動デプロイ
Michihiro Tsukano / 束野 通洋
2026/09/12
第5回 JAZUG Shizuoka


# Page. 2

![Page Image](https://bcdn.docswell.com/page/4EQY3M1XJP.jpg)

自己紹介
Michihiro Tsukano / 束野 通洋
Cloud Engineer / クラウドエンジニア
経歴
•
•
2026.07～現在
ヤマハ株式会社
2020.04～2026.06 ローランド ディー.ジー.株式会社
JAZUG Shizuoka 登壇
•
•
2025.06 第2回 JAZUG Shizuoka
2025.02 第1回 JAZUG Shizuoka リブートイベント
Microsoft Azure
02


# Page. 3

![Page Image](https://bcdn.docswell.com/page/KJ4W1VR271.jpg)

概要
個人サイト構築
これまでの経験や実績を整理するために
Microsoft Entra ID
認証
Codex
GitHub Actions
Azure Storage
フロント開発・Git操作
変更を検知してデプロイ
静的Webサイトを公開
本日は公開先から順に：Azure Storage → 認証・認可 → GitHub Actions → Codex
03


# Page. 4

![Page Image](https://bcdn.docswell.com/page/LE1YG3QK7G.jpg)



# Page. 5

![Page Image](https://bcdn.docswell.com/page/GEWGKPMPJ2.jpg)

Azure Storageの静的Webサイト機能
$webに配置し、専用のWebエンドポイントで公開
HTML / CSS / JavaScript / 画像を、そのまま配信
アクセス
返すファイル
/
index.html（既定ページ）
存在しないパス
404.html（設定したエラーページ）
通常のBlobとの違い
通常はファイル単位の取得。既定ページ・404ドキュメントの設定はない。
04


# Page. 6

![Page Image](https://bcdn.docswell.com/page/47ZLZKQ6J3.jpg)



# Page. 7

![Page Image](https://bcdn.docswell.com/page/YJ6WZQ6LJV.jpg)

認証：Microsoft Entra ID
「誰としてアクセスするか」を確認する
GitHub Actionsが、デプロイ用アプリとしてAzureへ接続するための認証。
01 アプリを登録
Microsoft Entra IDでアプリを登録し、Client IDとTenant IDを取得する。
02 資格情報を設定
クライアントシークレット、またはフェデレーション資格情報を設定する。
03 アクセストークンを取得
Entra IDが資格情報を検証。認証後、Azure向けのアクセストークンを発行する。
05


# Page. 8

![Page Image](https://bcdn.docswell.com/page/GJ5MWR6MJ4.jpg)

認証方式の比較
観点
クライアントシークレット
フェデレーション資格情報
仕組み
秘密の文字列を提示
GitHub発行のOIDCトークンを提示
メリット
仕組みが分かりやすい
多くの環境で利用できる
Azure用の長期シークレット不要
保管・定期更新の負担を減らせる
デメリット 安全な保管・期限管理が必要
漏洩すると不正利用のリスク
信頼条件の正確な設定が必要
今回はフェデレーション資格情報を採用
長期シークレットを持たずに、自動デプロイを実現できるため。
06


# Page. 9

![Page Image](https://bcdn.docswell.com/page/LE3W4PQ9E5.jpg)



# Page. 10

![Page Image](https://bcdn.docswell.com/page/8EDKQL987G.jpg)

認可：Azure RBAC
「何を、どこまで操作してよいか」を決める
割り当て先
デプロイ用アプリのサービスプリンシパル
ロール
ストレージ Blob データ共同作成者
スコープ
公開先のストレージアカウント
対象ストレージアカウント → アクセス制御（IAM）で設定
サブスクリプション全体には付けず、権限の範囲を限定。
09


# Page. 11

![Page Image](https://bcdn.docswell.com/page/V7PKL2ZWJ8.jpg)



# Page. 12

![Page Image](https://bcdn.docswell.com/page/2JVVQDW9JQ.jpg)

GitHub Actionsによる自動デプロイ
YAMLに「いつ実行するか」と「何を実行するか」を定義
on:
push:
branches: [main]
paths:
- &quot;codex/**&quot;
- &quot;.github/workflows/deploy-azure-storage.yml&quot;
workflow_dispatch:
permissions:
contents: read
id-token: write
concurrency:
group: azure-storage-production
cancel-in-progress: true
GitHub側の事前設定
Settings →
Secrets and variables → Actions
Secrets
AZURE_CLIENT_ID
AZURE_TENANT_ID
AZURE_SUBSCRIPTION_ID
Variables
AZURE_STORAGE_ACCOUNT
10


# Page. 13

![Page Image](https://bcdn.docswell.com/page/5EGLWYD4JL.jpg)



# Page. 14

![Page Image](https://bcdn.docswell.com/page/4JQY3M1R7P.jpg)

GitHub ActionsからAzureへアップロード
env:
AZURE_STORAGE_ACCOUNT: ${{ vars.AZURE_STORAGE_ACCOUNT }}
steps:
- uses: actions/checkout@v4
- uses: azure/login@v2
with:
client-id: ${{ secrets.AZURE_CLIENT_ID }}
tenant-id: ${{ secrets.AZURE_TENANT_ID }}
subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
- run: |
az storage blob upload-batch \
--account-name &quot;$AZURE_STORAGE_ACCOUNT&quot; \
--auth-mode login \
--destination &#039;$web&#039; \
--source codex \
--overwrite true
1 取得
checkoutで
サイトのファイルを取得
2 認証
OIDCでAzureへログイン
長期シークレットは不要
3 配置
codex → $web
同名ファイルを上書き
11


# Page. 15

![Page Image](https://bcdn.docswell.com/page/K74W1VRQE1.jpg)

Codexを活用した開発
「個人サイトを作ってください」からスタート
プロンプトで指示
プッシュ
確認・修正を
繰り返す
Codexが作業
コミット
12


# Page. 16

![Page Image](https://bcdn.docswell.com/page/LJ1YG3QLEG.jpg)



# Page. 17

![Page Image](https://bcdn.docswell.com/page/GJWGKPMQ72.jpg)

まとめ
開発から公開まで、更新を続けられる仕組みに
Codex
プロンプトで開発を進め、Git操作まで依頼
GitHub Actions
プッシュをきっかけに静的ファイルを自動デプロイ
Azure Storage
静的Webサイト機能で公開
認証はフェデレーション資格情報、認可は対象ストレージに限定。
13


