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
18
"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
Lazy application authentication with Tailscale
bluehatbrit
0
170
KiCadでPad on Viaの基板作ってみた
iotengineer22
0
290
Core Audio tapを使ったリアルタイム音声処理のお話
yuta0306
0
190
OPENLOGI Company Profile
hr01
0
67k
American airlines ®️ USA Contact Numbers: Complete 2025 Support Guide
airhelpsupport
0
360
ビズリーチにおけるリアーキテクティング実践事例 / JJUG CCC 2025 Spring
visional_engineering_and_design
1
110
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
27k
2025-07-06 QGIS初級ハンズオン「はじめてのQGIS」
kou_kita
0
160
Oracle Database@Google Cloud:サービス概要のご紹介
oracle4engineer
PRO
0
110
生成AI開発案件におけるClineの業務活用事例とTips
shinya337
0
240
United Airlines Customer Service– Call 1-833-341-3142 Now!
airhelp
0
160
AI導入の理想と現実~コストと浸透〜
oprstchn
0
190
Featured
See All Featured
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
Faster Mobile Websites
deanohume
307
31k
A designer walks into a library…
pauljervisheath
207
24k
Build The Right Thing And Hit Your Dates
maggiecrowley
36
2.8k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.7k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
How to Ace a Technical Interview
jacobian
277
23k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.7k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
GitHub's CSS Performance
jonrohan
1031
460k
Making Projects Easy
brettharned
116
6.3k
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 (採用説明)