データグループにおけるフロントエンド開発

2025年6月11日に開催された中途採用向けフロントエンドエンジニア採用説明会で投影したデータグループにおけるフロントエンド開発の紹介スライドです。

Transcript

1. © LY Corporation © LY Corporation Public データグループにおける フロントエンド開発         LINEヤフー株式会社 データグループ データエンジニアリング統括本部 データプラットフォームサービス本部 UXエンジニアリングチーム 川原 駿
2. © LY Corporation © LY Corporation Public 川原 駿 LINEヤフー株式会社 データグループ フロントエンドエンジニア   2016 年 ヤフー株式会社に新卒入社 社内向けアクセス解析、検索データ可視化などの内製ツール開発 2023 年 アクセス解析および A/B テストツールを担当するチームのリーダー 2024 年 データ領域の UI/UX やフロントエンド業務を担当するチームのリーダー（現職） 2 / 11
3. © LY Corporation © LY Corporation Public 特定のサービスに属さず、全社横断のデータ利活用に取り組む組織 主に 3 つの統括本部で構成 データエンジニアリング: システム基盤の構築、DB の性能向上など データサービス: データ収集、データマネジメント、データの整形など データサイエンス: サービス向けのデータサイエンス、新技術の研究開発など 膨大な量のデータを扱える環境 LINE: 9,000 万 MAU Yahoo! JAPAN: 8,000 万 MAU 安心・安全・簡単にデータを利活用するための、さまざまなプロダクトを開発 参考：データ活用により LINE ヤフーをさらに飛躍させる。データグループの 2 人の雄が未来を語る ｜ LINE ヤフー採用 https://note.com/lycorp_recruit/n/n24f4a054c85b データグループについて 3 / 11
4. © LY Corporation © LY Corporation Public グループ内のフロントエンド専門組織として立ち上げ プロダクト開発への直接参画 データ領域プロダクトのフロントエンド開発 上記と通したプロダクト戦略への貢献 グループ内のフロントエンド技術の標準化 ガイドラインの整備と推進 生成 AI x フロントエンドの可能性を探る実験的な取り組み グループ内の一部範囲での活動からスタートし、 今後はグループ全体のフロントエンド開発組織への発展を目指しています。 UX エンジニアリングチームについて 4 / 11
5. © LY Corporation © LY Corporation Public プロダクト紹介（一例） フルマネージド ETL ワークフローエンジン サービス DB から分析環境にデータをコピーするツール データ分析者が複雑なコードを書かずにデータ収集を行える ログ設計ツール ログの形式や構造を設計・管理するためのツール ログ設計を標準化し、レビューや履歴管理コストを削減する ターゲティング通知ツール 特定の属性や行動履歴を持つユーザーにプッシュ通知を配信するツール サービス独自で通知システムの実装をする必要がなくなる 5 / 11
6. © LY Corporation © LY Corporation Public 一般的なものに加え、社内ツールの特性に合わせた技術を採用 技術スタックの代表例（プロダクトごとに異なる） Vue.js/Nuxt.js, React/Next.js, TypeScript Vite, GitHub Actions, Screwdriver.cd Vitest, Vue Testing Library, Playwright/Cypress ESLint, Prettier, Stylelint 社内ツールの特性 SEO 不要のため、SSR なしの SPA として実装 技術選定の自由度が高く、最新技術を試しやすい（例: Nuxt4 のフラグ ON） 中長期的には部分的な標準化を進めていきたいと考えています。 フロントエンド技術について 6 / 11
7. © LY Corporation © LY Corporation Public 開発・レビューなどの作業に集中しやすい体制 メンバー毎に担当プロダクトを決め、FE エンジニアとしてアサイン プロダクトにより開発体制は異なる BE エンジニア/デザイナー/プロダクトマネージャーと密に連携して開発 とあるメンバーのスケジュール例 担当プロダクトの活動（2 週間サイクルのイテレーションを採用） スタンドアップ（朝会） ：週 2 回 プランニング：隔週 1 回 UX エンジニアリングチームの活動 チーム会：週 1 回 1on1：週 1 回 開発体制・プロセス 7 / 11
8. © LY Corporation © LY Corporation Public 自分のやりたいこと、アイデアを積極的に取り入れられる環境 UXE Front-end Weekly 最新のフロントエンド動向を週次でキャッチアップ・読み合わせ会を実施 共有内容例 組織内で広く使われているライブラリのバージョンアップ情報 Figma の新機能 生成 AI x フロントエンド関連の情報 その他、フロントエンドの知見になりそうな記事なら何でも UX エンジニアリングチームの文化 8 / 11
9. © LY Corporation © LY Corporation Public 通常のサービス開発とは異なる面白さと成長機会がある 複雑なデータをわかりやすく伝える UI/UX の実現 非常に複雑なデータプラットフォームの操作を直感的にする UI/UX 設計 専門知識がなくても使いやすいインターフェースの実現 ユーザーである社員との距離が圧倒的に近い 社内ユーザーと直接コミュニケーションを取りながら開発できる環境 改善要望を取り入れた効果をすぐに確認することもできる データ領域への理解が深まる環境 ビッグデータ処理や分析基盤など、FE としては珍しい領域に関わる経験 LINE ヤフーが保有する国内最大級のデータ規模を間近で見られる環境 データ領域のフロントエンドの魅力 9 / 11
10. © LY Corporation © LY Corporation Public こんな方に来てほしい 「技術」も「プロダクト」も両方追求したい 「技術的チャレンジをしたい！」し「ユーザーに価値も届けたい！」 主体的に課題解決に取り組みたい 「これ、もっとこうしたらいいかも！」と思ったことを提案・実装したい 新しいことに前向きにチャレンジできる 最新技術のキャッチアップや、実課題への応用を楽しめる 10 / 11
11. © LY Corporation © LY Corporation Public Thank You