【フルリモート/週5】React / Next.js フロントエンドアーキテクト(App Routerへの抜本的移行と大規模SPAの極限最適化)

案件要件
- 職種
- エンジニア
- 業務内容
- システム開発・運用SES
- 報酬目安
- 4,400 ~ 4,800円/時
- 稼働時間目安
- 週5日 (時間目安 160時間)
- はたらく場所
- フルリモート
- スキル
【フルリモート/週5】React / Next.js フロントエンドアーキテクト(App Routerへの抜本的移行と大規模SPAの極限最適化)
お任せしたいこと
自社で展開する数百万UU規模のBtoC Webサービス、または複雑な状態管理が求められるBtoB SaaSにおいて、React 18以降およびNext.jsを活用したモダンなフロントエンドアーキテクチャの設計、およびCore Web Vitals等のパフォーマンス指標の極限のチューニングをお任せします。
「とりあえずコンポーネントを分割してHooksで繋ぐだけ」という初学者的なReactの書き方を完全に脱却し、Next.jsのApp Router(React Server Components)がもたらすパラダイムシフトを深く理解した上で、レガシーな巨大SPA(肥大化したReduxや不要なuseEffectの連鎖)を、サーバーとクライアントの境界を意識した最新のアーキテクチャへと泥臭くマイグレーションしていただく中核的なポジションです。
具体的な業務内容
・React 18/19 および Next.js(App Router)を活用した、スケーラブルで保守性の高いフロントエンドアプリケーションの設計・開発
・肥大化したレガシーなReact SPA(またはPages RouterベースのNext.jsアプリ)から、App RouterおよびServer Componentsへの段階的かつ安全なマイグレーション戦略の策定と実行
・TanStack Query(React Query)、Zustand、Jotai等を適材適所で使い分けた、グローバル状態とサーバー非同期状態の適切な分離と設計
・Reactのレンダリング機構(Fiberアーキテクチャ)を深く理解した上での、Profilerを用いた不要な再レンダリング(Re-render)の原因究明と、useMemo / useCallback / React.memo の泥臭い最適化
・LighthouseやDatadog RUMを利用した、Core Web Vitals(LCP, CLS, INP等)の継続的な計測と、バンドルサイズの削減、サスペンス(Suspense)を活用したローディング体験の向上
・Tailwind CSSやCSS Modulesを活用したデザインシステムの構築、およびStorybookを利用したUIコンポーネントのカタログ化
・Vitest、React Testing Libraryを用いたフックやコンポーネントの単体テスト、およびPlaywright等を用いたE2Eテストの自動化とCI/CDへの組み込み
・Webアクセシビリティ(WAI-ARIA, セマンティックHTML)の要件定義と、スクリーンリーダー等の支援技術に対応するための泥臭い実装改善
必須スキル・経験
・Reactを用いたフロントエンド開発の実務経験(目安として3年以上)
・Next.jsを用いた本番環境でのアプリケーション設計・開発・運用経験
・TypeScriptを用いた高度な型定義、および堅牢なアプリケーションの実装経験
・ブラウザのレンダリング機構(DOMツリー、再描画の仕組み)やWebパフォーマンスに関する深い理解
・Git / GitHubを用いたプルリクエストベースでのチーム開発、およびコードレビュー経験
歓迎スキル・経験
・Next.js App Router(React Server Components)を用いた本番環境での構築、またはPages Routerからの大規模な移行経験
・GraphQL(Apollo Client等)、またはtRPCを用いた型安全なAPI通信の実装経験
・Vercel、AWS(Amplify, CloudFront等)、またはCloudflareを利用したフロントエンドインフラの構築・運用経験
・Storybookを活用したデザインシステムの構築、および社内パッケージとしての配信経験
・Figmaを用いたデザイナーとの密な協業、および大規模プロジェクトでのリードエンジニア経験
開発・業務環境
開発言語:TypeScript
UIライブラリ・フレームワーク:React, Next.js
状態管理・データフェッチ:TanStack Query, Zustand, Jotai (または Redux Toolkit)
スタイリング:Tailwind CSS (または CSS Modules, 独自のCSS-in-JS)
インフラ・ホスティング:Vercel, AWS (または Cloudflare)
テスト・品質:Vitest, React Testing Library, Playwright, Storybook
監視・分析:Datadog RUM, Sentry, Vercel Analytics
コミュニケーション・管理:GitHub, Jira, Slack, Zoom
プロジェクトチームについて
ユーザー体験(UX)の最大化と開発者体験(DX)の向上を技術の力で両立させる、フロントエンドコアプラットフォームチームへの配属となります。
「意味もなく乱用された useEffect」や「巨大な一つのファイルに詰め込まれたFat Component」を極めて嫌い、ビジネスロジックとUIプレゼンテーションを明確に分離し、カスタムフック(Custom Hooks)として美しくカプセル化する手堅いカルチャーです。Reactのエコシステムの激しい変化(Server Actions等の新機能)に直面した際にも、盲目的に最新技術に飛びつくのではなく、プロダクトの特性とチームのスキルセットを冷静に分析し、論理的にアーキテクチャを選定する実直なメンバーが集まっています。
求める人物像
・「画面のUIをマークアップするだけの作業者」ではなく、状態管理のデータフローやコンポーネントの粒度設計にエンジニアとしての強いこだわり(クラフトマンシップ)を持てる方
・ReactやNext.jsの破壊的アップデートに対して文句を言うのではなく、公式ドキュメントやRFCの議論を自ら読み込み、パラダイムシフトを前向きな知的好奇心として楽しめる方
・デザイナーやバックエンドエンジニアと対等に議論し、実装コストやパフォーマンスの観点から「より良いUXを提供するための現実的な代替案」を論理的に提案できる方
仕事の魅力
React Server Componentsという、フロントエンド開発における過去最大級のパラダイムシフトを実社会の大規模プロダクトの最前線で実践できる、極めて難易度が高くエキサイティングなポジションです。複雑な状態管理のパズルを解き明かし、ミリ秒単位のパフォーマンスチューニングを突き詰める経験を通じて、単なる「Reactが書けるコーダー」を完全に凌駕し、今後のモダンWeb市場で最も高く評価され渇望される「React / Next.js フロントエンドアーキテクト」としての圧倒的な市場価値を築くことができます。
働き方
リモート環境
[フルリモート] 基本的にフルリモートで働いていただけます。
株式会社Kaizen Tech Agent
株式会社Kaizen Tech Agentは、「人と技術をつなぐ」ことを企業理念に掲げ、日々向上していく『技術』と『人』を最適な形でむつび付け提供することで、
お客様にとって真にプラスとなる価値でありたいと考えております。
私たちはそれぞれの個性を尊重し、ほっとする和みの社風でありながら、変化する時代に対して受け身にならず、未来への挑戦心を宿しています。
事業領域は、WEBアプリ開発、業務システム開発、スマホアプリ開発、インフラ構築など幅広く展開しており、
フリーランス様に対して最適な案件をご提案させて頂いております。どんな些細な事でも結構ですので是非いつでもお気軽にご相談ください。
