#Vercel
40件の記事が見つかりました
Vercel 公式ドキュメント完全解説 — 全体目次と読み方
Vercel 公式ドキュメントを日本語で体系的に整理した解説集の目次。Frameworks / Functions / Edge / Storage / Observability といったコア機能、WAF / Bot Management / Deployment Protection 等のセキュリティ、v0 / AI Gateway / MCP / Sandbox の AI インフラ、最新動向、CLI・REST API 目次までを章立てで案内する。
第10回 デプロイ基盤の本番前チェック — Cloudflare / Vercel / Supabase 横断で見る
公開直前に3つの基盤を同じ観点で点検するための1枚の表を作ります。秘密情報の分離、環境の分離、公開範囲、鍵の種類、流入制御、短命な認証情報という6観点を、Cloudflare / Vercel / Supabase の3列で並べ、無料枠で何ができるかまで正直に書きます。
Cloudflare・Vercel・Supabase のどれを選ぶか
小規模なアプリを作って公開するとき、3つのサービスのどれを選ぶかを判断するための基準。3社は競合しきっておらず、担当する層が違います。認証の要否・データの持ち方・費用の伸び方という3つの軸で切り分けます。
1 何を作るか｜Vercel が引き受ける範囲と、引き受けない範囲
問い合わせフォームと管理画面を Next.js + Vercel で作る全7章の第1章。完成形の全体像と、Vercel が担当するホスティング・実行環境・配信の範囲、そして自前では持たないデータベースの扱いを最初に切り分けます。
Vercel 全体像 — AI Cloud としてのプラットフォームを俯瞰する
Vercel が提供する Frameworks / Functions / Edge / Storage / Observability / セキュリティ / AI インフラの全体像と、Next.js との関係・AI Cloud リブランディングの位置付けを俯瞰する概論章。
2 環境を用意する｜Next.js プロジェクトと Vercel CLI
Next.js の App Router プロジェクトを作り、Vercel CLI をインストールしてアカウントとリンクするまでを扱います。ローカル開発で npm run dev と vercel dev のどちらを使うべきか、公式の推奨とあわせて整理します。
Frameworks & Builds — どのフレームワークが第一級か、ビルドはどこまで設定できるか
Vercel が公式対応する 35+ の Frameworks（Next.js を筆頭に SvelteKit / Nuxt / Astro / Remix など）の差分、ビルド設定（Build Output API・Build Queues・Configure a Build）、Git 連携、モノレポ（Turborepo）対応、Private Registry までを俯瞰する。
Functions & Fluid Compute — サーバーレスから Active CPU 課金への進化
Vercel Functions の基本（Node.js / Python / Edge ランタイム）と、2025 年に新規プロジェクトのデフォルトとなった Fluid Compute（複数リクエスト同時処理・Active CPU 課金）の仕組みを解説。コールドスタート改善・ストリーミング・FastAPI ゼロコンフィグ対応までカバーする。
Routing Middleware & Vercel CDN — リクエストの最前線で何ができるか
Vercel の Routing Middleware（旧 Edge Middleware）と Vercel CDN の仕組みを解説。リクエスト書き換え・リダイレクト・認証ゲートを Edge で実行する設計と、Edge ランタイムの Node.js 互換性、Functions との使い分けまでカバーする。
ISR & Image Optimization — キャッシュと画像配信を Vercel 任せにする
Incremental Static Regeneration（ISR）と Image Optimization を中心に、Cache-Control ヘッダ・CDN Cache・Runtime Cache API・Vary / stale-if-error / Request Collapsing といったキャッシュ周辺機能を体系的に整理する。
Deployments & Environments — Preview / Production / Rolling Release / Skew Protection の使い分け
Vercel の Environments（Preview / Production / Custom）、Rolling Releases、Instant Rollback、Skew Protection、Spend Management 等のデプロイ運用機能を体系化。Git push ごとに発行される unique URL の使いどころと、本番安全運用のための前提を整理する。
Domains & Delivery Network — Vercel の DNS と CDN を使い切る
Vercel Domains（DNS 管理・カスタムドメイン）と Vercel Delivery Network（CDN）を解説。HTTPS DNS records 対応・Bulk Redirects・CDN 利用量管理など、本番サイト運用に必要なネットワーク機能を体系化する。
Storage & Marketplace — Vercel Blob・Global Config と Marketplace パートナー統合
Vercel が自社で提供する Storage（Vercel Blob・Global Config）と、Marketplace 経由で統合される外部プロバイダ（Neon / Upstash / Convex / Clerk / Stripe / Groq 等）を体系化。Native Integration の課金統合モデルとデータ層の選び方を整理する。
Observability & Analytics — Logs / Metrics / Traces / Web Analytics / Speed Insights を一望する
Vercel Observability Suite（Runtime Logs / Metrics / Notebooks / OpenTelemetry Drains）と Web Analytics・Speed Insights を体系化。Observability Plus の 30 日ログ保持や HTML 要素アトリビューションなど近年の機能追加までカバーする。
Queues & Workflows — durable イベントストリームと多段ワークフローを Vercel で完結させる
Vercel Queues は durable な append-only ログを軸にした event streaming 基盤であり、push/poll 両モード、fan-out consumers、idempotency キーによる重複排除を提供する。Vercel Workflows はその上に構築された多段オーケストレーション層であり、'use workflow' / 'use step' というディレクティブと Sleep / Hooks を用いて JS/TS/Python で durable application や AI エージェントを記述できる。本章では両者の中核機能、Functions / Fluid Compute との関係、料金構造、AI エージェント基盤としての位置付けまでを 1 章でカバーする。
Microfrontends — 複数フレームワーク横断の本番運用とゾーン分割を Vercel で実現する
Vercel Microfrontends の GA（2025 年 10 月 31 日）、ゾーン分割（Microfrontend Zones）・パス連結・共有レイアウト・複数フレームワーク（Next.js / SvelteKit / Vite / その他）の同居運用を解説する。1 日約 10 億リクエストを処理する規模、Cursor を含む 250 以上のチームでの採用事例、`microfrontends.json` の設定、ローカル開発プロキシ、Build & Deploy パイプラインや Preview Deployment との統合、CSP・認証・課金観点までをカバーする。
3 デプロイと Preview 環境｜ブランチごとに URL が生える
GitHub 連携で Next.js プロジェクトを Vercel へデプロイし、Production と Preview の関係を理解します。3種類の生成 URL の使い分け、Instant Rollback、Hobby プランでの制約までを扱います。
セキュリティ・コンプライアンス — SOC 2 / ISO 27001 / HIPAA / GDPR の取得状況とプラン別対応範囲
Vercel が取得しているコンプライアンス認証（SOC 2 Type II / ISO 27001 / ISO 27017・27018 / HIPAA BAA / GDPR・DPA / PCI DSS 関与範囲）と、プラン別の対応差を整理。Trust Center の使い方、Conformance Rule、OIDC Federation までカバーする。
WAF & Firewall — Managed Rulesets とカスタムルールでアプリ層を守る
Vercel WAF / Firewall の概念、Managed Ruleset、カスタムルールビルダー（OR/AND 条件）、Firewall REST API、Terraform プロバイダ、IP ブロック・SAMLStorm 等の Proactive Protection を体系化する。
Bot Management & BotID — AI Bot Filtering と invisible CAPTCHA で自動化トラフィックを切り分ける
Vercel の Bot Management（AI Bots Managed Ruleset 等）と BotID（invisible CAPTCHA / Deep Analysis）を解説。スクレイパー・LLM クローラ・購入 Bot を区別する仕組みと、ローカル開発時の挙動・誤検知対策まで体系化する。
Deployment Protection & RBAC — Preview の閉域化、SSO・Access Groups・Verified Commits
Vercel Deployment Protection（Vercel Authentication / Password Protection / Trusted IPs）と RBAC（ロール / Access Groups / リポジトリ制限 / 2FA / 検証付きコミット / OIDC Federation）を体系化。組織でのアクセス制御の限界と落とし穴を整理する。
DDoS & Network — プラットフォーム DDoS Mitigation・Static IPs・Secure Compute・TLS
Vercel が提供するプラットフォーム DDoS Mitigation（自動軽減、最大 40 倍高速化）、HTTP/2 Rapid Reset 対策、Static IPs、Trusted IPs、Vercel Secure Compute、TLS（DHE 廃止）を解説。ネットワーク層の保護と、内部接続の境界制御を整理する。
安全に使える領域マップ — Vercel の機能 × 安全度 × プラン依存マトリクス
本シリーズ第 3 部（30〜34 章）の内容を、機能 × 安全度 × プラン依存の三軸マトリクスとして統合する章。本番採用ラインの判断、プランダウングレード時に失う保護、Hobby で許容できる領域までを一望する。
Collaboration — Comments / Draft Mode / Edit Mode / Toolbar で Preview を共同レビューする
Vercel Collaboration スイートの全体像を整理する章。Preview Deployment 上で UI に直接コメントを差し込む Comments、Headless CMS の下書きを実画面で確認する Draft Mode、CMS フィールドへ直接ジャンプできる Edit Mode、これらすべての入口となる Vercel Toolbar の役割をまとめる。Slack / Linear / Jira への連携、Preview Deployment Protection との関係、デザイナー・PM・外部レビュアーを巻き込むレビュー導線、認証境界とプラン依存の制限までを 1 章で扱う。
Flags — Vercel が提供する自社 Feature Flags プロバイダーと Flags Explorer
Vercel Flags は Vercel 自社製のフィーチャーフラグ・プロバイダーであり、Flags SDK（@vercel/flags / flags パッケージ）と Flags Explorer による Toolbar 上の上書き、Boolean / String / Number に加え 2026-05-07 追加の JSON 値、ターゲティング・Segments・Progressive Rollouts、Edge Middleware / Server Components での評価、LaunchDarkly / Statsig / Hypertune / GrowthBook / Optimizely / Split / PostHog などの外部プロバイダー連携、Runtime Logs / Web Analytics による Observability までを単一ダッシュボードで束ねる。
Pricing & Spend Management — Active CPU 課金・利用枠・Spend Cap で Vercel コストを設計する
Vercel の Hobby / Pro / Enterprise の三プラン構造と、Fluid Compute による Active CPU 課金、Functions / Bandwidth / Image Optimization / Edge Requests / Storage（Blob / KV / Postgres）/ Queues / Workflows / Microfrontends といった機能別の従量課金軸を整理する。さらに Spend Management（Spend Cap・Usage Alerts・Webhook・プロジェクト一括停止）と Cost Observability、Marketplace 経由の外部プロバイダー課金まで、設計と運用の観点で 2026 年 5 月時点の単価とともにまとめる。
4 フォームを受け取る｜Route Handlers と Server Actions
問い合わせフォームの送信をサーバー側で受け取ります。Route Handlers と Server Actions の違いと使い分け、外部入力の検証、ボディサイズ上限、Vercel Functions のランタイムと実行時間の考え方を扱います。
v0 & AI SDK — UI 生成と AI アプリ実装の標準ライブラリ
Vercel の v0（自然言語からの UI / アプリ生成）と AI SDK（プロバイダ非依存の TypeScript LLM SDK）を解説。Basic Chatbot / Tool Use / Structured Data Extraction の実装パターンと、v0 と AI SDK の連携をカバーする。
AI Gateway — モデル横断ルーティング・フェイルオーバー・統一課金
Vercel AI Gateway は OpenAI / Anthropic / Google / xAI / Groq / Moonshot 等の LLM を単一エンドポイントから扱うルーティング基盤。プロバイダ間フェイルオーバー、Stripe Billing 統合、ZDR、OpenAI 互換エンドポイント、Image Generation までカバーする。
MCP & Sandbox — エージェント連携サーバーと Untrusted Code 実行基盤
Vercel MCP Servers（Devin / Raycast / Windsurf / Goose 等から接続される MCP）と Vercel Sandbox（untrusted code / AI 生成コードを安全に実行する短命 VM 環境）を解説。GA 版 Sandbox の sudo / RPM サポート、Persistent Sandboxes Beta、Snapshots による状態管理までカバーする。
AI Agents & Claim Deployments — エージェントが安全にデプロイ・実行する境界設計
Vercel Agent / Agent Resources / Claim Deployments を解説。AI エージェントが Vercel 上にデプロイした成果物を「人間が引き取る」モデル、Agent-friendly API、Flags の Agent 最適化、Slack Agents・Filesystem Agents の実装パターンを整理する。
5 データ層を用意する｜Vercel は DB を持たない
Vercel が自社で持つのは Vercel Blob と Global Config だけで、汎用データベースは Marketplace 経由で外部サービスをつなぎます。Neon を Native Integration で接続して問い合わせを保存し、添付ファイルは Blob の client upload で受け取ります。
Changelog ダイジェスト — 直近 12〜18 ヶ月の Vercel 主要変更
Vercel Changelog から「Compute（Fluid Compute・Build 高速化）」「DX（Flags・Queues・Streamdown）」「セキュリティ（Firewall・CVE 対応）」「AI 基盤（AI Gateway・Sandbox・Agent）」「課金・運用（Spend Management・Billing API）」のトピック軸で 12〜18 ヶ月の変化をダイジェスト。
Ship Week & ロードマップ — Vercel の半期発表で見る AI Cloud の方向性
Vercel Ship イベント（vercel.com/shipped）の主要発表を時系列で整理し、AI Accelerator や Infrastructure Pricing 改善などの戦略的アップデートを「AI Cloud 化」「Compute 進化」「セキュリティ」「Pricing 透明化」の 4 軸で読み解く。
6 管理画面を守る｜Deployment Protection の各方式と限界
Deployment Protection はデプロイ URL へのアクセスを絞る仕組みであり、アプリのユーザー認証ではありません。Vercel Authentication / Password Protection / Trusted IPs / Passport の違いと、Standard Protection と All Deployments という現行の scope、そして限界を扱います。
CLI・REST API 目次 — Vercel CLI / REST API / SDK の俯瞰と本シリーズへの参照
Vercel CLI（vercel コマンド）、REST API、Build Output API、SDK reference を俯瞰し、本シリーズの各機能章への対応関係を整理する。CLI Contract と REST API Errors の使い方、認証スコープの最小化までカバーする。
7 公開して運用する｜ドメイン・環境変数・Observability・費用
独自ドメインの接続と SSL、環境ごとの環境変数の管理、Observability と Runtime Logs での監視、そして Hobby と Pro の費用構造までを扱う最終章。Cloudflare 入門コース・Supabase 入門コースとの使い分けも整理します。
7-3 作った Web ページを Vercel で公開する
ローカルで作った HTML を Vercel で世界に公開する手順を解説。GitHub アカウント作成、Claude Code に任せる git 操作、Vercel 連携、公開 URL の確認、更新の反映、公開時の注意点まで初心者向けに説明します。
プロダクト改善ヒント — 本シリーズから抽出した実プロダクト適用候補
本シリーズ全章から「自分が運用するプロダクトに今すぐ適用できる改善ポイント」を抽出した実務ヒント集。Compute / DX / セキュリティ / コスト / AI 活用の 5 軸で、優先順位の高い順に整理する。
全一次ソース URL — 本シリーズで参照した公式ドキュメント一覧
Vercel 公式ドキュメント教材化シリーズで参照した全一次ソースを章ごとに一覧化。出典確認・最新版チェックの起点として利用する。