先に要点
- Vercel を初めて触るときに迷いやすいのは、機能そのものより `用語の定義` が原因のことが多いです。
- まず `Project` `Deployment` `Environment` の3つだけ押さえれば、ダッシュボードや公式ドキュメントが一気に読みやすくなります。
- その先は `Function`(Serverless / Edge)、`Domain`、`Environment Variables`、`プラン` の4つを順に押さえれば実務に入れます。
- 逆に `Edge Config` `Cron Jobs` `Webhooks` `KV Storage` などの応用機能は、必要になってから覚えれば十分です。
Vercelに登録して画面開いたけど、ProjectとDeploymentって何が違うの？ Edge Functionと普通のFunctionは別物？ Production と Preview って？
Vercelの公式ドキュメントは充実していますが、初心者がまず詰まるのは機能の使い方より 用語の意味 です。 言葉が分からないと、ダッシュボードのメニューも公式ドキュメントも読めません。
この記事では、2026年5月時点のVercel公式ドキュメントを確認しながら、初心者がまず押さえるべき基礎用語を 最初に覚える3つ 次に覚える4つ あとで覚えればよいもの の順で整理します。
Vercel そのものの全体像は Vercelとは？何ができる？Next.jsとの相性・向いている案件・注意点を解説、流行の背景は Vercelが流行っている理由は？AIの影響もあるのか実務目線で整理、他サービスとの違いは Vercelと他デプロイ基盤の違いは？ もあわせて読むとつながりやすいです。
この記事は2026年5月時点の情報をもとに書いています。Vercelは仕様や料金が変わりやすいので、本番採用前は公式ドキュメントの最新情報も合わせて確認してください。
まず覚える3つ：Project / Deployment / Environment
この3つは Vercel のすべての画面で出てきます。最初の理解さえ固めれば、その後の用語が一気に読みやすくなります。
1. Project(プロジェクト)
Vercel上での 1つのアプリケーション単位。
通常は 1つのGitリポジトリ = 1つのProject の関係で作ります。
- ドメイン設定はProject単位
- 環境変数はProject単位
- メンバー権限もProject単位
my-blog company-lp のように、サービス名やリポジトリ名がそのままプロジェクト名になることが多いです。
2. Deployment(デプロイメント)
Projectに対して 1回コードを反映した結果。
つまり git push やマージのたびに作られる、1つの公開された結果物 です。
- 各 Deployment には固有のURLがつく(
my-app-abc123.vercel.appのような形) - 過去の Deployment にも個別にアクセスできる
- 失敗した Deployment は履歴に残る
- 任意のDeploymentを
本番にロールバックできる
Project = アプリ本体、Deployment = そのアプリの履歴ある1版 と覚えると自然です。
3. Environment(環境)
Vercel には 3つの環境 があります。
| 環境 | いつ使う | 公開範囲 |
|---|---|---|
| Production | 本番ブランチ(通常 main)に push したとき | 一般公開 |
| Preview | Production以外のブランチや PR を push したとき | URL を知っている人 |
| Development | ローカルで vercel dev を実行したとき |
自分の PC のみ |
同じコードでも、どの環境で動かすかで使う環境変数や設定が変わる というのが、Vercelの設計の中心です。
ステージング環境との違いは ステージング環境は小規模サイトでも必要？ でも整理しています。
次に覚える4つ：Function / Domain / Environment Variables / プラン
Project / Deployment / Environment を押さえたら、次はこの4つで実務に入れます。
4. Function(関数)
Vercelで 動的な処理を動かす場所 です。
ボタンを押した、フォームを送信した、APIを叩いた、というときに動くサーバーサイドコードがこれにあたります。
Functionには大きく2種類あります。
| 種類 | 動く場所 | 起動の速さ | 主な用途 |
|---|---|---|---|
| Serverless Function (Node.js Runtime) | リージョン1か所 | 普通 | DB接続、外部API、複雑処理 |
| Edge Function (Edge Runtime) | 世界中のエッジ | 非常に速い | 認証チェック、リダイレクト、軽量API |
Edge は速いが制約が多い、Serverless は遅めだがNode.jsの機能をフルに使える、と覚えるとざっくり合っています。
Next.jsの Route Handlers や API Routes は、書き方によってこのどちらかとして動きます。
5. Domain(ドメイン)
Vercelには 自動で配布されるドメイン と 自分で持ち込むドメイン があります。
- 自動配布:
your-project.vercel.appのサブドメイン(無料、すぐ使える) - 独自ドメイン: 自分で持っているドメイン(
example.comなど)を Project に紐づけ
独自ドメインを使うときは、ドメインの管理画面(お名前.com、Cloudflareなど)で NSレコードまたはCNAMEレコード を変更します。 ドメイン移管そのものとは別の話なので、ドメイン移管で失敗しやすいポイントは？ も区別して読むと混乱しません。
6. Environment Variables(環境変数)
API キー、DB接続情報、外部サービストークンなど、コードに直書きしたくない値 を保管する場所です。
Vercel では環境変数を Production / Preview / Development の3環境別に設定できる のが大きな特徴。
のように分けて設定し、コード側はキー名(DATABASE_URL)で参照します。
Vercel CLIで vercel env pull するとローカルに .env 形式で取得できるので、PCを換えても再設定が楽です。
7. プラン(Hobby / Pro / Enterprise)
無料で個人開発を始めるなら Hobby、商用で使うなら Pro、企業の本格利用は Enterprise、というのが基本です。
| プラン | 月額 | 主な制限 | 主な対象 |
|---|---|---|---|
| Hobby | 無料 | 商用利用不可、メンバー1人、帯域100GB/月 | 個人開発、学習、ポートフォリオ |
| Pro | $20/メンバー | 商用利用OK、帯域1TB/月、Function実行枠拡大 | スタートアップ、小〜中規模商用 |
| Enterprise | 個別見積 | SLA、SSO、専用サポート | 大企業、規制業界 |
Hobbyで商用サイトを動かす のは規約違反になりやすいので、収益化や法人利用に進むなら Proに切り替えるのが安全です。
ダッシュボードでよく見るメニュー
ここまでの用語が分かると、ダッシュボードもかなり読みやすくなります。 最初に開くと出てくる主要メニューはこんな感じです。
| メニュー | 何を見られる |
|---|---|
| Overview | 直近のDeployment、サマリー |
| Deployments | 過去のDeployment一覧、ステータス、ログ |
| Analytics | アクセス数、流入元、ページごとの数値 |
| Speed Insights | Core Web Vitalsなどの体感速度指標 |
| Logs | Functionの実行ログ、エラー |
| Settings | Project全体の設定(Domain、Env Vars、Build、Memberなど) |
デプロイがうまくいかない ときは Deployments のログ、本番が遅い ときは Speed Insights、Functionがエラー のときは Logs、と見るところが分かれているのがポイントです。
ありがちな勘違い
1. Project = ドメインだと思ってしまう
Projectは アプリ本体 であって ドメイン ではありません。
1つのProjectに複数のDomainを紐づけることもできますし、Domainを持たない vercel.app 配信のままでもProjectとして成立します。
2. Deploymentは履歴ではなく 今見ているもの だと思ってしまう
今のmain に見えているDeploymentは、Production Deployment として現在割り当てられているもの です。
過去のDeploymentもURL付きで残っていて、Promote to Production で簡単にロールバックできます。
リリースとデプロイの違いは リリースとデプロイの違いは？コードを置くこととユーザーに出すことを整理 も合わせて読むと整理しやすいです。
3. Preview = ステージングと完全に同じ意味だと思ってしまう
Preview Deploymentは ブランチ単位で生える確認URL です。
従来のステージング環境のように 常に同じURL 常に同じデータ というわけではなく、ブランチごとに別物が立ちます。
ステージングの代わりとして使う場合は、Deployment Protection などで誰が見られるかを制御する必要があります。
4. Edge Function なら何でも速いと思ってしまう
Edge Functionは Edge Runtime で動きます。
これは Node.js のフルAPIではなく、Web標準API中心 の制限ありランタイムです。
DBドライバが動かない、特定のNode.jsモジュールが使えない、といった制約に当たることもあります。
速さと引き換えに 何でも書けるわけではない と覚えておく方が安全です。
5. Environment Variablesに本番キーをHobbyで入れて運用してしまう
Hobbyプランでも環境変数機能は使えますが、商用利用そのものが規約上NG というケースが多いです。
個人ブログや学習用なら問題ありませんが、本番の決済キーや業務DB接続情報をHobbyで運用する のはリスク込みで考える必要があります。
あとで覚えればよい用語
最初は知らなくても困らない、けれど中規模以降で出てくる用語をまとめておきます。
| 用語 | ざっくり何か |
|---|---|
| ISR | Incremental Static Regeneration。一定時間ごとに再生成する静的ページ |
| Edge Config | グローバルに配信される高速な設定値ストア |
| Cron Jobs | 定期実行(時間割で動かしたい処理) |
| Webhooks | 別サービスにイベント通知 |
| Vercel KV / Postgres / Blob | Vercelが提供するDB / KVS / ストレージ |
| Image Optimization | 画像の自動リサイズ、WebP変換 |
| Deployment Protection | Preview等の閲覧制限 |
| Speed Insights | Core Web Vitals 計測 |
| Web Analytics | プライバシー配慮のアクセス解析 |
| Team | 複数人での共同作業設定 |
これらは 必要になってから公式ドキュメントを引く で十分です。最初から全部覚えようとすると、本来やりたいアプリ開発が止まります。
学ぶ順番のおすすめ
最後に、初心者が 何から触っていけば良いか の順番を1つだけ示します。
- GitHubに何か簡単なリポジトリを用意する(Next.jsひな形でOK)
- VercelでImport Projectを実行 → 自動デプロイを体験
- 出来たURLにアクセス → これが Production Deployment
- ブランチを切ってpush → Preview URL が生えるのを確認
- Settings → Environment Variables を1つだけ追加してみる
- Settings → Domains で
vercel.app以外のサブドメインを試す - Logs と Analytics を1度だけ開いてみる
- 必要が出てから Cron Jobs / Edge Config / KV を読む
この順で触ると、Project Deployment Environment Function Domain Environment Variables の関係が手を動かしながら自然に体に入ります。
まとめ
Vercelの基礎は、機能の数 ではなく 用語の関係 で整理すると一気に分かりやすくなります。
最初に押さえるべきはこの順番です。
- Project / Deployment / Environment(全体の骨組み)
- Function(動的処理の置き場)
- Domain(公開の入口)
- Environment Variables(秘密情報の置き場)
- プラン(無料の範囲と商用の境目)
この5層が見えていれば、ダッシュボードのメニューも、公式ドキュメントの章立ても、AIに質問するときの言葉選びも、かなり扱いやすくなります。
ISRやEdge Config、Cron Jobsは便利ですが、必要が出てから読む でまったく問題ありません。
最初からすべての用語を完璧に覚えようとせず、今動かしているアプリの中で、どの言葉が出てきたか を起点に少しずつ広げていくのが、結果的に一番早い学び方になります。
Vercel基礎用語に関するよくある質問
Q. ProjectとDeploymentの違いを一言で言うと？
A. Project = アプリ本体、Deployment = そのアプリの1回ぶんの公開結果。Project は固定、Deployment は履歴 という関係です。
Q. Production と Preview の使い分けは？
A. Productionは 本番ブランチに紐づく1つの環境、Previewは ブランチやPRごとに毎回生える確認用環境。常時1つあるのが Production、頻繁に増減するのが Preview、と覚えると自然です。
Q. Edge Function と Serverless Function、最初はどっちを使うべき？
A. 迷ったら Serverless(Node.js)。Web標準API以外を使う場面が多く、DBドライバや既存ライブラリも問題なく動きます。Edgeは 軽量で世界中ユーザー向けの処理 に絞って使い始めると失敗しにくいです。
Q. Environment Variablesは何個まで設定できる？
A. プランに依存しますが、実務で問題になるレベルではありません。1Project数十〜数百は普通に扱えます。むしろ 何をどこに分けるか の整理の方が大事で、Production / Preview / Development を分けて入れるのが基本です。
Q. Hobbyプランで個人開発の収益化(AdSense、アフィリエイト)はOK？
A. グレーゾーンです。Vercel公式のFair Use Policyでは Hobbyは個人非商用利用 とされており、収益が継続的に発生するならProプランが安全です。判断に迷うなら公式ポリシーで最新版を確認します。
Q. 独自ドメインの設定はどのくらい時間がかかる？
A. DNSの設定変更後、数分〜数時間で反映されます。Cloudflare DNS のように反映が速い管理画面なら数分、レジストラ標準のDNSなら数時間〜半日程度。詳しい仕組みは DNS浸透とは？反映が遅い理由・TTL・切り替え時の確認ポイントを解説 も参考になります。
Q. デプロイが失敗したときはどこを見る？
A. Deployments → 失敗したデプロイをクリック → Build Logs。エラーメッセージはほぼここに出ています。どのコマンドで失敗したか どの行で失敗したか をログから読み取り、ローカル環境で再現してから直すのが安全です。
参考リンク
- Vercel: Documentation
- Vercel: Projects
- Vercel: Deployments
- Vercel: Environments
- Vercel: Functions
- Vercel: Environment Variables
- Vercel: Pricing