SUPPORT 01
FRONTEND DEVELOPMENT
React / Next.jsを中心としたフロントエンド開発
TypeScript・React・Next.jsを中心に、画面実装、コンポーネント設計、状態管理、API連携などに対応します。
新規機能開発だけでなく、既存機能の改修や共通UIの整備、リファクタリングなど、進行中のプロジェクトへの途中参画も可能です。
DEVELOPMENT PARTNER
開発会社様へ
90名規模の開発現場も、
ひとりで完遂した移行案件も。
React / Next.js / TypeScriptを軸に、フロントエンドからAPI・DBまで。
開発会社様のチームへ、即戦力として参画します。
- 90–100名規模の開発体制へ参画し、複数ドメインの画面・共通UI・BFFを担当
- 13 → 16稼働中サービスのNext.jsを4世代、既存挙動を壊さず移行（React 18→19含む）
- Hono / Goフロントエンドを主戦場に、API設計・実装、DB連携まで踏み込めます
ISSUES
こんな開発課題はありませんか？
React / Next.js案件の開発リソースが足りない
フロントエンドを任せられるエンジニアが欲しい
進行中のプロジェクトへ途中から参画してほしい
既存システムの改修・保守まで任せたい
API連携まで理解できるフロントエンド人材が欲しい
デザインを理解して実装できる人材が欲しい
必要な部分だけ、必要な期間から。
既存の開発体制やルールに合わせて参画します。
DEVELOPMENT
SUPPORT
プロジェクトに必要な領域を、
柔軟に支援。
SUPPORT 02
SYSTEM IMPROVEMENT
新規開発だけでなく、既存システムの改善まで。
既存Webアプリケーションの機能追加、不具合修正、保守運用、リファクタリングにも対応します。
JavaScriptからTypeScriptへの移行、コンポーネント整理、フレームワークアップデートなど、サービスを止めずに段階的に改善していく開発にも対応します。
短期的に機能を完成させるだけではなく、その後の保守性や拡張性まで意識して実装します。
対応領域
SUPPORT 03
FULLSTACK ENGINEERING
フロントエンドだけに閉じない対応力。
メイン領域はフロントエンドですが、API連携、BFF、認証・認可、データベース連携など、Webアプリケーション全体を意識した開発が可能です。
Node.js / Hono / Goなどを利用したAPI開発経験もあり、フロントエンドとバックエンドの境界を理解しながら実装を進めます。
対応領域
WHY G.O.A.T
開発会社様との協業で
選ばれる3つの理由
STRENGTH 01
既存チームへスムーズに参画
GitHub運用、コードレビュー、既存のコーディング規約や設計方針など、プロジェクトごとのルールを理解したうえで開発します。
少人数チームから大規模プロジェクトまで、既存チームの一員として参画可能です。
単独で完結する受託開発だけでなく、開発会社様のチームメンバーとして稼働する開発支援にも対応しています。
STRENGTH 02
デザインも理解できるフロントエンドエンジニア
Webデザイン・UI/UX制作の経験を活かし、デザインデータをそのままコードへ置き換えるだけではなく、操作性、レスポンシブ、コンポーネントの再利用性まで考慮して実装します。
エンジニアとデザイナー双方の視点を持つことで、デザインと実装の認識差を減らし、スムーズな開発を支援します。
STRENGTH 03
AIを活用した開発にも対応
Claude Code / CodexなどのAI開発ツールを実務で活用しています。
既存コードの調査、影響範囲確認、実装補助、リファクタリング、ドキュメント作成などへ活用し、開発速度と品質の両立を図ります。
単にAIへコードを書かせるのではなく、本番環境やシークレット情報へのアクセスなどを考慮した運用ルール・ハーネスを意識して活用します。
PROJECT
EXPERIENCE
開発実績
CASE 01
大規模toC Webアプリケーション
約90〜100名規模 / 8ヶ月 / Next.js App Router
リーダー1名・サブリーダー1名・デザイナー3名・PG60名・テスター30名が動く開発体制へ、フロントエンド開発メンバーとして8ヶ月参画。
予約・注文・クーポン・会員・認証・通知・お問い合わせ・楽曲注文といった複数ドメインの画面を横断して担当しました。
一部機能ではNext.js Route HandlerをBFFとして構築。クライアントからバックエンドAPIを直接叩くのではなくNext.js側に受け口を置くことで、認証情報の扱いを一箇所に寄せ、画面で必要な形へ整形してから渡す構成にしています。
atoms / molecules / organisms ベースの共通コンポーネントの運用・拡張、Result型によるエラーハンドリングと表示エラー制御の整備、Jest / Testing Library でのテスト作成・改善まで担当。Storybook と MSW を用い、バックエンドの実装完了を待たずに画面を進められる状態を保ちました。
対応内容
CASE 02
稼働中サービスのNext.js 4世代メジャー移行
SE / 単独 / Next.js 13→16・React 18→19・Strapi v4→v5
一般社団法人が運営する会員制Webサイト（公開マーケティングサイト・会員ダッシュボード・管理者ダッシュボードの3領域／全30ページ・API Route Handler 20本・コンポーネント約170件）を、稼働させたまま単独で移行。
「既存の画面と挙動を一切壊さない」ことを最優先要件に置き、13→14→15→16の段階移行として設計。計7本のPRに分割し、1PRあたり1論点まで影響範囲を絞り込んでレビューできる形にしました。
着手前に公式アップグレードガイドと約80点の依存パッケージを突き合わせ、破壊的変更の影響を先に洗い出し。認証・会員データ・管理者権限・メール送信といった、壊れたら即障害になる領域から順に切り分けています。
プロジェクトに回帰試験が存在しなかったため、全ルートを対象としたスモークテスト観点表を整備して代替とし、移行前後の差分を検証。あわせて、AIコーディングエージェント（Claude Code / Codex）を安全に使うための運用ルール（危険コマンドの禁止、シークレット参照の禁止、本番DB・本番メールへの接続禁止）をガードレールとして設計・文書化しました。
対応内容
CASE 03
自治体業務システム フルスタック開発
14ヶ月 / Next.js + Hono + DynamoDB
市役所職員向けのごみ収集管理Webアプリケーションを、UI設計からフロントエンド・バックエンド・保守運用まで一貫して担当しました。
現場がスマートフォンから収集状況を登録・確認できることを前提にFigmaで画面を設計し、収集実績の週別・月別集計とグラフ表示（Chart.js）まで実装。
Honoでバックエンドを設計・実装し、DynamoDBへ接続。認証・アクセス制御を前提としたクローズドな業務システムとして構築し、公開後の保守運用・軽微改修まで継続して担当しています。
対応内容
CASE 04
医療学会向け 招待制情報提供システム
React SPA + Go（Echo）
医療従事者・学会関係者向けの招待制システムを、ユーザー画面・管理画面の両方で担当。
本人確認書類の提出、承認・未承認管理、講座登録、複数ロールに応じた権限制御など、正確な情報保持と権限管理が前提となる機能を実装しました。
フロントエンドを主軸としつつ、Go（Echo）でのバックエンドAPI開発にも参画。OpenAPI定義からOrvalでクライアントを生成し、型のずれを設計段階で潰しています。
対応内容
CASE 05
SDGs推進型オンラインコミュニティ
React SPA + Go（Echo）
全国のユーザーが参加するコミュニティシステムのフロントエンド開発、API連携、管理画面構築、認証機能実装を担当。
OpenAPI定義からOrvalでクライアントを生成し、MSWのモックを併用することで、APIの実装完了を待たずにフロントエンドを進行させました。
社内フロントエンドテンプレートをカスタマイズし、UI/UXデザインの実装からロジックまで一貫して対応しています。
対応内容
CASE 06
大手転職アプリ フロントエンド改修・保守運用
Next.js 12 / 既存構成のモダナイズ
クラスコンポーネント中心・JavaScriptベースの既存フロントエンドを、稼働を止めずに段階的なモダン構成へ寄せながら保守運用を担当。
影響範囲を見極めて小さく刻んでリリースする進め方を、実サービスで実践しています。
対応内容
TECHNOLOGY
対応技術
- Frontend
- TypeScript / JavaScript / React / Next.js / HTML / CSS / SCSS / Tailwind CSS
- State / Data Fetching
- Zustand / TanStack Query / SWR
- Backend / API
- Node.js / Hono / Go / Next.js Route Handler / REST API / BFF
- Database / CMS
- PostgreSQL / DynamoDB / SQLite / Prisma / Strapi / WordPress / microCMS
- Development
- GitHub / Figma / Storybook / Jest / Testing Library / MSW / ESLint / Prettier
- Infrastructure / Tools
- AWS / Vercel / Render / Linux
- AI Development
- Claude Code / Codex
PARTNERSHIP
プロジェクトに合わせた
柔軟な参画が可能です。
01 / TEAM
開発チームへの参画
既存のチーム・開発フロー・コーディングルールに合わせて稼働します。
02 / PROJECT
プロジェクト単位の開発支援
新規機能開発、既存システム改修、技術移行など、必要な領域から支援します。
03 / LONG TERM
中長期の開発支援
継続的な保守、機能追加、リファクタリング、改善などにも対応します。
契約形態
業務委託・準委任など、案件に応じてご相談可能です。
FLOW
協業開始までの流れ
お問い合わせ
案件内容、必要なスキル、稼働条件などを簡単にお聞かせください。
案件・条件の確認
技術構成、担当範囲、開発体制、稼働条件などを確認します。
スキルシート共有
必要に応じてスキルシートを共有し、技術面・条件面をご確認いただきます。
面談
プロジェクトの進め方や担当領域について、双方で認識を合わせます。
条件・契約確認
業務委託・準委任など、プロジェクトに合った契約形態を確認します。
プロジェクト参画
既存の開発フローやチーム体制に合わせて開発へ参加します。
FAQ
よくあるご質問
どのような案件に対応できますか？
React / Next.js / TypeScriptを中心としたWebアプリケーション・フロントエンド開発を主な対象としています。
新規開発、既存システム改修、保守運用、リファクタリング、API連携などにも対応可能です。
既存プロジェクトへの途中参画は可能ですか？
可能です。
既存コード、設計方針、Git運用、コーディング規約などを確認し、現在の開発フローに合わせて参画します。
バックエンドも対応できますか？
フロントエンドを主軸としながら、Node.js / Hono / Goを利用したAPI開発やBFF、DB連携などにも対応可能です。
契約形態は？
業務委託・準委任など、案件に応じてご相談可能です。
AIツールの利用は可能ですか？
Claude Code / Codexなどを実務で活用しています。
案件側のセキュリティポリシーや開発ルールを優先し、安全性を考慮したうえで利用します。
デザインから実装まで依頼できますか？
可能です。
Figmaなどを利用したUI設計・Webデザインの経験があるため、デザインデータからの実装だけでなく、UI/UXやレスポンシブを考慮した実装にも対応できます。
LET'S BUILD TOGETHER
開発リソースで
お困りではありませんか？
React / Next.js / TypeScriptを中心とした
Web開発・フロントエンド開発のご相談を承ります。
新規開発、既存システム改修、保守運用、
開発チームへの参画など、お気軽にご相談ください。
開発会社様・SES企業様からのパートナー相談も歓迎しています。