現代的なウェブスタックの保守費用：実例に基づいた内訳

100以上のプロダクション サイトを運営してきました。Next.js、Astro、ヘッドレスCMSセットアップなど、最新のスタックで構築されたものばかりです。そして、クライアントから最も多く受ける質問は、デザインや機能についてではありません。それは「ローンチ後、毎月どのくらいの費用がかかるのか？」というものです。

正当な質問です。そして正直なところ、ほとんどのエージェンシーのウェブサイトで見つかる答えはひどいものです。案件をまとめるために低く見積もるか、あまりに広い幅で答えるか（「月額$50～$5,000」──ありがとう、非常に役に立つ）のどちらかです。では、2025年から2026年にかけて実際に関わったプロジェクトの実例を使って、本当に内訳を示しましょう。既に必要なものが分かっていて先に進みたい場合は、RFPを送信してください。手ぶりではなく、実数でお返しします。

目次

• 現代的なスタックが保守費用をどう変えるか
• コストの主な分類
• ホスティングとインフラストラクチャのコスト
• CMSとサードパーティサービスのコスト
• セキュリティ、アップデート、依存関係の管理
• パフォーマンス監視と最適化
• コンテンツ更新と機能開発
• 完全なコスト比較：Next.js vs Astro vs WordPress
• 月々の保守費用を削減する方法
• FAQ

現代的なスタックが保守費用をどう変えるか

WordPress の世界から来た人なら、ある種の保守リズムに慣れているはずです：プラグインを更新し、コアを更新し、何も壊れないことを祈り、壊れたものを修正し、このいくつかを処理してくれるマネージドホスティングに対して支払う。これは疲れるテンポです。

Next.js と Astro のような現代的なスタックはこれを反転させます。パッチを当てるべき独自のサーバーがありません。1つの放棄されたパッケージがサイトを破壊する可能性があるプラグイン エコシステムもありません。毎四半期に最適化すべきデータベースもありません。

しかし、人々が見逃すのはこの部分です：それらは独自の保守プロファイルを備えています。1つの問題セットを別のセットに交換しただけです。package.json の依存関係の更新には注意が必要です。ヘッドレス CMS にはまだ購読料金があります。サーバーレス関数にはコールドスタートがあり、監視が必要です。エッジネットワーク設定は調整が必要です。

良いニュースはどうでしょうか？ほとんどのサイトでは、総所有コストが低くなります。多くの場合、大幅に低くなります。しかし「低い」は「ゼロ」を意味しません。素敵な Astro サイトを起動してから、6ヶ月後に何かに注意を払う必要があることに驚いているチームを見すぎました。

コストの主な分類

特定の数字に入る前に、実際にお金がかかるものを整理しましょう。スタックに関係なく、すべてのウェブサイト保守予算は以下のカテゴリに分類されます：

1. ホスティングとインフラストラクチャ ──コードが実行される場所
2. CMSとサードパーティサービス ──コンテンツ管理、フォーム、検索、分析
3. セキュリティと依存関係のアップデート ──パッチを適用して安全に保つこと
4. パフォーマンス監視 ──高速性を保つことを確認すること
5. コンテンツ更新と機能開発 ──継続的な開発時間
6. ドメインと SSL ──退屈だけどまだお金がかかるもの

それぞれを詳しく見てみましょう。

ホスティングとインフラストラクチャのコスト

ここが最新スタックが輝く場所です。静的な Astro サイトまたはエッジプラットフォームに展開された Next.js アプリは、従来のホスティングの一部の費用で済みます。

Astro サイト（主に静的）

Astro サイトが純粋に静的な場合──多くはそうです、それはポイントです──ホスティング費用は馬鹿げるほど低くすることができます。

• Cloudflare Pages：無制限のサイト、無制限の帯域幅は無料です。本当にそうです。2026 年に Cloudflare Pages で静的な Astro サイトをホストする場合、月額 $0 を支払います。月額 $20 の有料プランは web analytics とより多くのビルド分を追加しますが、ほとんどのサイトには必要ありません。
• Netlify：無料層は月額 100GB の帯域幅と 300 のビルド分をカバーします。Pro プランはメンバーあたり月額 $19 です。月額 50,000～100,000 ページビューを取得している典型的なビジネス サイトでは、無料層で十分です。
• Vercel：趣味用の使用は無料です。Pro プランはメンバーあたり月額 $20 で、1TB の帯域幅が付いてきます。

