Slide 1
Slide 1 text
チーム開発において
Node未経験者の学習コストを下げる工夫
株式会社サイバーエージェント
森 久太郎 (もり きゅうたろう)
Twitter/Github: @qsona
2015/10/8 Node学園 18時限目 「Node.js v4.0の話」 LT
Slide 2
Slide 2 text
Node v4 リリース
おめでとうございま
す！！！！！！！１１１
Slide 3
Slide 3 text
提案。
「フツウ」の
サーバサイド開発に
Node.jsを採用しませんか？
- 例えば、PHPの代わりにNode.js
Slide 4
Slide 4 text
「フツウに良い」Node.js
「一旦Nodeでいいじゃん」の流れをつくりたい
- 国内の採用事例はまだまだ少ない
● npmになんでもある
● フロントエンドと同じ言語
● 開発盛ん
● etc
● 速い
● 楽しい
● 導入が楽
● 単体でサーバ立つ
Slide 5
Slide 5 text
仮説
Node.js未経験者にとっての
学習コストが高いため
フツウに採用しにくいのではないか？
Slide 6
Slide 6 text
弊社のNode.js活用事例
● 2011 「ピグライフ」 (0.4系)
○ ※ 「アメーバピグ」はJava
● 2012〜現在 スマホゲームの一部
○ 「ガールフレンド(仮)」などはJava
弊社で多いパターン
● Javaエンジニア => Node.jsエンジニア
● 新卒でいきなりNode.jsエンジニア
学習コストの問題は弊社でも重要
Slide 7
Slide 7 text
直近の成功事例
● フツーのゲームサーバAPI
● 開発・運用期間 約1年
● 関わったサーバエンジニア(延べ): 10人
○ Node経験者: 3人
○ Node未経験者: 7人 (うち6人はJSも未経験)
- 滞り無く開発に入れている
Slide 8
Slide 8 text
いかにして、Node.js未経験者は
Node.jsでのコーディングを手に入れるのか？
未経験者の立場になってみる
Slide 9
Slide 9 text
未経験者がNode.jsを手に入れるまでの道のり例 (1)
● シングルスレッド・イベントループの説明を受ける
● JavaScriptの基本的な文法を覚える
● 簡単なコードを書いてみる
Slide 10
Slide 10 text
未経験者がNode.jsを手に入れるまでの道のり例(1)
xがなぜかundefined...
Slide 11
Slide 11 text
- 2, 3回間違えれば覚える
Slide 12
Slide 12 text
未経験者がNode.jsを手に入れるまでの道のり例(2)
実際に、機能を実装する
● JavaScriptのイディオムやthisと格闘
● こみいったロジックを書く
● 長い非同期処理のコードを書く
この
フェーズが
重要
Slide 13
Slide 13 text
弊社の事例を俯瞰して得た
学習コスト↓↓↓DOWN↓↓↓のための
「4つの極意」
Slide 14
Slide 14 text
極意その1
lodash を利用する
(極意って言えるのか・・・？)
Slide 15
Slide 15 text
lodashを利用する
こみいった処理を書くのを楽にするためのモジュール
● 高機能だがシンプルさを重視
● APIに一貫性がある
○ jdalton による強力で一貫性のある意思決定
- 今から開発始めるなら、packge.jsonのlodashの向き先をgithubの最新にしてお
き、もうすぐ出そうな4.xを待つのがオススメです
Slide 16
Slide 16 text
極意その2
(neo-)async を利用する
Slide 17
Slide 17 text
(neo-)asyncを利用する
非同期コードのフロー制御モジュールの1つ
● Nodeのコールバックスタイルをそのまま扱える
● lodashに近い機能・API (特にneo-async)
● async.waterfallで直列の非同期コードをキレイに書ける
○ 順々(直列)に処理していくことが(フツウの場合には)一番多い
○ neo-async#angelFall: async.waterfallの改良版
Slide 18
Slide 18 text
No content
Slide 19
Slide 19 text
名前はひどいけど動きは better!!
Slide 20
Slide 20 text
極意その3
コーディングスタイル(広義)を
統一する
Slide 21
Slide 21 text
コーディングスタイルを統一する
● プロジェクトの全てのコードが教師になる
● 余計なことで悩まないですむ
- ビギナーにとって良いことずくめ
Slide 22
Slide 22 text
コーディングスタイルを統一する
[再掲]未経験者がNode.jsを手に入れるまでの道のり例(2)
● JavaScriptのイディオムやthisと格闘
● こみいったロジックを書く
● 長い非同期処理のコードを書く
- 共通点: いろんな書き方ができる
Slide 23
Slide 23 text
いろんな書き方ができる(例1 JavaScript)
undefinedであるかのチェック
1. x === undefined
2. x === void 0
3. typeof x === 'undefined'
4. _.isUndefined(x)
Slide 24
Slide 24 text
いろんな書き方ができる(例2 lodash)
lodashのメソッド findの使い方
var objs = [{ x: 1, y: 2 }, { x: 2, y: 1 }];
1. _.find(objs, function(obj) { return obj.x === 2; });
2. _.find(objs, { x: 2 });
3. _.find(objs, ‘x’, 2);
Slide 25
Slide 25 text
いろんな書き方ができる(例3 async)
非同期の直列コードのasyncを使った書き方
plain (asyncを使わない)
async.series
async.waterfall 1 (採用)
async.waterfall 2
Slide 26
Slide 26 text
No content
Slide 27
Slide 27 text
No content
Slide 28
Slide 28 text
いろんな書ｋ
数値の切り捨て
var x = 1.4;
● Math.floor(x);
● x | 0;
● _.floor(x);
● ~~x;
● parseInt(x);
● x & x;
● x >> 0;
● x - x % 1;
● x << 0;
● x >>> 0;
● +/(.*?)\./.exec(x+'.')[1];
Slide 29
Slide 29 text
全部思いつくのに1時間かかった
Slide 30
Slide 30 text
No content
Slide 31
Slide 31 text
いろんな書き方ができる。
● Best 100点の書き方で統一
● Better 70点の書き方で統一
● Bad 100点の書き方と70点の書き方が混在
- 100点に近いルールに近づけるには？
Slide 32
Slide 32 text
極意その4
書き方オタクを養成する
Slide 33
Slide 33 text
書き方オタクとは
やたらとコードの書き方にこだわりがあり、詳しい人
● JavaScript オタク
● lodash オタク
● async オタク
Slide 34
Slide 34 text
ルール作りと知識
ルール作りにはある程度の知識が必要
● x === undefined
○ var undefined = 1; される危険性
● x === void 0
● typeof x === 'undefined'
○ ReferenceErrorを握りつぶす危険性
● _.isUndefined(x)
「短い・分かりやすい」が基本
Slide 35
Slide 35 text
開発リーダー !== 書き方オタク
開発リーダー
● 大方針・設計を決める
● 設計のレビュー
書き方オタク
● 書き方の提案・共有 (積極的に！)
● JavaScript自体のコードレビュー
Slide 36
Slide 36 text
ルールを徹底する(1)
開発初期が非常に重要
● 書き方を揃える文化の醸成
● 書き方の共有
● 良い書き方の議論
● 徹底したコードレビュー
Slide 37
Slide 37 text
ルールを徹底する(2)
未経験者の初PRは徹底的にレビュー
JavaScriptについての
レビュー
非同期コードについての
レビュー
Slide 38
Slide 38 text
ルールを徹底する(2)
未経験者の初PRは徹底的にレビュー
lodashの使い方
についてのレビュー
Slide 39
Slide 39 text
ルールを徹底する(3)
Q. x === undefined がチームの慣例。
_.isUndefined(x)
と書かれたPRが来た。
あなたは突っ込みますか？
Slide 40
Slide 40 text
ゆずってくれ たのむ！！
Slide 41
Slide 41 text
ルールを自動化する
● Lint (jshint/eslint)
● jscs
● コードフォーマッター (js-beautify/esformatter)
○ (多少難があっても)入れたほうがいい！
Slide 42
Slide 42 text
Q.
書き方オタクになって
何かメリットあった？
Slide 43
Slide 43 text
JavaScriptオタクになってよかったこと
● 基盤的な機能の整備で小回り(hack)が利く
○ ログ、エラー処理、テスト、etc…
● 各種モジュールのソースコードを読むのが楽に
Slide 44
Slide 44 text
lodash/asyncオタクになってよかったこと
● OSS活動の
きっかけに
○ 苦手な英語も
少し上達
Slide 45
Slide 45 text
まとめ
● lodash使う
● neo-async使う
● (広義の)コーディングスタイルを統一する
● 書き方オタクを養成する
自信を持って、フツウのサーバサイド開発に
Node.jsを選択しよう!!
Slide 46
Slide 46 text
で、締めたいが・・？
Slide 47
Slide 47 text
疑問
学習コスト以外の問題はないの？
Slide 48
Slide 48 text
苦労・悩み話を深掘りして話します@東京Node学園祭
Nodeでサーバサイド開発を検討されてる方、是非どうぞ！
Slide 49
Slide 49 text
Node.js v4 リリースに
乾杯！！！！！！