エキスパート・フロントエンドエンジニア／Expert Front End Engineer

エキスパート・フロントエンドエンジニアのミッション サービスの開発部門を担うプロダクトグループにおいて、エキスパート・フロントエンドエンジニアのミッションは、プロダクトのユーザー体験を支えるフロントエンドの構造を設計し、長期的に拡張可能な基盤として成立させることです。 具体的には、React / Next.js を中心としたフロントエンドアーキテクチャの設計、コンポーネント構造や状態管理の設計、APIとの責務分離などを通じて、プロダクト全体のフロントエンドの構造を定義していきます。 PdMやバックエンドエンジニア、デザイナーと連携しながら、ユーザー体験や機能要件をフロントエンドの構造へと落とし込みます。単に画面を実装するのではなく、状態管理や描画パフォーマンス、大規模フロントエンドとしての保守性などを踏まえた設計を行うことが求められます。 ROOVは、単なるWebアプリケーションではなく、複雑な情報や体験を扱うプロダクトとして進化を続けています。その中でフロントエンドは、ユーザー体験を成立させる重要なレイヤーです。本ポジションでは、プロダクトの成長に耐えうるフロントエンドの構造を設計し、将来的には開発ラインを技術面から支える役割を担っていくことを期待しています。 ※当社の開発体制とプロダクトロードマップについては下記noteをお読みください。 CTO木村が語る開発組織のこれまでとこれから エキスパート・フロントエンドエンジニアに求めること スタイルポートでは、フロントエンドを単なる画面実装の領域としてではなく、プロダクト構造の重要な一部として捉えています。本ポジションでは、フロントエンドの設計と技術判断を担い、プロダクトの成長を構造から支える役割を期待しています。

