Ceeds Academy教材アプリ教材・症状語・タグで検索
索引グラフ試す
Azure▸Azure App Service

Azure: App Service にデプロイ(Linux・Node 22 LTS)

hands-on所要 30分最新草稿
前提: クラウド: 基礎(IaaS / PaaS / SaaS・リージョン・従量課金)→次: Azure: Cosmos DB の基礎(マネージドNoSQL・無料枠)次: Azure: Entra External ID で認証(パスワードレス・MAU無料枠)
意味グラフ(この教材と内容的に近い教材・1ネスト)
例え(Analogies)
App Service=入居済みの貸スペース

App Serviceは内装・電気・空調(OS・パッチ)が済んだ貸スペース。あなたは商品(アプリ)を運び込むだけで開店できる。鍵や住所(環境変数)は管理人に預け、店内(コード)には貼らない。

概要

📍 Azure ▸ App Service ▸ デプロイ | 種別: hands-on | facts_as_of 2026-06(Azure App Service Linux / Node 22 LTS / Next.js 16)

公式ドキュメント — hands-on

🎞 スライド

App Service = PaaS の Web 実行環境

OS 管理なしで Node / Next.js を動かす

デプロイの流れ(テキスト図)

[ローカル / リポジトリ] ──az webapp up──▶ [App Service (Linux)]
│ ランタイム: NODE|22-lts
▼
[App Settings に環境変数]

どこに置く?

Next.js 16 → App Service(Linux) または Static Web Apps
秘密(NOTION_TOKEN等) → App Settings(コードに書かない)

—
出典(sources)

learn.microsoft.com (App Service / Static Web Apps Next.js) ; 2026-06確認

確認問題(Review-Questions)
NOTION_TOKEN のような秘密情報はどこに置く?択一
基礎公式
解答・解説▾ 開く

App Settings(環境変数)。コードには書かない・コミットしない。

Linux App Service で Node 22 LTS を指定するCLIは?コード
基礎公式
解答・解説▾ 開く

az webapp config set ... --linux-fx-version "NODE|22-lts"(または az webapp up --runtime "NODE|22-lts")。

目次
例え概要公式ドキュメント出典確認問題
鮮度
最新
更新: 2026-06-15
次回棚卸し: 2026-12-15
周期: 6か月
版: Azure App Service (Linux, Node 22 LTS) / Next.js 16

概要

App Service は PaaS の Web アプリ実行環境。OS 管理なしで Node/Next.js を動かせる。Next.js 16 は App Service(Linux) または Static Web Apps へデプロイする。

公式ドキュメント準拠(Azure CLI)

# Linux App Service に Node ランタイムを指定
az webapp config set -g <resource-group> -n <app-name> \
  --linux-fx-version "NODE|22-lts"

# デプロイ(例: az webapp up / GitHub Actions / zip)
az webapp up -n <app-name> -g <resource-group> --runtime "NODE|22-lts"
  • PaaS=OS/パッチ管理不要。環境変数は App Settings に(NOTION_TOKEN 等はここ・コードに書かない)。
  • 代替: Azure Static Web Apps(Next.js ハイブリッド対応)。CI/CD は GitHub Actions。

出典: App Service に Node をデプロイ / Static Web Apps (Next.js)

🧭 誤解訂正集

よくある誤解 正しい理解
環境変数はコードに書く App Settings に置く(コードに書かない)
Next.js は必ず App Service Static Web Apps も選べる(ハイブリッド対応)
ランタイムは自動で合う ランタイム(NODE 22 LTS 等)を明示指定しないと不一致で起動しない

📖 用語

  • PaaS … OS/パッチ管理を任せ、アプリだけ載せる実行環境。
  • App Service … Azure の PaaS Web 実行環境(Linux で Node/Next.js 可)。
  • ランタイム … アプリを動かす言語/版(例 NODE|22-lts)。
  • App Settings … App Service の環境変数置き場(秘密はここ・コードに書かない)。
  • Static Web Apps … 静的+API 向けの Azure ホスティング(Next.js ハイブリッド対応)。
  • CI/CD … ビルド〜デプロイの自動化(例: GitHub Actions)。

✅ 確認の目安(can-do)

App Service と Static Web Apps の使い分け、ランタイム指定と環境変数(App Settings)の置き場所を説明でき、**「この Next.js アプリをどこに・どうデプロイするか」**を判断できる。

⚠️ エラー復旧集

症状 原因 復旧
起動しない ポート/ランタイム不一致 process.env.PORT を使う / NODE 版を揃える
設定値が空 env 未設定 App Settings に環境変数を登録
ビルド失敗 Node 版/依存 ログで特定、ローカルと版を一致