Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
データグループにおけるフロントエンド開発
Search
LINEヤフーTech (LY Corporation Tech)
PRO
July 02, 2025
Technology
0
18
データグループにおけるフロントエンド開発
2025年6月11日に開催された中途採用向けフロントエンドエンジニア採用説明会で投影したデータグループにおけるフロントエンド開発の紹介スライドです。
LINEヤフーTech (LY Corporation Tech)
PRO
July 02, 2025
Tweet
Share
More Decks by LINEヤフーTech (LY Corporation Tech)
See All by LINEヤフーTech (LY Corporation Tech)
Yahoo!しごとカタログ 新しい境地を創るエンジニア募集!
lycorptech_jp
PRO
0
33
Yahoo!知恵袋におけるフロントエンド開発
lycorptech_jp
PRO
0
32
"LINE Planet" and AI: Conversations with AI
lycorptech_jp
PRO
0
29
Seamless inventory management with AI
lycorptech_jp
PRO
0
16
AI Frontiers Revealed: Transforming LINE Shopping TW with LLM-Driven Product Attribute Extraction
lycorptech_jp
PRO
0
27
LINEヤフーの音声AIがもたらす未来:ASR/TTSと対話技術の新たな可能性 / LY Corporation's Speech AI Vision: Towards Realtime Spoken Dialogue through Advanced ASR and TTS
lycorptech_jp
PRO
0
32
「Yahoo!検索」におけるWebパフォーマンス改善の取り組み / Efforts to Improve Web Performance in "Yahoo! JAPAN Search"
lycorptech_jp
PRO
0
41
アクセシビリティ改善の実践:プロダクトにおける具体的な取り組みと課題 / Practices for Accessibility Improvement: Specific Efforts and Challenges in Products
lycorptech_jp
PRO
0
36
「PayPayゲートウェイ」におけるStorybook活用事例 / Introducing Storybook: Enhancing Development in "PayPay Gateway"
lycorptech_jp
PRO
0
39
Other Decks in Technology
See All in Technology
React開発にStorybookとCopilotを導入して、爆速でUIを編集・確認する方法
yu_kod
1
240
「クラウドコスト絶対削減」を支える技術—FinOpsを超えた徹底的なクラウドコスト削減の実践論
delta_tech
4
150
生まれ変わった AWS Security Hub (Preview) を紹介 #reInforce_osaka / reInforce New Security Hub
masahirokawahara
0
450
Delegating the chores of authenticating users to Keycloak
ahus1
0
140
MobileActOsaka_250704.pdf
akaitadaaki
0
110
American airlines ®️ USA Contact Numbers: Complete 2025 Support Guide
airhelpsupport
0
360
開発生産性を測る前にやるべきこと - 組織改善の実践 / Before Measuring Dev Productivity
kaonavi
6
1.9k
Geminiとv0による高速プロトタイピング
shinya337
0
260
ビズリーチにおけるリアーキテクティング実践事例 / JJUG CCC 2025 Spring
visional_engineering_and_design
1
110
自律的なスケーリング手法FASTにおけるVPoEとしてのアカウンタビリティ / dev-productivity-con-2025
yoshikiiida
1
15k
PO初心者が考えた ”POらしさ”
nb_rady
0
190
ゼロからはじめる採用広報
yutadayo
2
690
Featured
See All Featured
Building an army of robots
kneath
306
45k
How STYLIGHT went responsive
nonsquared
100
5.6k
Fireside Chat
paigeccino
37
3.5k
Agile that works and the tools we love
rasmusluckow
329
21k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.4k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
Navigating Team Friction
lara
187
15k
Six Lessons from altMBA
skipperchong
28
3.9k
Optimizing for Happiness
mojombo
379
70k
Transcript
© LY Corporation © LY Corporation Public データグループにおける フロントエンド開発
LINEヤフー株式会社 データグループ データエンジニアリング統括本部 データプラットフォームサービス本部 UXエンジニアリングチーム 川原 駿
© LY Corporation © LY Corporation Public 川原 駿 LINEヤフー株式会社
データグループ フロントエンドエンジニア 2016 年 ヤフー株式会社に新卒入社 社内向けアクセス解析、検索データ可視化などの内製ツール開発 2023 年 アクセス解析および A/B テストツールを担当するチームのリーダー 2024 年 データ領域の UI/UX やフロントエンド業務を担当するチームのリーダー(現職) 2 / 11
© 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
© LY Corporation © LY Corporation Public グループ内のフロントエンド専門組織として立ち上げ プロダクト開発への直接参画 データ領域プロダクトのフロントエンド開発
上記と通したプロダクト戦略への貢献 グループ内のフロントエンド技術の標準化 ガイドラインの整備と推進 生成 AI x フロントエンドの可能性を探る実験的な取り組み グループ内の一部範囲での活動からスタートし、 今後はグループ全体のフロントエンド開発組織への発展を目指しています。 UX エンジニアリングチームについて 4 / 11
© LY Corporation © LY Corporation Public プロダクト紹介(一例) フルマネージド ETL
ワークフローエンジン サービス DB から分析環境にデータをコピーするツール データ分析者が複雑なコードを書かずにデータ収集を行える ログ設計ツール ログの形式や構造を設計・管理するためのツール ログ設計を標準化し、レビューや履歴管理コストを削減する ターゲティング通知ツール 特定の属性や行動履歴を持つユーザーにプッシュ通知を配信するツール サービス独自で通知システムの実装をする必要がなくなる 5 / 11
© 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
© LY Corporation © LY Corporation Public 開発・レビューなどの作業に集中しやすい体制 メンバー毎に担当プロダクトを決め、FE エンジニアとしてアサイン
プロダクトにより開発体制は異なる BE エンジニア/デザイナー/プロダクトマネージャーと密に連携して開発 とあるメンバーのスケジュール例 担当プロダクトの活動(2 週間サイクルのイテレーションを採用) スタンドアップ(朝会) :週 2 回 プランニング:隔週 1 回 UX エンジニアリングチームの活動 チーム会:週 1 回 1on1:週 1 回 開発体制・プロセス 7 / 11
© LY Corporation © LY Corporation Public 自分のやりたいこと、アイデアを積極的に取り入れられる環境 UXE Front-end
Weekly 最新のフロントエンド動向を週次でキャッチアップ・読み合わせ会を実施 共有内容例 組織内で広く使われているライブラリのバージョンアップ情報 Figma の新機能 生成 AI x フロントエンド関連の情報 その他、フロントエンドの知見になりそうな記事なら何でも UX エンジニアリングチームの文化 8 / 11
© LY Corporation © LY Corporation Public 通常のサービス開発とは異なる面白さと成長機会がある 複雑なデータをわかりやすく伝える UI/UX
の実現 非常に複雑なデータプラットフォームの操作を直感的にする UI/UX 設計 専門知識がなくても使いやすいインターフェースの実現 ユーザーである社員との距離が圧倒的に近い 社内ユーザーと直接コミュニケーションを取りながら開発できる環境 改善要望を取り入れた効果をすぐに確認することもできる データ領域への理解が深まる環境 ビッグデータ処理や分析基盤など、FE としては珍しい領域に関わる経験 LINE ヤフーが保有する国内最大級のデータ規模を間近で見られる環境 データ領域のフロントエンドの魅力 9 / 11
© LY Corporation © LY Corporation Public こんな方に来てほしい 「技術」も「プロダクト」も両方追求したい 「技術的チャレンジをしたい!」し「ユーザーに価値も届けたい!」
主体的に課題解決に取り組みたい 「これ、もっとこうしたらいいかも!」と思ったことを提案・実装したい 新しいことに前向きにチャレンジできる 最新技術のキャッチアップや、実課題への応用を楽しめる 10 / 11
© LY Corporation © LY Corporation Public Thank You