Astro のサーバーアイランドまたはハイブリッドモードを使用して SSR（サーバーサイドレンダリング）を使用する Astro サイトの場合、サーバーレス関数をサポートするプラットフォームが必要です。Cloudflare Workers、Netlify Functions、または Vercel Serverless はすべて機能し、コストは使用量に応じて拡大します。ほとんどのビジネス サイトでは、月額 $0～25 を考えています。

Next.js サイト

Next.js は別の動物です。generateStaticParams で静的ページを生成している場合でも、ほとんどの Next.js サイトはいくつかのダイナミック機能──API ルート、サーバーコンポーネント、ISR（増分静的再生成）、ミドルウェアを使用します。

• Vercel（明らかな選択肢）：チームメンバーあたり月額 $20 の Pro プラン。これはほとんどの Next.js アプリが着地する場所です。ただし、サーバーレス関数の実行に注意してください──Pro プランには月額 100 万の関数呼び出しが含まれています。トラフィックの多いサイトまたは積極的な ISR を行っているサイトはこれを超えることができます。中程度のトラフィック電子商取引サイトのクライアントが Vercel で月額 $100～300 を超えるのを見ました。
• AWS Amplify：従量課金制のモデル。標準的なビジネス サイトでは通常月額 $5～50。Vercel より複雑に設定できますが、スケールで安い場合があります。
• Coolify / Self-hosted：ops のちょっとしたコツを持っていれば、$20～50/月の VPS で Next.js を実行できます。ほとんどのクライアントにはこれをお勧めしません──ホスティング費用をops時間に交換しており、ops時間は無料ではありません。

2026年の Vercel 価格設定に関する注記

Vercel は 2025 年後半に価格設定構造を更新し、Enterprise 層は現在 $2,500/月から始まります。5 人以上の開発者がいるチームにいるか、SAML SSO、支出保護、または専用サポートなどの高度な機能が必要な場合は、その層に着地します。ほとんどの小～中規模企業では、月額 $20/座席の Pro プランで十分です。

CMSとサードパーティサービスのコスト

ヘッドレス CMS は通常、ホスティング後の最大の項目です。2026 年の主要なプレーヤーが請求するもの：

CMS	無料層	Pro/Team 層	Enterprise
Sanity	3 ユーザー、月額 100K API リクエスト	$15/ユーザー/月（Growth）	カスタム価格設定
Contentful	1 スペース、5 ユーザー	$300/月（Team）	カスタム価格設定
Storyblok	1 ユーザー、1 スペース	€99/月（Business）	カスタム価格設定
Payload CMS	Self-hosted（無料）	Payload Cloud 月額 $35～	カスタム価格設定
WordPress（ヘッドレス）	Self-hosted	Managed：月額 $25～50	$200+/月
Keystatic	無料（ファイルベース）	無料	N/A
Decap CMS	無料（Git ベース）	無料	N/A

Social Animal のプロジェクトでは、多くの場合 ヘッドレス CMS セットアップ用に Sanity をお勧めします。なぜなら無料層は本当に寛大で、開発者の経験は優れているからです。シンプルなサイトの場合、Keystatic のようなファイルベースのオプションで CMS コストを完全に排除できます。

CMS を超えて、追加される他のサービス：

• 分析：Plausible（$9/月）、Fathom（$14/月）、または Vercel Analytics（Pro に含まれる）
• フォーム処理：Formspree（$10/月）、またはサーバーレス関数を構築するだけ
• 検索：Algolia（月額 10K リクエストまで無料、その後 $1/1K リクエスト）、または Pagefind（無料、クライアント側で実行）
• メール/ニュースレター：Resend（$20/月で 50K メール）、Mailchimp（500 連絡先までは無料）
• 画像 CDN：Cloudinary（無料層：月額 25K 変換）、または CMS の組み込み画像パイプラインを使用するだけ

小～中規模ビジネス サイトのサードパーティ サービスの現実的な月額合計：月額 $30～150。

セキュリティ、アップデート、依存関係の管理

ここに保守「労働」が生きています。そして、それはより硬い数字を付けるのが難しいため、ウェブサイト保守に関するほとんどの記事が便利に無視する費用です。

依存関係の更新

これに早期段階でスケールで達しました：クライアントの Next.js プロジェクトは 137 の直接依存関係を持っており、3 ヶ月の放置後、npm audit は 14 の脆弱性について叫んでいました、そのうち 3 つは重大なものです。これは典型的なシナリオです。Next.js プロジェクトは 50～150 の直接依存関係を持ちます。Astro プロジェクトは通常はより少ないです──おそらく 20～60。それぞれはアップデートを取得し、それらのアップデートのいくつかはあなたが本当に適用する必要があるセキュリティパッチです。

