Reactフリーランス単価相場｜案件動向・スキル別レンジ・獲得の実務

Reactフリーランス単価の相場感

結論：公開案件の中央帯は月75〜95万円、上限帯は月110〜130万円。以下の目安は首都圏中心・主要フリーランスエージェント数社の公開案件（週4〜5日準委任）で観測できる数字で、実務経験3年以上を前提にしています。

経験年数別の単価レンジ（公開案件ベース）

前提を先に明示しておきます。以下は「React・TypeScriptを主軸に、SPA開発またはNext.js案件に参画できる人」を想定した目安です。実務でReactに触った期間ではなく、Reactを主戦場として設計・実装まで完結させられる年数で見てください。

上位帯は「募集要件を上回るスキル構成」「フルコミット」「BFFまたは要件整理を含む」等の条件が揃ったケースの目安です。非公開案件は個別条件で上振れするケースがありますが、公開案件と同列に並べる数字ではありません。

単価は年数だけで決まらない点に注意してください。3年目でも設計レビューを回せる人は5年目相当の帯に届くことがあり、5年目でも実装オンリーの動き方だと中央帯に張り付きます。年数はあくまで足切りの目安として扱われます。

ミニFAQ

• Q. React経験が実質2年でも単価80万円は狙えますか？ A. Reactに加えてTypeScriptとNext.jsを一定量書いていて、要件から実装まで一人で回した経験があれば、面談で提示されるケースはあります。ただし公開案件の応募段階で足切りされることが多く、エージェント経由でスキル面談を通してから提示される流れが実務的です。

スキル構成別の単価差

Reactを軸にどこまで守備範囲が広いかで、同じ経験年数でも帯が変わります。

TypeScript化は最初のレバーです。JavaScript単独のReact案件は保守寄りが多く、単価が伸びにくい傾向があります。TypeScriptと状態管理（Redux Toolkit・Zustand・TanStack Query等）を組み合わせると帯が上がりやすいのは、新規開発案件で要件として指定されることが多いためです。

TypeScript側の詳細な単価レンジはTypeScriptフリーランスの単価相場と案件の探し方、Reactの技術解説はReactとは？初心者向け入門解説を参照してください。

東京在住／地方在住×フルリモートの単価差

結論：完全リモート案件では東京在住者と地方在住者で単価差が出にくいケースが多く、差が出るのは週1回以上の出社条件があるときです。地方在住でフルリモートに寄せて働く場合、公開案件の単価レンジは首都圏と近い水準で提示される傾向があります。

以下の目安は2026年時点の首都圏エージェントの公開案件（フルリモート・準委任）を確認した数字で、案件の集中は首都圏企業に寄っています。地方在住でも案件母数を確保するには、首都圏エージェントに登録して面談ベースで提示条件を確認するのが実務的です。地方案件全般の相場は地方フリーランスエンジニアの単価相場を参照してください。

React案件の動向（企業タイプ・領域・稼働形態）

結論：React案件は自社サービス系とSaaS系スタートアップに厚みがあり、SES経由の受託案件も一定量流通しています。企業タイプで単価と働き方が変わるため、選び方の起点は「発注元がどこか」に置くと判断が早くなります。

企業タイプ別

• 自社サービス系（BtoC・BtoB SaaS）：中央帯85〜105万円。裁量が大きく、フルリモート寄り。プロダクト開発を通しで担える案件が多いです。

• SaaSスタートアップ：中央帯80〜100万円。技術選定・裁量が広い一方、体制変化が早く、要件変更の頻度が高めです。契約条件はSaaSスタートアップのフリーランスエンジニア案件にまとまっています。

• 受託開発（Web制作会社・システム開発）：中央帯70〜90万円。案件ごとに技術スタックが変わり、短期の入れ替わりがあります。

• SES経由の準委任：中央帯65〜85万円。参画までは早いものの、多重下請けが挟まると本人に提示される月額単価が抑えられやすい傾向があります。エージェント経由と直取引の差はエージェントのマージン相場と手数料の仕組みを確認してください。

ミニFAQ

• Q. 自社サービス系が単価も裁量も高いなら、まずそこを狙うべきですか？ A. スキル要件が上がる（設計込み・レビュー含むケースが多い）ため、実務3年未満でReactに触った期間が短い場合はSaaSスタートアップまたは受託から入り、実績を積んでから自社サービス系にシフトする動き方が現実的です。

領域別

React案件は領域で難易度と単価がずれます。BtoB SaaSの管理画面・BtoCのフロント刷新・ECサイト・認証基盤絡みなどが主要領域です。

