JavaScriptでサイト改修はいくらかかるか:計算機、フィルター、マイページ
JavaScript はブラウザ上でサイトを動かす言語です。ページを再読み込みせずカートが変わり、料金が計算され、カタログが絞り込まれ、マイページが開きます。オーナーは「競合と同じ計算機」や「12項目のフィルター」を頼み、見積もりが $300 から $40 000 まで幅広く、妥当か判断しづらいことがあります。以下は 2026 年に最も多い3種類の改修の現実的な予算幅、作業内容、プラグインで足りる場合、フロントエンド開発者が必要な場合、納品後の隠れコストです。
- シンプルな計算機(3-7項目、クライアント側の式)- $300-1 500、2-7日
- 複雑な計算機(PDF、メール、CRM、複数ステップ)- $2 000-8 000、2-5週間
- カタログフィルター(再読み込みなし、最大500 SKU)- $800-3 000、1-2週間
- 大規模フィルター(1万+商品、AJAX、SEO)- $3 000-12 000、3-6週間
- マイページ(ログイン、CMSで3-5セクション)- $3 000-15 000、3-8週間
- SPAマイページ(React/Vue、API、ロール)- $15 000-60 000+、2-5ヶ月
- 価格の主因 - 「JavaScriptそのもの」ではなく、バックエンド・データ・デザインの組み合わせ
オーナーにとっての「JavaScript改修」とは
JavaScript改修はプラグインカタログからウィジェットを入れることではなく、訪問者のブラウザで動くコードを書く・直すことです。サーバー(PHP、Django、Node.js)が HTML とデータを返し、JS がクリックに反応し、計算・絞り込み・API呼び出しを行います。
「インタラクティブにして」とまとめられがちな3つの典型依頼:
| 改修 | 顧客が見るもの | ロジックの場所 |
|---|---|---|
| 計算機 | 入力、スライダー、合計、「注文」ボタン | 多くはJSのみ、時に+API |
| フィルター | チェック、価格帯、白画面なしの並べ替え | JS + サーバーまたはキャッシュ |
| マイページ | ログイン、注文、書類、プロフィール | JS(React/Vue)+ backend + DB |
重要: 計算機とマイページは同じ見積もりにできません。別プロダクトです。
サイト内計算機:種類と予算
シンプル($300-1 500)
想定: サービスLP、配送、リフォーム - 3-7項目、既知の計算式。画面に結果、フォームに合計を反映。
含む: レイアウト、ブラウザ内計算、基本バリデーション、レスポンシブ。
期間: 営業日2-7日。
中程度($1 500-4 000)
8-15項目、連動、複数プラン、PDF、担当者メール、CRM連携。
期間: 1-3週間。
複雑($4 000-15 000+)
B2B契約価格、ERP/API連携、多通貨、ロール、法的意味のあるPDF。backend必須 - 秘密価格をJSだけに置けません(DevToolsで見える)。
期間: 3-8週間。
表:2026 計算機の目安
| レベル | 予算 | 期間 | backend |
|---|---|---|---|
| シンプル | $300-1 500 | 2-7日 | 不要 |
| 中程度 | $1 500-4 000 | 1-3週 | 一部 |
| 複雑 | $4 000-15 000+ | 3-8週 | 必要 |
| コンフィギュレータ | $10 000-40 000+ | 2-4ヶ月 | 必要 |
カタログフィルター:種類と予算
クライアント側($500-2 000)
最大 200-500 商品を1ページに載せ、JSで表示/非表示。
AJAX($2 000-8 000)
サーバーへリクエスト、ページネーション、SEO向けURL。PHP/WordPress/Django のAPI、MySQL のインデックス。
期間: 2-4週間。
大規模($8 000-25 000+)
1万+ SKU、ファセット、検索、キャッシュ、SSR。公開後 SEO監査。
マイページ:種類と予算
CMS上の軽量アカウント($3 000-12 000)
WordPress、Bitrix、OpenCart - ログイン、注文、プロフィール。期間: 3-6週間。
カスタムフロント($12 000-35 000)
React/Vue + REST API。ロール、リアルタイム状態、ファイルアップロード。VPS へデプロイ。
期間: 6-12週間。
エンタープライズ / SaaS($35 000-150 000+)
サブスク、課金、マルチテナント、ERP、モバイルアプリと同一API。
価格に最も効く要因
- 既存backend - APIで3-5倍になりやすい。
- デザインと HTML - 独自UIは高い。CSS もセット。
- 連携 - CRM、ERP、決済:各 $500-3 000+。
- レガシーコード - 整理に20-40%。
- SEOと速度 - SSR、lazy load:+$1 000-5 000。
- 保守 - 開発費の10-15%または月 $200-600。
プラグイン、ノーコード、カスタムJS
| タスク | プラグイン | カスタムJS |
|---|---|---|
| スライダー、タブ | 多くは十分 | 過剰 |
| 簡単な計算機 | Calconic、WPプラグイン | 独自ロジック |
| WooCommerceフィルター | フィルタープラグイン | 1万+ SKU |
| 標準アカウント | WooCommerce | B2B、ERP |
| SPA、リアルタイム | 不可 | 必須 |
納品後の隠れコスト
VPS ホスティング、ライセンス、監視、CMS更新後の回帰テスト、フィルター用のカタログデータ($500-2 000)。
発注前チェックリスト
- ユーザーシナリオをステップで記述。
- データの出所(コード、DB、API)。
- SKU/ユーザー/計算量。
- モバイル比率。
- コードの所有とリポジトリ。
- 検収可能な基準(5-10項目)。
- 保証と修正回数。
まとめ
JS改修は $300(簡単な計算機)から数万ドル(マイページ・大規模カタログ)まで。見積もりは frontend/backend/連携の内訳を要求し、秘密価格をブラウザだけに置かない。ターンキーで比較し、保守を見込む。フィルターからポータルへ成長する段階で WordPressからの移行 をAPIスタックで検討。
よくある質問
プログラマーなしで計算機は作れるか?
一部は可能 - ビルダーやWPプラグインで簡単な式(月 $0-50)。開発者が必要なのは CRM/ERP価格、法的PDF、非公開の式。ノーコードの節約は $2 000+ の作り直しになりがち。
1万商品のフィルターが200より高い理由は?
200 なら1ページに載せブラウザで絞れる。1万 ではサーバー問い合わせ、インデックス、キャッシュ、クローラ向けURL、負荷試験が必要。カタログ属性の欠落はデータ問題でJSのせいではない。
WordPressアカウントは本格的なマイページか?
B2C なら多くの場合十分。B2B でロールと個別価格があるとWPはすぐ限界。JS+APIの方がプラグイン地獄より安いことが多い。WordPressとプログラマーが必要なとき を参照。
2026年のJavaScript開発の時給は?
目安: $40-80/時 - CIS・東欧のフリーランス;$80-120/時 - 西欧のシニア React/Vue;$100-150/時 - 米国フリーランス(リモート)、シニア frontend;$150-220/時 - 米国の代理店(PM・QA 込み)。代理店は 固定パッケージ で管理・QA に 30-50% の上乗せ。時給より固定見積もり - ストーリーポイントまたは要件固定:「3 000 SKU の AJAX フィルター」= $4 500 固定(CIS/東欧)または $8 000-12 000(米国)の方が「終わるまで40時間」より信頼できる。
JS改修が新規Django/Reactサイトより安いのはいつ?
局所的な作業: LPの計算機1つ、既存WooCommerceのフィルター、アカウント2画面の修正。新規サイトの方が得: 業務プラグイン多数、WP更新のたびJSが壊れる、web+モバイル共通API、年間パッチ予算が Django開発($15 000-40 000)に近い。2年TCO で比較。