d06_フロントエンドエンジニア

Leafeaって、どんな会社？

Leafeaは、福利厚生SaaSのスタートアップです。
2022年7月の設立から約2年で、全国10万店舗以上で利用できる福利厚生SaaSを展開し、現在は数万名以上に利用されています。

Mission

誰もがその人らしく生きられる社会をつくる。

働くことは、生きていくためにはなくてはならない営みであり、人生に大きな影響や意味を与えます。
日本における経済状況や社会制度、個人の力ではどうにもできない制約に阻まれ、どれだけ頑張って働いても、生活を変えることが難しい状況が続いています。
だからこそ、わたしたちは、個人では解決できない社会課題に向き合い、頑張った人たちの努力が、きちんと認められ、報われる社会をつくりたい。そして、誰もが安心して心穏やかに、自分のことや大事な人のことを考えられる世界であってほしい。
わたしたちは、資本主義の構造に抑圧されることなく、誰もがその人らしく生きられるような、温かく強い社会基盤を創造します。

Value（私たちの行動指針）

• 利他の精神で、行動する
• 八方よしで、考え抜く
• 真剣に向き合い、やりきる

Leafeaって、どんなフェーズ？

数億円の資金調達を経て、プロダクト・組織ともに拡大期にあります。
福利厚生業界での利用率No.1を目指し、スピード感ある事業成長を進めています。

プロダクト

物価高や賃金停滞が続くなか、中小企業の8割では福利厚生が十分に行き届いていません。私たちが提供する福利厚生SaaS「福利アプリ」は、従業員1人あたり月300円〜という圧倒的なコストパフォーマンスで、コンビニ・飲食店・映画館など全国10万店舗以上の優待を日常的に使えるようにしたサービスです。

旅行や特別なレジャーに偏りがちだった福利厚生を「日常使い」に変え、月間ログイン率6〜7割と、実際に使われる福利厚生として評価いただいています。全国チェーンに加え、地域のパートナー企業と連携して地場の店舗へも提携を広げています。

また、OEM提供により、導入企業が独自ブランドで福利厚生サービスを展開することもでき、新規事業の創出や既存顧客への付加価値提供も支援しています。

仕事内容

募集背景

稼働中の大規模な管理画面群を止めずにモダナイズする「1→10」と、新しい福利厚生Webアプリケーションを最新スタックでゼロから構築する「0→1」、その両方を技術面から引っ張っていただけるテックリード候補を募集しています。

プロジェクトの特徴

Leafeaのフロントエンドは、すでに本番稼働している大規模なReactアプリケーション群（管理画面系）と、新しく構築中のReact Webプロダクトの両方から成り立っています。完成した基盤の上で機能開発を続けるだけでなく、稼働中のプロダクトを運用しながらアーキテクチャや開発基盤そのものを継続的に再設計しているフェーズです。

1. 大規模React基盤のモダナイゼーション

• 管理画面系は複数のWebアプリケーションと100以上のfeatureを持つモノレポ（TypeScriptファイル3,000以上、共通UIコンポーネント100以上の規模）
• ユーザーが利用している本番プロダクトを止めずに、責務分離・APIアクセス層・テスト・デザインシステムを段階的に再設計中

2. AI-nativeな開発環境（AI Loop Engineering）

• AI Agentを「便利な補助ツール」ではなく、ソフトウェア開発プロセスを構成する要素の一つとして扱っている
• Agentごとの役割設計、Skill/Ruleによる開発知識の共有、lint→compile→testの自動検証、Git操作を制御するGuard、並列Agentを安全に動かすworktree運用、AIが得た知見を蓄積し開発ルールへ還元するGrowth Loopなどを構築中
• 「AIが自律的に開発でき、それでも品質や安全性が崩れない環境をどう作るか」を継続的に改善しており、AIコーディングツールを使ったことがある方だけでなく、AIを前提とした次世代の開発組織・プロセスを作ってみたい方にとっても面白い環境

3. React 19を中心とした新しいフロントエンド基盤

• 新しいWebアプリケーションでは React 19 / React Compiler（Viteビルドパイプラインに組み込み済み）/ TanStack Router / TypeScript / Vite / SWR / Zod を採用
• 既存管理画面（React 18）は19への移行もロードマップに含まれており、最新スタックでの新規開発と大規模モダナイゼーションを同時に経験できる

4. OpenAPIを中心とした型安全なAPI連携

• OpenAPIを正本とし、Orvalで型・データモデル・SWR Hookを自動生成
• 仕様と生成ライブラリの挙動差を吸収する自前のTransformerも実装しており、フロントエンド/バックエンドの境界設計まで関与できる

業務内容

プロダクト開発に加え、ご経験や得意領域に応じてフロントエンド全体の技術課題にも関わっていただきます。仕様を受け取って実装するだけでなく、「フロントエンドを今後どういう構造にしていくべきか」から一緒に考えていただける方を歓迎しています。

• 既存アーキテクチャの評価・改善、React 19への移行
• 新しい福利厚生Webアプリケーションの開発（React 19 / React Compiler）
• デザインシステムの設計、複数Webアプリケーション共通基盤の整備
• テスト戦略の策定（Vitest / Testing Library / MSW によるテスト基盤拡充）
• Observabilityの設計（Sentryによるエラーハンドリング改善）
• API Client基盤の改善（OpenAPI / Orvalを用いた型安全なAPI連携）
• AI Agentを利用した開発基盤の改善
• フロントエンドチームの技術ロードマップ策定

技術スタック

フロントエンド基盤

• TypeScript / React（UIライブラリ。新Webアプリ: React 19 + React Compiler、既存管理画面: React 18→19移行中）
• ビルドツール: Vite

状態管理・データ取得

• サーバー状態・APIデータ: SWR
• UIローカル状態: React state / Context
• フォーム: React Hook Form
• バリデーション: Zod

ルーティング

• 新Webアプリ: TanStack Router／既存管理画面: React Router

API通信

• OpenAPI（正本）+ Orval（型・データモデル・SWR Hookの自動生成）

テスト・品質

• Vitest、Testing Library、MSW、happy-dom
• Visual Regression Test: Storybook、Chromatic
• Biome、Lefthook、Knip

モノレポ・CI/CD

• Turbo、pnpm
• GitHub Actions、Dependabot

エラー監視・Observability

• Sentry

AI / 開発支援

• Claude Code などのAI Agentを日常的に活用（詳細は下記「AI-nativeな開発環境」を参照）

デザイン・コミュニケーション

• Figma、STUDIO、Slack、Google Meet

• Reactを用いたWebアプリケーション開発の実務経験（5年以上）
• FigmaなどのデザインツールをもとにしたUI実装経験
• レスポンシブデザインの理解と実装経験

• デザインシステムに準拠したコンポーネント開発
• OpenAPIを利用した開発経験
• アクセシビリティやWebパフォーマンス最適化の経験
• 大規模なコードベースを段階的にモダナイズした経験
• Vitest / Testing Library / MSWなどを用いたテスト基盤構築経験
• AIエージェント（Claude Code等）を活用した開発プロセスの設計・改善経験

• 仕様を受け取って実装するだけでなく、「フロントエンドを今後どういう構造にしていくべきか」から一緒に考えられる方
• プロダクトの改善に貢献し、チーム全体の成果を出す意欲がある方
• 技術だけでなく、サービス全体の設計に興味を持てる方
• スタートアップ環境を楽しみ、自ら課題を見つけて動ける方