私たちの保守アプローチ：

# クライアント プロジェクトでこれを週単位で実行します
npm audit
npx npm-check-updates -u --target minor
npm install
npm run build
npm run test

重大なセキュリティパッチについては、48 時間以内に適用します。マイナーとメジャーバージョンのバンプについては、月単位でバッチ処理し、徹底的にテストします。

時間投資：典型的なサイトで月額 2～4 時間。エージェンシーレート（$150～200/時間）では、月額 $300～800です。

自分でこれを行っていて、それが何をしているか知っていれば、これを 1～2 時間に削減できます。Renovate Bot や Dependabot などのツールは PR の作成を自動化できますが、誰かがまだレビューとマージする必要があります。

SSL とドメイン更新

SSL は 2026 年に重要なすべての場所で無料です（Let's Encrypt、Cloudflare、Vercel、Netlify はすべてこれを自動的に処理します）。ドメイン更新は TLD に応じて年額 $10～50 です。心配する価値がありませんが、自動更新の設定を忘れないでください。

セキュリティ ヘッダーと設定

これは一度設定したら主に忘れてしまうタスクです。コンテンツセキュリティポリシーヘッダー、CORS 設定、API ルートのレート制限。通常、ビルドフェーズ中にこれを設定し、四半期ごとに再検討します。

// next.config.ts - セキュリティ ヘッダー例
const securityHeaders = [
  {
    key: 'X-Frame-Options',
    value: 'DENY',
  },
  {
    key: 'X-Content-Type-Options',
    value: 'nosniff',
  },
  {
    key: 'Referrer-Policy',
    value: 'strict-origin-when-cross-origin',
  },
  {
    key: 'Content-Security-Policy',
    value: "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline';",
  },
];

時間投資：四半期ごとに 1～2 時間。

パフォーマンス監視と最適化

素速いサイトを起動することは 1 つのことです。高速を保つこと？それが本当の仕事です。コンテンツ編集者は最適化されていない画像を追加します。マーケティングは新しいサードパーティスクリプトをリクエストします。その 95 の Lighthouse スコアはゆっくりと 72 に下がります。

監視コスト

• Vercel Speed Insights：Pro プランに含まれる（追加 $0）
• Calibre：ウェブパフォーマンス監視のために月額 $45 から
• SpeedCurve：月額 $11.90 から
• Google Search Console + PageSpeed Insights：無料、そして正直なところほとんどのサイトに十分です

最適化作業の内容

四半期ごとに、クライアント サイトでパフォーマンス監査を実行します：

1. Search Console で Core Web Vitals を確認
2. キーページに対して Lighthouse CI を実行
3. next/bundle-analyzer または Astro の組み込みビルド出力を使用してバンドルサイズを確認
4. レイアウトシフト回帰を確認
5. 画像の最適化を確認（新しい画像は正しい形式を使用していますか？）

時間投資：四半期ごとに 3～6 時間、または月平均で 1～2 時間です。

コンテンツ更新と機能開発

これはワイルドカードです。いくつかのクライアントはサイトを起動し、ほとんど触れません。他の人は週単位の更新、新しいランディングページ、カスタム コンポーネントが必要なブログ投稿、および機能追加が必要です。

ヘッドレス CMS セットアップの美点は、コンテンツ更新は通常セルフサービスです。マーケティング チームは Sanity または Storyblok にログインし、変更を加え、サイトは自動的に再構築されます。開発者は 90％のコンテンツ作業に必要ありません。

しかし、その他の 10％があります：

• 「このページに価格計算機を追加できますか？」
• 「Q3 キャンペーン用の新しいランディング ページテンプレートが必要です」
• 「ブログには目次コンポーネントが必要です」
• 「HubSpot と統合できますか？」

これは本当の開発作業であり、それは大きく異なります。通常、クライアントに月額 5～10 時間の開発時間を予算化することをお勧めします。当社のレートでは、銀行を壊すことなく有意義な改善を加えるのに十分な滑走路が得られます。今、プロジェクトのスコープを定めており、継続的なコストが何になるかについて明確にしたい場合は、RFP を送信してください。ビルド見積もりと共に保守推定値を含めます。

完全なコスト比較：Next.js vs Astro vs WordPress