• BtoB SaaSの管理画面：中央帯80〜100万円。テーブル・フォーム・権限周りの実装が多く、TypeScript・状態管理の理解が必須です。

• BtoCのフロント刷新：中央帯85〜110万円。パフォーマンス・SEO・レンダリング戦略（SSR/SSG/RSC）を握れると帯が伸びます。Next.js側の詳細はNext.js案件の単価相場を参照してください。

• EC・小売：中央帯75〜95万円。決済・在庫・キャンペーンの仕様が絡み、要件整理のスキルが効いてきます。詳細はEC・小売業界のフリーランスエンジニア案件を参照してください。

• 認証基盤・IDaaS絡み：中央帯90〜110万円。OAuth/OIDC・SSO・多要素認証まで理解している人向けです。詳細は認証基盤・IDaaSエンジニアのフリーランス案件動向を参照してください。

稼働形態（フルリモート・常駐・稼働日数）

React案件はフルリモート比率が高い部類で、公開案件でもフルリモート表記が目立ちます。ただし発注元によっては「初月のみ週1出社」「セキュリティ要件で月◯回出社」等の条件が入るため、面談時に確認する必要があります。フルリモート案件全般の探し方はフルリモート フリーランスエンジニアの案件事情を参照してください。

稼働日数は週4〜5日準委任が主流。週3以下は選択肢が狭くなりますが、React特化のスタートアップ案件で見つかるケースがあります。週3日稼働の実務は週3日で働くフリーランスエンジニアの始め方にまとまっています。

単価が上がるスキルスタック

結論：Reactを軸に、TypeScript→Next.js/RSC→状態管理設計→BFF/認証の順で守備範囲を広げると、単価帯の上限が段階的に伸びます。以下は公開案件の募集要件で頻出する構成をもとにした整理です。

TypeScriptは前提スキルとして扱われる

新規React案件の多くでTypeScriptが要件に入っています。Reactに強くてもTypeScript歴が浅い場合、スキルシート上で「JavaScript中心」に見えると単価帯の上限が抑えられがちです。型定義の設計（Utility Types・Generics・Discriminated Unions）まで書けると差がつきます。TypeScriptの言語解説はTypeScriptとは？を参照してください。

Next.js（Pages Router／App Router／RSC）

Next.jsはReact案件の中で単価帯を上に押し上げる主要スキルです。公開案件の募集要件を見る限り、Pages Router案件は保守・改修寄り、App Router／React Server Components案件は新規開発寄りの傾向があります。RSCの理解（サーバコンポーネントとクライアントコンポーネントの境界設計）まで扱えると新規案件で優位です。Next.js案件の詳細はNext.jsとは？React基盤のフレームワークを確認してください。

関連フレームワークとしてRemixやAstro、SSR/SSG基盤としてのVercelも一部案件で採用されています。

状態管理・データフェッチの設計力

Redux Toolkit・Zustand・Jotai・TanStack Queryなど、案件によって選定が分かれます。「使ったことがある」ではなく「新規で選定できる」「既存のRedux設計を整理できる」レベルまで踏み込めると、実装リード帯（月90〜110万円）が現実的になります。

UI・スタイリング・アクセシビリティ

Material UI・shadcn/ui・Chakra UI・Tailwind CSS等のUIライブラリ選定と、アクセシビリティ対応（キーボード操作・スクリーンリーダー）まで意識できる人は評価が上がりやすいです。UIライブラリ側の詳細はMaterial UI（MUI）とは、Tailwind CSSとはを参照してください。

テストとパフォーマンス最適化

Jest・Testing Library・Playwrightでのテスト設計、React Profiler・Chrome DevToolsを使ったパフォーマンス改善は、単価アップの隠れた差別化要因です。実装だけでなく品質面まで担える人は限られるため、要件に入っていなくても実績として書けると効きます。テスト系の詳細はJestテスト、Playwrightとはを参照してください。

BFF・API連携・認証

Next.jsのRoute HandlersやNestJS等でBFFを書ける人、認証（NextAuth・Auth0・Firebase Auth）まで実装できる人は上位帯に届きます。バックエンド側は必ずしも一次言語である必要はなく、「フロント側からAPI設計に注文が出せる」レベルで十分単価が伸びます。Node.js寄りのFWはNestJSとは、Express.jsとはを参照してください。

ミニFAQ

• Q. すべてのスキルを揃えないと100万円に届きませんか？ A. 全部揃えなくても、TypeScript・Next.js・状態管理の3点に加えて、要件整理／レビュー／設計判断のいずれかを1つ持つと100万円帯が視野に入ります。全網羅より「1つの深い強み」を作るほうが再現性が高いです。

