node.js勉強会 framework koa
DESCRIPTION
Node.js勉強会 Framework KoaについてのスライドですTRANSCRIPT
Framework KoaNode.js勉強会
2014.2.8
自己紹介
• かみやん (Twitter@kamiyam)
http://nantokaworks.com
• Engineer
• だいたい Node.js の人
• たまにカメラの人
Framework Koa
KoaKoa is a new web framework designed by the team behind Express, which aims to be a smaller, more expressive, and more robust foundation for web applications and APIs. Through leveraging generators Koa allows you to ditch callbacks and greatly increase error-handling.
Koa does not bundle any middleware within core, and provides an elegant suite of methods that make writing servers fast and enjoyable.
Via. http://koajs.com/
Expressの次のフレームワーク?
現在 Express がNode.jsのスタンダードな
Frameworkだが、そのExpress チームが積極的に開発が関わっている。
Expressではダメなのか?
Express(というかNode.js/JavaScript)では 、
コールバックが多階層構成となりやすく(コールバック地獄)、エラーハンドリングが煩雑となる。
遠い昔に書いた(描いた?)<script> // document ready $(function(){ var $target = $(".initAnimetion"); $target.fadeIn( "slow" ); setTimeout( 2*1000 ); //delay $target.fadeOut( "slow” ); console.log( "completed!!!" ); }); </script>
Hello JavaScript??
コールバック地獄// document ready $(function(){ var $target = $(".initAnimetion”); $target.fadeIn( "slow", function() { setTimeout(function(){ $target.fadeOut( "slow", function() { console.log( "completed!!!" ); }) }), 2*1000 ); //2秒待つ }); });
Hello Callback Hell!!!http://callbackhell.com/
http://codepen.io/kamiyam/details/kDxrw
他言語での実行イメージ!var result= getHttpResponse(“http://example.com”);・・・① var geo = getGeoLocale( result.local );・・・② response.send( geo.json );・・・③
Koaならイケてるのか?
“generator/yield” を使い
簡潔に “middleware”を書くことが出来る
Koa要件
"scripts": { "start": "node --harmony app.js" }
$ alias node='node --harmony'
package.json
To use Koa you must be running node 0.11.9 or higher for generator support
Koa samplevar koa = require('koa'), app = koa(); app.use(function *() { // Here is the important bit of application logic for this example. // We make use of a series of async operations without callbacks. var city = yield geolocation.getCityAsync(this.req.ip);・・・① var forecast = yield weather.getForecastAsync(city);・・・② this.body = 'Today, ' + city + ' will be ' + forecast.temperature + ' degrees.';・・・③ }); app.listen(8080);
Via. http://blog.stevensanderson.com/2013/12/21/experiments-with-koa-and-javascript-generators/
え?JavaScriptなのに同期処理?
同期処理処理内容 処理時間
処理①
処理②
処理③
※ 前述サンプルのような処理の結果を以って次の処理を行う場合は別
同時に実行出来る処理は実行してしまいたい完了
半非同期処理処理内容 処理時間
処理①
処理②
処理③
それぞれの処理を同時に実行し、一番遅い処理が完了するまで他は待機
完了
Koa sampleapp.use(function *() { var tasks = { imposeMinimumResponseTime: delay(500), fetchWebPage: doHttpRequest('http://example.com/'), squareTenSlowly: getSquareValueThunk(10) }; // All of the operations have already started. Yielding // the key-value object to Koa just makes it wait for them. var results = yield tasks; this.body = 'OK, all done.'; this.body += '\nResult of waiting is: ' + results.imposeMinimumResponseTime; // ① Displays: undefined this.body += '\nWeb page status code is: ' + results.fetchWebPage.statusCode; // ② Displays: Typically 200 in this case this.body += '\nSquare of ten is: ' + results.squareTenSlowly; // ③ Displays: 100 });
Via. http://blog.stevensanderson.com/2013/12/21/experiments-with-koa-and-javascript-generators/
generator/yield?
generator/yield
generator/yield は EcmaScrpt6 (ES6) で規格化されている機能の一つである。
generator/yield!function *getAllSquareNumbers() { for (var i = 1; ; i++) { yield i * i; } } !var generator = getAllSquareNumbers(); console.log(generator.next().value); // Outputs '1' console.log(generator.next().value); // Outputs '4' console.log(generator.next().value); // Outputs '9' console.log(generator.next().value); // Outputs '16'
Via. http://blog.stevensanderson.com/2013/12/21/experiments-with-koa-and-javascript-generators/
generator/yieldは
直交で処理を動作させることの出来るIterator
middleware?
middlewaremiddlewareは(Web)アプリケーションの中間層を受け持つ。
例) ログイン管理やリダイレクト処理などのフィルター的機能など。
Expressではconnect という名称で処理を実装する仕組みを持っている。
ghost 301 redirect
https://gist.github.com/kamiyam/649fb9c12ef83ced920b
//for wordpress permlink import articles app.use(function redirect301 ( req, res, next ){ ! var querys = { p: req.query["p"], page: req.query["page_id"] } ! // console.log("access to: " + req.headers.host); if ( querys.p || querys.page ){ var redirect = "http://" + req.headers.host; if ( querys.p ){ redirect += "/p" + querys.p + ""; } else if( querys.page ){ redirect += "/page" + querys.page + ""; } // console.log("301 redirect: " + redirect + req.headers.url + "=>" + redirect ); res.writeHead(301, {"Location": redirect, 'Expires': (new Date).toGMTString()}); res.end(); ! } else { next(); } });
非同期処理の例外処理
Via. http://techblog.yahoo.co.jp/programming/javascript_error/
<script> try { // console.log("hello !!"); throw new Error("error"); } catch(e){ console.log(e); } ! try{ setTimeout(function(){ // console.log("hello callback"); throw new Error("callback error"); }, 2 * 1000) } catch(e){ console.log(e); } </script>
response
middlewarerequest
next();
middleware middleware middlewaremiddleware
responseresponseresponse
error
next(); next();
error
_人人人人人人人人人人_ > 忘れられたエラー < ‾Y^Y^Y^Y^Y^Y^Y^Y^Y‾
それぞれのエラー処理
Koa log middleware// x-response-time !app.use(function *(next){ var start = new Date; yield next; var ms = new Date - start; this.set('X-Response-Time', ms + 'ms'); });
Via. http://dailyjs.com/2014/01/09/koa/
response
middlewarerequest
yield next;
middleware middleware middlewaremiddleware
responseresponseresponse
var start = new Date;
var ms = new Date - start;
error
yield next; yield next;
error errortry catch(e)
generator/yieldを活用するKoaは ミドルウェアの実装、エラー処理を楽にしてくれる
今後Express はどうなる?
すぐKoaに取って代わるものではない
( Node.js v0.12.x でGenerator の標準実装は見送り )
ただし、koaモジュールの拡張に伴って
Express/Connect から置き換わる???
改めてKoaについてまず、Generetor/Yield は自身のコードの書き方すら変えてしまうものである。
Koaが新しい仕組みを勝手に提供してくれるのではなく、いままで通りの書き方をするだけではあまり従来のものと変わりがない(ように見えてしまう)。
Generetor/Yieldを活用出来るフレームワークであるため、それらをうまく使いこなすことが重要。
Koa モジュール
• koa-static 静的ファイル
• koa-routeURLルーティング
• co-views Viewエンジン
etc...
ベースとなるコア以外モジュールとして拡張していく
まとめ
• Koa は Generator/Yield を利用するフレームワーク
• Generator/Yield は並行処理を実行出来るIterator
• Koaはmiddlewareの実装を簡素化するスケルトン
• Cascading/upstreamの話もある
参考 ~Koa編~• from scratch - koa入門
http://yosuke-furukawa.hatenablog.com/entry/2013/12/26/125351
• DailyJS - Is Koa the Future of Node Frameworks?http://dailyjs.com/2014/01/09/koa/
• かずぽんブログ - 新しいWebフレームワーク Koa について http://blog.kazupon.jp/post/71041135220/koa
• Steven Sanderson's blog - Experiments with Koa and JavaScript Generatorshttp://blog.stevensanderson.com/2013/12/21/experiments-with-koa-and-javascript-generators/
• Flowery - KoaとJavaScriptのジェネレーターを試す
(Experiments with Koa and JavaScript Generators 日本語訳)http://yukihr.github.io/blog/2013/12/31/experiments-with-koa-and-javascript-generators-ja/
参考 ~Generator/Yield編~• テック煮ブログ - Node.js 0.12 では yield が使えるので
コールバック地獄にサヨナラできる話http://tech.nitoyon.com/ja/blog/2013/06/27/node-yield/
• PHP5.5新機能「ジェネレータ」初心者入門 by @kwatch http://www.slideshare.net/kwatch/php55
• Python Snippets -ジェネレータ関数とyield http://python.civic-apps.com/generator/
• JavaScriptと非同期のエラー処理http://techblog.yahoo.co.jp/programming/javascript_error/
ご清聴ありがとうございました