少人数でもLLMで加速できる。AI時代のフロントエンド開発の実践

Rimo合同会社でフロントエンドエンジニアをしている栗山です。Rimo合同会社 アドベントカレンダーの12日目として2025年のフロントエンド開発を振り返り、AIとの協働がもたらした変化を具体的な数字とともにお伝えします。

数字で見る2025年

2025年コード量は前年比218%増、PRマージ数は1,329件。この急成長を支えたのはClaude Code等を始めとするLLMの本格導入が、開発のあり方そのものを変えました。

まず、2024年と2025年の開発規模を比較してみましょう。

コード量が3倍以上に増えています。一方、組織としてフロントエンド開発メンバーは約1.5倍の増加 (インターンを含む) でした。メンバーの増加以上に開発規模が拡大しています。この背景には、AIコーディングアシスタントの存在がありました。

AIコーディングアシスタントの本格活用

Claude CodeはGitHub Actionsと連携し、PRレビューやバグ調査の自動化に活用しています。これにより、コードレビューの品質向上、定型的な作業の効率化、問題の早期発見が実現しました。私は主にCursorとClaude Codeで定着しています。日々の開発において自分でプログラムを書くことが減ったことを実感しています。

ここでは特に効果が大きかった具体的な事例をご紹介します。

Claude Codeによる大規模移行

なぜ移行が必要だったのか

Rimo Voiceでは長らく「styled-components」というライブラリでデザインを管理していました。しかし2025年に新規開発の終了が発表されました。長期的なプロダクトの維持を考え、アクティブに開発が続いている「Tailwind CSS」への移行を決定しました。

問題：膨大な書き換え作業

移行対象は356ファイル、約2万行のコード。すべてを人間が手作業で書き換えるには、膨大な時間がかかります。しかも、単純な置換ではなくスタイルの意味を理解した変換が必要です。

解決：Claude Codeに任せる

変更ファイルを難易度別に分類し、計画を立てた上で置換処理のトライアンドエラーを行いながらClaude Codeを使って移行作業を実施しました。

結果は以下の通りです。

人間の役割は「レビュー」に徹しました。Claude Codeが生成したコードを確認し、問題がないかチェックする。この役割分担により、9月から10月の約2ヶ月でこれだけの成果を出すことができました。

コード量が減ったのも成果のひとつです。Tailwind CSSの効率的な記述により、同じデザインをより少ないコードで実現できるようになりました。

※ 移行作業は現在も継続中です。残りのファイルも段階的に対応を進めています。

コードの自動生成で開発効率化

LLMの他にも一部ソースコードを自動生成させ開発促進とレビューの緩和をさせることができました。

今までのフロントエンドとバックエンドの通信部分のコードは、従来手作業で書いていました。ここにTypeSpecとOrvalというツールを導入し、この作業を自動化しました。

API仕様を定義すれば、フロントエンド用のコードが自動生成される仕組みです。そこに加え、アプリケーションの要件に合わせた独自のカスタマイズも実装しています。

導入から約9ヶ月で移行率は70%に到達。新規APIは原則としてこの仕組みで開発する運用が定着しています。

今後の展望

2025年はLLMの活用において、大きな一歩を踏み出した年でした。一方で、まだ活用しきれていない領域もあります。

たとえば、Claude CodeのSubagent機能（複数のAIが協調して作業する機能）は、限定的な利用にとどまりました。より複雑なタスクをAIに任せるには、開発フローの整備が必要です。

2026年は、チームのさらなる拡大を見据え、AIとの協働をより深化させていきます。開発フローの標準化、ドキュメントの整備、新メンバーがすぐにAIを活用できる環境づくり。これらを進めることで、開発速度と品質の両立を目指します。

フロントエンドエンジニア募集中

Rimo Voiceでは、フロントエンドエンジニアを募集しています。

私たちが求めているのは、AIを積極的に活用しながら柔軟に機能を提供できるエンジニアです。フロントエンドを専門とする正社員メンバーはまだまだ少数なため組織の醸成が好きな方、インドを始めとする他国籍のエンジニアと仕事をしたいというエンジニアの方は興味を持っていただけるのではないかと思っています。

興味のある方は、ぜひ採用ページをご覧ください。

👉 採用情報はこちら