Zenn
👛

極力無料主義！ Netlify・Vercel・GitHub Pages 比較（使用量上限・制限超過時や商用利用可否などの特徴まとめ）

に公開
Netlify
Vercel
GitHub Pages
idea

はじめに

本記事は以下記事をよりシンプルにまとめた改良版記事となります。

https://qiita.com/benjuwan/items/4a2f175b648791412203

2年ほど前に公開して随時更新していたのですが、情報の整合性を考慮して過去の仕様内容や情報を残していたり、増築に次ぐ増築で情報過多になってきていたりする気がしたので、今回リライトすることにしました。

リライトにあたって大半はAI（Claude Sonnet4）に作業してもらいました。
今回初めて記事執筆にAIを採り入れた次第です。

しかし全てをAI任せというわけではなく、個人開発や実務を通じて得た個人的な知見は筆者自身が書いており、これまでの使用経験と比較に加えて（個人的な）知見を盛り込んだ内容のため改良版記事としています。

個人開発や小規模プロジェクトで「無料で、それなりの規模感・機能で、簡単で、広告なし」というワガママな要望を満たすホスティングサービスを探している方も多いのではないでしょうか。

本記事では、色々な技術記事プラットフォームでよく見る海外ホスティングサービス3つ（Netlify、Vercel、GitHub Pages）を中心に、商用利用の可否や使用制限超過時の挙動について詳しく解説します。

※記事後半で日本国内のものも軽く触れていきます。

主要3サービス比較表

まず、3つのサービスの基本情報を比較表で確認しましょう。

項目 Netlify Vercel GitHub Pages
商用利用 ✅ 可能 ❌ 不可（Hobbyプラン） ❌ 不可
月間帯域幅 100GB 100GB 無制限※
ビルド時間 300分 6000分 2000分/月
サイト数制限 無制限 無制限 1サイト/アカウント
SSL対応 ✅ 自動 ✅ 自動 ✅ 自動
独自ドメイン ✅ 対応 ✅ 対応 ✅ 対応
フォーム機能 ✅ あり（Netlify Forms） ✅ あり（Formspree連携） ❌ なし
サーバーサイド ❌ 静的サイトのみ ✅ 対応（PHP/Ruby等） ❌ 静的サイトのみ
制限超過時 サービス一時停止 Hobby:一時停止
Pro:自動課金		 使用不可

※GitHub Pagesの帯域幅は月100GBの推奨値

結論：極力無料主義で臨む用途別おすすめサービス

🏆 商用利用なら「Netlify」一択

  • 無料プランでも商用利用が可能
  • フォーム機能や豊富なプラグイン
  • 制限超過時も一時停止で安心

🚀 技術検証・個人開発なら「Vercel」

  • サーバーサイド言語対応
  • 豊富なテンプレートとドキュメント
  • 無料プランは非商用のみ

📚 シンプルな静的サイトなら「GitHub Pages」

  • GitHubアカウントがあれば即利用可能
  • 非商用の個人サイトやポートフォリオに最適
  • 1アカウント1サイトの制限

各サービス詳細解説

Netlify

基本情報

  • 商用利用: ✅ 可能
  • 主な用途: 静的サイト、JAMstackアプリケーション
  • 特徴: 豊富な機能とプラグイン、CDN、フォーム機能

制限超過時の挙動

以前のNetlifyでは、制限超過した際に自動アップグレードされて従量課金が発生するというものでしたが、現在では制限超過時の挙動が以前より安全になりました：

  1. 事前通知: 使用量が50%、75%、90%、100%に達すると通知メール
  2. ビルド制限: 新しいビルドが無効化されるが、サイトは閲覧可能
  3. その他制限: サイトが一時停止、有料プランへのアップグレードが必要

以前だと以下のようなケースが起こりえました。
https://microayatron.com/netlify-billing

注意点

  • 静的サイト専用（PHP、Rubyなどのサーバーサイド言語は非対応）
  • WordPress等の動的サイトはホスティング不可

フォーム機能：Netlify Forms

https://docs.netlify.com/forms/setup/

<!-- HTMLに追加するだけで使用可能 -->
<form name="contact" method="POST" data-netlify="true">
  <input type="text" name="name" />
  <input type="email" name="email" />
  <textarea name="message"></textarea>
  <button type="submit">送信</button>
</form>
  • メリット: 設定が簡単、スパム対策内蔵
  • 制限: 月100件まで（無料プラン）

Netlify：個人的な知見や所感

次の Vercel に比べると機能的な見劣り感はありますが UIは分かりやすいですし、シンプルに使っていきたい人は Netlify が向いていると思います。
（とはいえ、ちょっと前にUIの変更があって個人的には前の方が良かったのですが...）

Netlify Formsでの実装以外で、ホスティングサービス特有のエラーや実装詰まりに遭遇したことがないので使いやすい印象です。

Vercel や GitHub Pages 同様、GitHubリポジトリとの連携やCI/CDの実装もカバーしてくれていますが、個人的に使ってきた所感としては直接つないでビルドすると当月のbuild minutesが結構増えていく印象なのでビルドしたものをホスティングする使い方をすればより節約できると思います（CI/CDとは…って話ですが）

Vercel

基本情報

  • 商用利用: ❌ 不可（Hobbyプラン）、✅ 可能（Proプラン以上）
  • 主な用途: Next.js、React、静的サイト、サーバーレス関数
  • 特徴: サーバーサイド対応、画像最適化、Edge Functions