• フロントエンドアーキテクチャの設計 React / Next.js を中心としたフロントエンドにおいて、単に画面を実装するのではなく、コンポーネント構造、状態管理、データフロー、APIとの責務分離などを設計として整理し、チームで共有できる形に落とし込みます。 コンポーネント構造や状態管理の設計については、なぜその構造を採用するのかを説明できることを重視します。図やドキュメントを用いて構造を整理し、チームで合意形成しながらフロントエンドの基盤を構築していきます。
• 大規模フロントエンドの設計と改善 プロダクトの成長に伴い、画面数や機能は増え続けます。エキスパート・フロントエンドエンジニアには、コンポーネント設計や責務分離、状態管理などを整理しながら、大規模なフロントエンドを継続的に改善していく役割が求められます。 既存の実装を前提とするのではなく、必要に応じて構造の見直しや再設計を行い、長期的に保守可能なフロントエンドを維持していきます。
• パフォーマンスを考慮した描画設計 ユーザー体験を成立させるためには、フロントエンドのパフォーマンス設計も重要な要素です。レンダリング戦略やデータ取得方法、状態更新の設計などを踏まえ、ユーザーにとって快適な操作体験を実現します。 応募資格（必須） React / Next.js を用いたWebアプリケーションの開発経験 コンポーネント設計や状態管理など、フロントエンドの構造設計を行った経験 フロントエンドの設計について、図やドキュメントを用いて説明できること APIとの責務分離やデータフロー設計など、アプリケーション全体を踏まえたフロント設計経験 パフォーマンスや保守性を考慮したフロントエンド実装経験 バックエンドエンジニアやデザイナーと連携しながらプロダクト開発を進めた経験 応募資格（歓迎） フロントエンドアーキテクチャの設計経験 大規模フロントエンドのリファクタリングやリアーキテクチャ経験 Next.js を用いたSSR / SSGアプリケーション開発経験 レンダリングパフォーマンスの改善経験 TypeScriptを用いた型設計の経験 デザインシステムやコンポーネントライブラリの設計経験 フロントエンド開発のガイドライン整備や技術リード経験 求める人物像 フロントエンドを単なる画面実装ではなく、プロダクト構造の一部として捉えられる方 コンポーネント構造や状態管理などの設計について、言語化して説明できる方 要件をそのまま実装するのではなく、構造や責務を整理して設計に落とし込める方 バックエンドエンジニアやデザイナーと協力しながら、ユーザー体験をプロダクトとして成立させられる方 既存実装を前提にせず、より良い構造へと改善していくことを楽しめる方 将来的にフロントエンド領域の技術リードを担うことに関心のある方 テクノロジーと開発 スタイルポートでは、特定の技術スタックに固執するのではなく、プロダクトの特性や課題に応じて、適切な技術選択・構成を検討し続けることを大切にしています。バックエンドエンジニア（テックリード候補）には、こうした技術選択や構成の妥当性について、設計として説明し、改善をリードしていくことを期待しています。 現在利用している主な技術スタックは以下の通りです。 開発言語：Ruby, Go, TypeScript, JavaScript フロントエンド：React / Next.js, Three.js バックエンドフレームワーク：Ruby on Rails, Gin インフラストラクチャ：AWS（EC2, ECS, RDS, S3, CloudFront, ElastiCache, Lambda, API Gateway, AWS Batch, Step Functions, Glue, AppFlow など）,GCP（BigQuery, Datastream） Infrastructure as Code：Terraform データベース：RDS Aurora, DocumentDB, DynamoDB, Redis CI/CD：GitHub Actions 監視・アラート：Sentry, Datadog, UptimeRobot, PagerDuty リポジトリ管理：GitHub これらはあくまで現時点での一例であり、設計や運用上の課題に応じて、技術スタックや構成の見直しを継続的に行っています。 リモートへの取り組み プロダクトグループでは、メンバーが各地に分散しており、日常的な業務はリモート環境で行われています。 分散したチームで成果を出すためには、単に場所に縛られないだけでなく、前提や判断を正しく共有できる仕組みが不可欠です。そのため私たちは、情報共有の粒度やタイミング、意思決定の進め方について継続的に見直し・改善を行っています。 居住地や時間的制約に左右されず、それぞれが最も良いパフォーマンスを発揮できる環境を整えることが、結果としてプロダクトの品質や成果につながると考えています。スタイルポートでは、そのための働き方やコミュニケーション設計を大切にしています。 メンバーシップとコミュニケーション 私たちは、役割や立場に関わらず、前提や懸念、意見を率直に共有し、建設的な議論を通じて判断を前に進めることを大切にしています。必要な論点や異論は遠慮なく出し合い、より良い判断につながる議論を歓迎します。 議論の背景や判断内容が一部の人に閉じないよう、ほとんどの議論はドキュメントとして整理し、WikiやSlackなどを通じて共有しています。これにより、誰もが同じ前提で議論や判断に参加できる状態を保っています。 日々のショートミーティングやハドルを通じて、判断の詰まりや不明点を早期に解消し、リモート環境でもフットワークの軽いコミュニケーションを実現しています。 また、必要に応じて対面で集中的な議論を行うなど、状況に応じたコミュニケーションの形を取り入れています。 より楽しい開発体験のために プロダクトグループでは、開発をスムーズに進めるための基盤を整えつつ、状況に応じて改善し続けることを大切にしています。決められたやり方に固執するのではなく、より良い開発体験につながるのであれば、変更や見直しを前向きに行います。 具体的には、コーディングルールやGitブランチ戦略の整備、構造化されたドキュメンテーション、非同期コミュニケーションを前提とした情報共有などを通じて、日々の開発が滞りなく進む環境を整えています。 また、AmplifyやGitHub Actionsを用いた高頻度デプロイ、GitHubでのPR・コードレビュー、CI環境の整備などにより、変更を素早く安全にリリースできる体制を構築しています。タスク管理にはGitHub Projectを用い、チケットベースで開発を進めています。 使用するライブラリや技術スタックは定期的に見直し、必要に応じてリファクタリングや移行を行います。FigmaやMiroなどの効率化ツールの導入、開発者が好みのOSやエディタを選べる環境づくりも、その一環です。 これらは取り組みの一例に過ぎません。プロダクトグループでは、開発環境の膠着化を避け、メンバーからの提案や改善を取り入れながら、より効率的で楽しい開発体験を更新し続けていきます。