それをすべてまとめましょう。典型的な小～中規模ビジネス サイトがスタックごとに月額いくら維持するかは以下です：

コスト カテゴリ	Next.js（Vercel）	Astro（Cloudflare）	WordPress（Managed）
ホスティング	$20～100/月	$0～20/月	$30～100/月
CMS	$0～99/月（Sanity/Payload）	$0～99/月（Sanity/Keystatic）	$0（組み込み）
ドメイン + SSL	~$3/月	~$3/月	~$3/月
サードパーティ サービス	$30～100/月	$20～80/月	$50～150/月（プラグイン）
セキュリティ/アップデート（労働）	$300～600/月	$200～400/月	$200～500/月
パフォーマンス監視	$0～50/月	$0～50/月	$0～50/月
コンテンツ更新（労働）	$750～1,500/月	$750～1,500/月	$500～1,000/月
合計（労働を含む）	$1,100～2,450/月	$975～2,150/月	$785～1,800/月
合計（DIY 労働）	$53～350/月	$23～250/月	$83～300/月

いくつかの事柄が飛び出します：

1. 労働はどのスタックでも最大のコストです。ホスティングとツールは比較的に騒音です。
2. Astro はインフラストラクチャ費用で勝ちます。静的サイトは基本的にはホスト化するのに無料です。
3. WordPress は紙で安く見えます。コンテンツ更新を自分で処理する場合、ただしその比較は誤解を招きます──WordPress 保守には、現代的なスタックが単に持たないプラグイン アップデートとセキュリティ パッチの継続的なストリームが含まれます。
4. DIY 行は、独自の開発を処理するチーム向けです。インハウス開発者がいる場合、ハード コストは著しく低くなります。

月々の保守費用を削減する方法

これらのスタックでサイトを保持してから数年後、実際のコストを削減するものは以下です：

コンテンツが豊富なサイトには Astro を選択

サイトが主にコンテンツ──マーケティング ページ、ブログ、ドキュメント──である場合、Astro がより良い選択です。デフォルトでは、より少ない JavaScript を出荷します。つまり、より少ないもの、より速いビルド、および安いホスティングが壊れます。Astro サイトをたくさん構築してきました。月額実質 $0 でホストする方法があります。

必要な場合は Next.js を使用

認証、ダイナミック ダッシュボード、複雑なデータ取得、または重い対話性が必要な場合、Next.js が正しい呼び出しです。ただし、スケール時のインフラストラクチャ コストについて目を開いて行きます。

寛大な無料層を持つ CMS を選択

Sanity の無料層は、ほとんどの小規模ビジネス サイトを無理なく処理します。Payload CMS はオープンソースで自己ホスト可能です。Keystatic はファイルベースのコンテンツに対して完全に無料です。Sanity が月額 $0 で同じ仕事をしている 90％のユースケースで Contentful のために月額 $300 を支払わないでください。

自動化できることを自動化

依存関係更新用の Renovate Bot を設定します。すべての PR で自動テスト用の GitHub Actions を使用します。本番環境に当たる前にパフォーマンス回帰を検出するために Lighthouse CI を設定します。

# .github/workflows/lighthouse.yml
name: Lighthouse CI
on: pull_request
jobs:
  lighthouse:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 22
      - run: npm ci && npm run build
      - uses: treosh/lighthouse-ci-action@v12
        with:
          configPath: ./lighthouserc.json
          uploadArtifacts: true

保守を月額定額料金にバンドル

これは自己奉仕的なアドバイスです、確かに、しかし、それはまた本当に安いです。アドホックな保守作業は、コンテキスト切り替えのオーバーヘッドのため、月額定額料金の作業よりも時間単位でコストがかかります。あなたのコードベースを知っているエージェンシーとの月額定額料金──私たちのような──は通常、断片的なフリーランサーの作業と比べて 15～25％節約します。

ビルド中のドキュメントへの投資

最も費用対効果の高い保守投資はビルドの初期段階で起こります。すべての時間、優れたドキュメントの執筆は 3～5 時間の保守時間を節約します。次のドキュメントを持つすべてのプロジェクトをドキュメントします：

• アーキテクチャ決定記録
• 編集者向けの CMS コンテンツ モデル ガイド
• デプロイメントと環境セットアップ指示
• サードパーティ サービスの資格情報と更新日

FAQ

Next.js ウェブサイトを月額いくら維持するのですか？