制限超過時の挙動

  • Hobbyプラン: 一時停止
  • Proプラン: 従量課金

使用量の特徴

NetlifyとVercelでは使用量の計測方式が異なります：

  • Netlify: 月初～月末の期間リセット方式
  • Vercel: 使用日から徐々に減少する方式

注意点

  • 無料のHobbyプランでは商用利用不可
  • 画像最適化は月1000枚まで（※無料プランの場合）
    • 2025年2月以降2種類の画像最適化プランが提供されており、現在では新しいものは全て新プラン仕様になるようです

フォーム機能：Vercel + Formspree

https://vercel.com/guides/deploying-react-forms-using-formspree-with-vercel

const handleSubmit = async (e) => {
  e.preventDefault();
  await fetch('https://formspree.io/f/your-form-id', {
    method: 'POST',
    body: new FormData(e.target)
  });
};
  • メリット: 柔軟な実装、多言語対応
  • 制限: 月50件まで（開発・テスト用途）

Vercel：個人的な知見や所感

Vercel は筆者が一番使っているホスティングサービスになります。

画像の自動最適化をはじめ、CI/CDはもちろん、SSR/ISR/PPRといったレンダリングモデル、Neon というデータベースサービスなど各種サービスとの連携、v0などAIでのUI生成ツールなど豊富な機能を提供していて、しかも速いという素晴らしいホスティングサービスです。

しかし反面、多機能すぎて学習コストが高かったりして、正直筆者は全然使いこなせている気がしません。

あと、デプロイした時のリージョンには注意したほうが良いと思います。
デフォルトではワシントンDCになっていて、これを東京や大阪にしないとタイムアウトエラーが出たり、うまくサイトが表示されなかったりします。

Vercel ではエラーログをダッシュボードから確認できるのですが、上記のようなものはエラーログだけでは（筆者の理解力・スキル不足も相まって）分かりづらく少し解決に苦労しました。

https://zenn.dev/benjuwan/articles/7635f7f53cbfb3

上記は悪い点ですが、GitHubリポジトリを直接つないでビルドしても、Netlify と比較してそこまで使用量が増えない点も Vercel の魅力だと思います。
「こんなに使ってこんだけなの？」という印象で、先に述べた Neon など各種サービスとの連携も Vercel のダッシュボードで一元管理・確認できますし、使い勝手はすごく良いです。

GitHub Pages

基本情報

  • 商用利用: ❌ 不可
  • 主な用途: 静的サイト、ドキュメントサイト、ポートフォリオ
  • 特徴: GitHubとの連携、Jekyll対応

制限と特徴

  • 1アカウントにつき1つのユーザーサイトのみ
  • 寄付ボタンやクラウドファンディングリンクは許可
  • リポジトリサイズ: 1GB推奨
  • 月間帯域幅: 100GB推奨

制限超過時の挙動

GitHub Actionsの制限については、デフォルトで0ドルの使用制限が設定されており、超過時は自動停止されます。

制限超過の防止策として、各サービスともダッシュボードで使用量を確認できますので定期的な使用量チェックを習慣化しておくと良いと思います。

そして必要に応じて、有料プランへのアップグレードや一時的なビルド停止、サイト非公開など対応してみてください

その他のホスティングサービス

Firebase Hosting

※筆者未使用です。

Googleが提供するアプリ開発プラットフォームの一部として提供されるホスティングサービス。

項目 内容
商用利用 ✅ OK（Blazeプラン）
無料枠 ✅ Sparkプラン（使用制限あり）
超過時 ❌ 使用不可になる（従量課金で復旧）
特徴 Cloud Functionsは有料プラン必須
備考 firebase.jsonでインスタンス制限推奨

重要な注意事項

// firebase.json でインスタンス数上限を設定推奨
{
  "functions": {
    "runtime": "nodejs18",
    "memory": "256MB",
    "maxInstances": 10
  }
}

国内サービス

国内の主要サービスは多くが有料ですが、一部で無料プランを提供：

  • さくらのレンタルサーバー: 無料お試し期間のみ
  • エックスサーバー: 広告表示あり、商用制限あり
  • ロリポップ: 無料プランなし

まとめ

  • 迷ったらNetlify: 商用利用可能で機能豊富、制限超過時も安全
  • 技術的な挑戦: Vercelで最新のWeb技術を体験
  • シンプルさ重視: GitHub Pagesで手軽にスタート

蛇足ながら、個人的にはCloudflare Pagesがすごく気になっているので、今度機会があればぜひ試してみようと思います。

さいごに

今回のリライトでシンプルにまとまったような気がします。
今後も情報更新は主に元記事で行い、重要な変更（例： Netlify での制限超過時の仕様変更など）がある場合にのみこちらにも反映したいと思います。

AIに関しては、基本的にコーディングとか壁打ちとか、アイデア出しとかに日々使っていたのですが、今後は以下のガイドラインに注意しながら折見て記事執筆にも活用していきたいと思います。

https://info.zenn.dev/2025-06-05-update-terms

参考情報

https://microayatron.com/netlify-billing

https://docs.netlify.com/forms/setup/

https://vercel.com/docs/image-optimization/limits-and-pricing

https://vercel.com/guides/deploying-react-forms-using-formspree-with-vercel

Discussion