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
Yahoo!知恵袋におけるフロントエンド開発
Search
LINEヤフーTech (LY Corporation Tech)
PRO
July 02, 2025
Technology
0
32
Yahoo!知恵袋におけるフロントエンド開発
2025年6月11日に開催された中途採用向けフロントエンドエンジニア採用説明会で投影したYahoo!知恵袋におけるフロントエンド開発の紹介スライドです。
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
データグループにおけるフロントエンド開発
lycorptech_jp
PRO
0
21
"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
整頓のジレンマとの戦い〜Tidy First?で振り返る事業とキャリアの歩み〜/Fighting the tidiness dilemma〜Business and Career Milestones Reflected on in Tidy First?〜
bitkey
2
15k
「良さそう」と「とても良い」の間には 「良さそうだがホンマか」がたくさんある / 2025.07.01 LLM品質Night
smiyawaki0820
1
520
Oracle Database@Google Cloud:サービス概要のご紹介
oracle4engineer
PRO
0
110
SmartNewsにおける 1000+ノード規模 K8s基盤 でのコスト最適化 – Spot・Gravitonの大規模導入への挑戦
vsanna2
0
120
成長し続けるアプリのためのテストと設計の関係、そして意思決定の記録。
sansantech
PRO
0
110
Beyond Kaniko: Navigating Unprivileged Container Image Creation
f30
0
130
asken AI勉強会(Android)
tadashi_sato
0
180
OPENLOGI Company Profile
hr01
0
67k
Core Audio tapを使ったリアルタイム音声処理のお話
yuta0306
0
190
AI専用のリンターを作る #yumemi_patch
bengo4com
5
4.1k
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
i35_267
3
12k
KubeCon + CloudNativeCon Japan 2025 Recap Opening & Choose Your Own Adventureシリーズまとめ
mmmatsuda
0
270
Featured
See All Featured
Speed Design
sergeychernyshev
32
1k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Testing 201, or: Great Expectations
jmmastey
43
7.6k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.7k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Practical Orchestrator
shlominoach
189
11k
How STYLIGHT went responsive
nonsquared
100
5.6k
Why Our Code Smells
bkeepers
PRO
336
57k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
53k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Transcript
© LY Corporation External Use (採用説明) Yahoo!知恵袋における フロントエンド開発 LINEヤフー株式会社 厚東
裕貴
© LY Corporation External Use (採用説明) 2 厚東 裕貴 LINEヤフー株式会社
フロントエンドエンジニア メーカーでスマホアプリ、Webの開発を経験した後、 2022年10月にヤフー株式会社に中途入社 入社後は知恵袋のWebフロントエンド開発を担当し、 現在ではiOSスマホアプリの開発にも従事している © LY Corporation
© LY Corporation External Use (採用説明) Yahoo!知恵袋とは? Yahoo!知恵袋の概要 様々なカテゴリで 疑問や悩みを投稿
知恵やアドバイスを投稿 Q A 3
© LY Corporation External Use (採用説明) Yahoo!知恵袋の歴史 4 Yahoo!知恵袋の概要 2004年
ベータ版提供開始 2005年 正式版リリース 2009年 カテゴリマスター制度開始 2012年 iOSアプリリリース 専門家回答スタート 2016年 企業公式回答スタート 最近 AI回答 AI質問 リリース20周年
© LY Corporation External Use (採用説明) Yahoo!知恵袋の規模 5 Yahoo!知恵袋の概要 引用元:
https://www.lycorp.co.jp/ja/news/release/007875/ 登録利用者数 5,200万人 質問総数 2億8,000万件 回答総数 6億5,000万件以上
© LY Corporation External Use (採用説明) 6 基盤チーム 新規チャレンジ チーム
組織・チーム Yahoo!知恵袋の開発体制
© LY Corporation External Use (採用説明) TypeScript Yahoo!知恵袋を支える技術 7 Yahoo!知恵袋のフロントエンド開発
JavaScript Webpack Sass Node.js Express Jest ESLint Stylelint React Storybook AI Copilot ChatGPT
© LY Corporation External Use (採用説明) FE(フロントエンド)定例 • 週に2回実施 •
知恵袋のフロントエンドエンジニアが全員参加 • FEに関することを話し合う • 開発中の案件の開発相談 • issue議論 • etc. 知恵袋におけるフロントエンド改善活動 8 Yahoo!知恵袋のフロントエンド開発
© LY Corporation External Use (採用説明) FE(フロントエンド)定例 • このような議論をしています 知恵袋におけるフロントエンド改善活動
9 Yahoo!知恵袋のフロントエンド開発 これってどうやって 開発すればいいの? ここのソースコードを キレイにしたい! こういう技術を 導入しませんか? ・ ・ ・
© LY Corporation External Use (採用説明) FE(フロントエンド)定例 • たまに集まって議論します 知恵袋におけるフロントエンド改善活動
10 Yahoo!知恵袋のフロントエンド開発
© LY Corporation External Use (採用説明) FEコーディング規約 • FE定例で議論しながら規約を作成 •
コードの一貫性が保たれる • コードレビュー時の明確な基準となる 知恵袋におけるフロントエンド改善活動 11 Yahoo!知恵袋のフロントエンド開発
© LY Corporation External Use (採用説明) FEコーディング規約 • このようなことを皆で書いています 知恵袋におけるフロントエンド改善活動
12 Yahoo!知恵袋のフロントエンド開発 変数名は キャメルケース にしよう! 使わなくなったコード は消そう! コメントはこう書こう!
© LY Corporation External Use (採用説明) リアーキテクト • 以前はControllerに多くの処理が集中 •
リアーキテクトし処理を各層に分散 • 可読性向上 • ユニットテストの記述コスト低減 • これらの層の役割も全て コーディング規約に記載 知恵袋におけるフロントエンド改善活動 13 Yahoo!知恵袋のフロントエンド開発 Controller Controller Scenario Service Application Service Model Utility
© LY Corporation External Use (採用説明) Yahoo!知恵袋のフロントエンドメンバーによる登壇など • JSConf JP
• ステップバイステップで進めるYahoo!知恵袋のフロントエンドリアーキテクト https://speakerdeck.com/l1lhu1hu1/sutetupubaisutetupudejin-meruyahoo-zhi-hui- dai-nohurontoendoriakitekuto • LINEヤフー Tech Blog • Yahoo!知恵袋 フロントエンドをリアーキテクトしている話 https://techblog.lycorp.co.jp/ja/20240527a • ポッドキャスト • https://uit-inside.linecorp.com/episode/158 • https://uit-inside.linecorp.com/episode/172 知恵袋メンバーの登壇 14 Yahoo!知恵袋のフロントエンド開発
© LY Corporation External Use (採用説明) エントリーをお待ちしています!
© LY Corporation External Use (採用説明)