2026 年の Next.js サイトのハード インフラストラクチャ コストは通常月額 $50～350 を実行します。Vercel または AWS のホスティング、ヘッドレス CMS サブスクリプション、分析やフォーム処理などのサードパーティ サービスをカバーします。依存関係の更新、セキュリティパッチ、および継続的な機能開発のための専門的な保守労働を考慮すると、合計は月額 $1,100～2,450 の範囲です。インハウス開発者がいるチームは、労働費をゼロに削減でき、インフラストラクチャ料金を支払うだけです。

Astro は Next.js より保守が安いですか？

はい、一般的に。Astro サイトはデフォルトで静的出力を生成するため、インフラストラクチャ コストが低くなります。これは Cloudflare Pages または Netlify 上で無料でホストできます。また、依存関係も少ないため、アップデートとセキュリティパッチの保守オーバーヘッドが少ないことを意味します。差は、コンテンツに焦点を合わせたサイトで最も顕著です──動的なアプリケーションの場合、コストに関係なく Next.js が唯一の実行可能オプションかもしれません。

2026年に最新のJavaScriptウェブサイトをホストする最も安い方法は何ですか？

Cloudflare Pages が静的サイトの明確な勝者です──無制限の帯域幅を持つ無料で、サイト単位の制限はありません。サーバーサイドレンダリングまたは API ルートが必要なサイトの場合、Cloudflare Workers は 1 日 100,000 リクエストの寛大な無料層を提供しています。Vercel と Netlify も無料層を持っていますが、成長するサイトが最終的に超過する帯域幅とビルド分の制限が付いています。

Next.js と Astro サイトはどの程度の頻度でアップデートが必要ですか？

依存関係の更新を週単位でチェックし、月単位でバッチで適用することをお勧めします。重大なセキュリティパッチは 48 時間以内に適用する必要があります。Next.js と Astro の両方はマイナーバージョンを大約月単位で、メジャーバージョンを年単位で公開します。WordPress とは異なり、プラグイン アップデートの継続的なストリームに直面することはありません──しかし、コア フレームワークと依存関係を最新に保つ必要があります。

ヘッドレス CMS プラットフォームには隠れたコストがありますか？

いくつかはそうです。API リクエスト制限を監視します（Contentful と Sanity の両方は低い層にこれを上限します）、アセット ストレージ制限、および大規模なチームに対して急速に膨張するユーザーあたりの価格設定。Sanity の無料層は月額 100K API リクエストで寛大ですが、キャッシングが無効なまま高トラフィックなサイトはそれを超えることができます。Payload CMS はそれを完全に回避します。これは自己ホスト型だからです──サーバーの費用を支払うだけです。

ウェブサイト保守は最新のスタックの WordPress より安いですか？

どのように測定するかによります。インフラストラクチャ コストは同等またはそれ以下です。本当の節約は、リスク軽減（PHP の脆弱性がなく、プラグインの競合がない）とコンテンツ更新がヘッドレス CMS インターフェイス経由でセルフサービスであるという事実から来ます。ただし、最新スタックの何かが壊れた場合、React と最新の JavaScript を知っている開発者が必要です。これらの開発者は WordPress 開発者よりも時間単位でより多くを請求する傾向があります。

ウェブサイト保守月額定額料金に何が含まれるべきですか？

最新スタック サイトの良い保守月額定額料金は、以下を含む必要があります：週単位の依存関係監視に月単位の更新サイクル、アラート付きのアップタイム監視、四半期ごとのパフォーマンス監査、セキュリティ ヘッダー レビュー、SSL とドメイン更新管理、コンテンツ編集者向けの CMS サポート、および継続的な機能開発とバグ修正のための開発時間のバンク。ほとんどのエージェンシーはサイトの複雑さに応じて月額 $1,000～2,500 の範囲でこれを提供しています。あなたのサイトのコストが正確に何になるか知りたいですか？48 時間以内に提案を取得してください。

Next.js または Astro サイトを自分で保守できますか？

絶対に、JavaScript とコマンド ラインに慣れている場合。ハード インフラストラクチャ コストだけでは、ほとんどのサイトでは月額 $25～250 です。定期的に npm audit を実行し、Node.js バージョンを最新に保ち、ビルド パイプラインを監視し、フレームワーク アップデートに対応する必要があります。Renovate Bot と Lighthouse CI などの自動ツールを設定して、手動作業を削減します。ほとんどの人が問題に入るのは、6～12 ヶ月間保守を無視してから、大量のアップグレード努力に直面しています。