Facebookのフロントエンド開発

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

Facebookのフロントエンド開発

Facebookのフロントエンド開発

boiyama

More Decks by boiyama

Other Decks in Technology

Featured

Transcript