単価レンジ別に求められる要件

結論：60万・80万・100万・120万の各壁で、求められる責任範囲がステップアップします。単価を上げる動き方を逆算する上で、次の壁で何が求められるかを把握しておくと動きやすくなります。単価アップの実践的な進め方はエンジニアの単価を上げる5つの方法、単価が伸びない場合の自己診断は単価が上がらない8つの原因を参照してください。

60〜75万円レンジ

• 主なロール：フロント実装メンバー

• 要件：React＋JavaScript／TypeScriptの実装ができる。既存コードの改修ができる。

• 壁：TypeScriptが浅い・状態管理の理解が薄い場合、この帯から出にくいです。

75〜95万円レンジ

• 主なロール：実装リード／設計込み実装

• 要件：TypeScript・Next.jsを新規案件で書ける。状態管理の設計方針を選べる。テスト実装ができる。

• 壁：レビューや要件整理を経験しないと次の帯に届きにくいです。

95〜115万円レンジ

• 主なロール：テックリード寄り・アーキ提案あり

• 要件：技術選定を主導できる。BFF/認証まで守備範囲。他メンバーのレビューができる。

• 壁：組織横断の意思決定・非機能要件（パフォーマンス・セキュリティ）を主導できるかで分かれます。

115〜130万円以上レンジ

• 主なロール：テックリード／アーキ／ソリューション寄り

• 要件：プロダクト全体の設計判断ができる。ステークホルダーとの調整までカバーする。フロント以外の技術判断も可能。

• 参考：非公開案件・特命案件が多く、公開帯とは別筋で提示されるケースが目立ちます。上流寄りロールの詳細はフリーランスのテックリード案件、ソリューションアーキテクト案件のフリーランス実情を参照してください。

単価がなかなか上がらないと感じる場合、経験年数を積むより「1つ上の帯の要件を先に取りに行く」ほうが早い傾向があります。もちろん商流・業界・稼働条件・地域・面談力などの影響もありますが、5年で85万円のまま止まる人と3年で95万円まで届く人の差を説明する要因の1つとして、次のロール（設計込み実装／実装リード）を取りに行ったかどうかが挙げられます。詳細は経験年数別フリーランスエンジニアの単価相場を参照してください。

React案件の探し方と面談の勝ち筋

結論：エージェントに「React＋TypeScript＋（Next.jsか状態管理設計）」で絞り込みを依頼し、面談で自分のスコープを言語化するのが実務的です。求人票の「React経験3年以上」は幅が広く、書面だけで判断されると単価帯を落とされるリスクがあります。

自分がどの帯に届くか具体的な数字で知りたい方は、無料のフリーランスエンジニア単価診断で市場単価の目安が確認できます。

エージェント経由の絞り込み方

エージェントには「React案件」だけを渡すのではなく、以下の条件を組み合わせて渡すと精度が上がります。

• 主軸スキル：React・TypeScript（＋Next.js／状態管理／BFFのいずれか）

• 稼働形態：フルリモート／週◯日／準委任

• 領域の希望：BtoB SaaS／BtoC／管理画面／EC など

• 単価の下限と上限（面談で調整可能）

エージェントの選び方・面談準備はフリーランスエージェントとの面談の内容と必要な準備、面談で聞かれる質問は面談で聞かれる質問と回答例にまとまっています。

スキルシート・職務経歴書の書き方

Reactは「触った期間」より「担当スコープ」で評価されます。以下を明記すると単価交渉が通りやすくなります。

• コンポーネント設計の粒度（Atomic Design／Feature Sliced Design 等）

• 状態管理の選定理由（Redux Toolkitを選んだ理由、Zustandに切り替えた理由 など）

• テスト実装の実績（Jest・Testing Library・Playwrightの範囲）

• パフォーマンス改善の実績（LCP改善、レンダリング最適化 等）

• 上流工程の関与（要件整理・技術選定・レビュー）

スキルシートの書き方全般はフリーランスエンジニアのスキルシートの書き方を徹底解説、実績が少ない場合の書き方は実績が少ないフリーランスエンジニアでも通るスキルシートの書き方、職務経歴書との使い分けは職務経歴書とスキルシートの違いを参照してください。

面談で伝えるべき論点

面談で単価帯を落とさないためには、自分のスコープを先に言語化しておくと有利です。

• 直近案件で「実装だけ」ではなく「どこまで判断したか」

• 選定・設計の判断根拠（採用したライブラリ、外した選択肢）

