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
Facebookのフロントエンド開発
Search
boiyama
December 21, 2017
Technology
7
4.5k
Facebookのフロントエンド開発
We Are JavaScripters! @14th【初心者歓迎LT大会】
https://wajs.connpass.com/event/72611/
用のスライドです
boiyama
December 21, 2017
Tweet
Share
More Decks by boiyama
See All by boiyama
Reproのビジネスサイドを支えるJS
boiyama
0
170
バックオフィスに行ったソフトウェアエンジニアの業務効率化事例
boiyama
1
260
2018年、IE6対応サイトを作る
boiyama
4
980
ヤバいESLint/TSLintルール作っちゃったかもしれない
boiyama
0
1.5k
チームをCQRS
boiyama
1
1.5k
フロントエンドのサーバーレス SSR編
boiyama
0
700
Serverless for Front-end Server-Side Rendering
boiyama
1
110
Learning Elm in JS
boiyama
1
550
JSでElmを学ぶ
boiyama
0
97
Other Decks in Technology
See All in Technology
生成AIを活用したZennの取り組み事例
ryosukeigarashi
0
170
GA technologiesでのAI-Readyの取り組み@DataOps Night
yuto16
0
230
about #74462 go/token#FileSet
tomtwinkle
1
260
いまさら聞けない ABテスト入門
skmr2348
0
170
自作LLM Native GORM Pluginで実現する AI Agentバックテスト基盤構築
po3rin
2
210
Oracle Cloud Infrastructure:2025年9月度サービス・アップデート
oracle4engineer
PRO
0
310
Goのビルドシステムの変遷 / The history of Go's build system
ymotongpoo
12
3.4k
PLaMoの事後学習を支える技術 / PFN LLMセミナー
pfn
PRO
9
3.2k
今日から始めるpprof / Pprof workshop for beginners
ymotongpoo
6
780
2重リクエスト完全攻略HANDBOOK / Double Request Handbook
shoheimitani
5
7.1k
Go Conference 2025: GoのinterfaceとGenericsの内部構造と進化 / Go type system internals
ryokotmng
3
540
“2件同時配達”の開発舞台裏 〜出前館PMが挑んだダブルピック実現に向けた体験設計〜
demaecan
0
160
Featured
See All Featured
The Cult of Friendly URLs
andyhume
79
6.6k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
30
9.7k
Six Lessons from altMBA
skipperchong
28
4k
Facilitating Awesome Meetings
lara
56
6.6k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.2k
Making the Leap to Tech Lead
cromwellryan
135
9.5k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Writing Fast Ruby
sferik
629
62k
Building Adaptive Systems
keathley
43
2.8k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
The Art of Programming - Codeland 2020
erikaheidi
56
14k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
Transcript
Facebookのフロントエンド開発 2017.12.21 We Are JavaScripters! @14th
My Profile @boiyaa @boiyaaaaaa Persol P&T Front End Engineer 最近ITスペシャリストとい
うクソダサい肩書きが付 きました。
最近のフロントエンドまわりの仕事ではReactを中心にFacebook の肩に乗っているので、 Facebookでのフロントエンド開発について調べてきました。
StackShareによると、 ライブラリ:React, Flux, Relay ユニットテスト:Jest プロジェクト管理:Phabricator CI: Jenkins IDE: Nuclide
https://stackshare.io/facebook/facebook
カスタマイズしたMercurialの単一リポジトリに全てのコードを格納 https://www.infoq.com/jp/news/2014/01/facebook-scaling-hg
・・・
・・・開発環境の記事がなかなか見つからない。。
OSSの技術についての記事は多いのですが、 Facebook自体の開発については、色々な記事でちょっとずつ言 及されている感じで、まとめるのがかなり大変。 ↓ 弟に聞くか
My Bro’s Profile facebook.com/sota050 Facebook, Inc. Front End Engineer 年収は兄の5倍
早速弟に確認 チームでの開発について公に出せる情報ある? →技術的なツールやワークフローの話ならOK
ということで聞いてきました Facebookの開発現場の作法
Q. パッケージ管理はやっぱりYarnなの? A. 全社でYarnを使っている。 しかしながら、Facebookは必要なモジュールを基本全部内製 していて、しかも単一リポジトリなので落とせば全部入ってるか ら、あまり使う機会がない
Q. Facebook製のものしか使えないの? A. 強制はされていない。 基本的に開発者を信頼しているので、好きなものを選んでい いし、実際Reduxを使ったことはある。 ただ、内製IDEのNuclideが、自社構成だと効率がいいように 作られているので、ほとんどのメンバーがNuclide使って自社 スタックで開発している。
Q. コードの品質管理はどうしてる? A. Flowで型チェック ESLintはeslint-config-fbjsと同じ。社内ルールをOSS化したも のがeslint-config-fbjs テストはJest また、誰でも全てのコードにアクセスできるので、Phabricator を通じて他の人もコードレビューする。
Q. YarnとかJestって結構最近のだけど全部書き換えたの? A. Facebookではそういう意思決定がよくある。 1週間でソースがほとんど変わることがよくある。 これもFacebook製ツールのCodemodを使っている。
Q. バンドラは何使ってるの? A. モジュールバンドラは内製。 webpackのように1ファイルにまとめたりはしていない。 ユーザー個々の画面状態にあわせて必要なモジュールを動 的にロードしている。
この辺も気になるところです 環境面とか。機材、デスク、食堂、備品とか どんな開発チームをマネジメントしてるのかとか 日本に仕事ないかとか ↓ 本人呼んでるので直接聞いてみましょう
最後に、Facebookの開発者になる方法 必須 • 英語力 • インタビューの練習 • インターン • アルゴリズムの知識
Sotaのパターン →LTに収まらないので忘年会で聞いてみてください
Thank you for your attention