• 詰まったときにどう解決したか（1人で解いたか、レビューを回したか）

• 苦手領域と、そこをどうカバーしているか

面談で落ちる原因の整理はフリーランス面談で落ちる7つの原因、単価交渉の実務はフリーランスエンジニアの単価交渉のコツ、オンライン面談の勝ち筋はオンライン面談で選ばれるフリーランスエンジニアを参照してください。

よくある失敗と対策

失敗1：JavaScript中心のReact案件で単価が伸び悩む

既存SPAの保守案件でJavaScriptベースのReactを触っているだけだと、単価帯の上限が抑えられます。対策は、副業や個人プロジェクトでもTypeScript／Next.js／状態管理の3点を実務レベルまで持ち上げてから、次の案件でTypeScriptベースの新規案件に応募することです。

失敗2：レガシーjQuery混在案件の引き剥がしで疲弊する

React案件と名乗っていても、実態はjQueryとReactが混在した既存コードの改修だけ、というケースがあります。契約前に「Reactの範囲がどこまでか」を確認しないと、Reactスキルを磨けないまま時間が過ぎるリスクがあります。案件の見極めは案件の読み方、案件の選び方を参照してください。

失敗3：常駐前提の高単価案件でリモート希望とすれ違う

上位帯の案件の一部は「初月出社」「週◯回出社」等の条件が入ります。フルリモート希望を初期に伝えないと、参画後に条件のすり合わせで揉めるケースがあります。契約前に稼働形態を確認しましょう。常駐案件の実務はフリーランス常駐で評価される立ち回りを参照してください。

失敗4：「バックエンドも巻き取ってほしい」で工数が跳ねる

小規模案件やスタートアップでは、フロント担当がAPI設計・DB設計まで巻き取ることがあります。BFF程度なら許容範囲ですが、フルスタックが前提の案件はスコープと単価のバランスを確認してから受けたほうが安全です。

失敗5：単価だけ見て稼働率が悪い案件を選ぶ

月単価だけ見て決めると、稼働時間が長い案件で実質時給が下がるケースがあります。単価と稼働時間のバランス感覚は月単価の時給換算と会社員年収の比較、月単価別 手取り早見表を参照してください。

Reactフリーランス実務チェックリスト

参画前に確認しておきたい項目を整理します。

• 主軸フレームワークはNext.jsか純Reactか（App Router／Pages Routerのどちらか）

• TypeScript化率（100%か、JavaScript混在か）

• 状態管理の採用ライブラリと選定理由

• テストの範囲（ユニット／結合／E2E）とカバレッジ方針

• BFFの実装範囲（フロント担当がどこまで書くか）

• 認証の実装（自前実装かIDaaS採用か）

• 稼働形態（フルリモート／出社頻度／稼働日数）

• レビュー体制（PRレビューを回す人／頻度）

このチェックを埋めてから参画すると、思っていた案件像とのズレを事前に減らせます。単価を体系的に上げる考え方はフリーランスエンジニアの単価相場と単価の上げ方、高単価案件の共通条件は高単価案件に共通する5つの条件を参照してください。

まとめ

Reactフリーランスの単価は、経験年数だけでなくスキル構成とロールで大きく変わります。公開案件の中央帯は月75〜95万円、上位帯は月110〜130万円で、TypeScript・Next.js・状態管理設計・BFFまで守備範囲を広げるほど上限が伸びる、というのが本記事の要点です。

• 公開案件の目安は月60〜130万円。中央帯は月75〜95万円（首都圏中心・週4〜5日準委任・実務経験3年以上）

• 単価差はスキル構成とロールで決まる。TypeScript→Next.js→状態管理設計→BFFの順で伸ばすと再現性が高い

• 完全リモート案件では東京在住者と地方在住者で単価差が出にくい

• 100万円帯を狙うなら、上流工程（要件整理・技術選定・レビュー）のいずれか1つを深く取りに行く

• 案件はエージェントに「React＋TypeScript＋（Next.jsか設計スキル）」で絞り込み依頼し、面談で自分のスコープを言語化する

自分がどの帯に届くか気になる方は、無料のフリーランスエンジニア単価診断で市場単価の目安を確認できます。Reactの技術解説はReactとは？初心者向け入門解説、単価を体系的に上げる考え方はフリーランスエンジニアの単価相場と単価の上げ方、単価が決まる仕組みはフリーランスエンジニアの単価の決まり方を合わせて参照してください。

参考にした主な公的情報：経済産業省 IT人材需給に関する調査、厚生労働省 職業情報提供サイト jobtag（Webフロントエンドエンジニア）、React 公式サイト。