Koa 正在等一個人

Koa Is Just Waiting For You

Fred Chien

Fred Chien錢逢祥

cfsghostAt Github

fred-zoneblogspot.com

Open Source Developer

HanGee蕃薯哥

HanGee蕃薯哥

Koa？苦啊？

討論 Koa 之前

最近什麼最潮

？

Node.js v.s. io.js0.12 的搶先釋出大戰

ECMAScript 6Generator

Node.js 0.11.9+Generator

使用 ES6 的方法

node --harmony

初入 GeneratorHow to write a generator?

Generator 的使用流程

1. 宣告 Generator 函數2. 建立 Generator 物件3. 執行 Generator 內部流程

Generator 的使用方法

function* myGenerator() { console.log('My Generator!');}

var generator = myGenerator();generator.next();

設計流程

With Generator

Generator 的基本流程設計

function* myGenerator() { console.log('My Generator!'); yield console.log('My Generator! Again!'); yield console.log('My Generator! Again! Again!');}

Generator 的回傳與代入值

function* myGenerator() {

console.log('My Generator!');

yield

console.log('My Generator! Again!' );

var input = yield 123;

console.log(input);

}

var generator = myGenerator();

generator.next();

var ret123 = generator.next();

console.log(ret123);

generator.next(':-D');

Generator 的回傳與代入值

function* myGenerator() {

console.log('My Generator!');

yield

console.log('My Generator! Again!' );

var input = yield 123;

console.log(input);

}

var generator = myGenerator();

generator.next();

var ret123 = generator.next();

console.log(ret123);

generator.next(':-D');

Generator 的回傳與代入值

function* myGenerator() {

console.log('My Generator!');

yield

console.log('My Generator! Again!' );

var input = yield 123;

console.log(input);

}

var generator = myGenerator();

generator.next();

var ret123 = generator.next();

console.log(ret123);

generator.next(':-D');

想像這是 setImediate() setTimeout()

長得 Sync 樣卻有 Async 骨

Generator

Koa 起手式

npm install koa

First Examplevar koa = require('koa');

// 建立一個網站伺服器

var app = koa();

// 當有瀏覽器要求頁面時，進行處理

app.use(function *() {

// 回應文字內容給瀏覽器

this.body = 'My First Koa Web' ;

});

// 監聽 3000

app.listen(3000);

Routingnpm install koa-route

Routingvar koa = require('koa');

var route = require( 'koa-route');

// 建立一個網站伺服器

var app = koa();

// 當有瀏覽器要求 /test 頁面時，進行處理

app.use(route.get( '/test', function *() {

// 回應文字內容給瀏覽器

this.body = 'Testing Page!';

}));

// 監聽 3000

app.listen(3000);

Data TransferQuery String, body, parameters

Query Stringvar koa = require('koa');

var route = require( 'koa-route');

// 建立一個網站伺服器

var app = koa();

// 當有瀏覽器要求 /test 頁面時，進行處理

app.use(route.get( '/test', function *() {

// 回應 Query String 的 hackathon 欄位內容給瀏覽器

this.body = this.query.hackathon;

}));

// 監聽 3000

app.listen(3000);

Body Parsernpm install koa-bodyparser

Bodyvar koa = require('koa');

var route = require('koa-route');

var bodyParser = require('koa-bodyparser');

// 建立一個網站伺服器

var app = koa();

app.use(bodyParser());

// 當有瀏覽器使用 POST 方法要求 /test 頁面時，進行處理

app.use(route.post('/test', function *() {

// 回應 BODY 的 hackathon 欄位內容給瀏覽器

this.body = this.request.body.hackathon;

}));

// 監聽 3000

app.listen(3000);

Parametersvar koa = require('koa');

var route = require( 'koa-route');

// 建立一個網站伺服器

var app = koa();

// 當有瀏覽器要求 /test 頁面時，進行處理

app.use(route.get( '/test/:hackathon' , function *(hackathon) {

// 回應 hackathon parameter 內容給瀏覽器

this.body = hackathon;

}));

// 監聽 3000

app.listen(3000);

靜態頁面支援

npm install koa-static

Staticvar koa = require('koa');

var serve = require( 'koa-static');

// 建立一個網站伺服器

var app = koa();

app.use(serve('./public'));

// 監聽 3000

app.listen(3000);

模板引擎

npm install co-views

Template Enginevar koa = require('koa');

var views = require( 'co-views');

// 建立模板渲染器，指定模板目錄及格式（以 jade 為例）

var render = views(__dirname + '/views', { ext: 'jade' });

// 建立一個網站伺服器

var app = koa();

// 找到 home.jade ，畫出並輸出頁面給瀏覽器

app.use(function *() {

this.body = yield render( 'home', { message: 'Koa is great!' });

});

// 監聽 3000

app.listen(3000);

Jade Template (home.jade)p #{message}

Sessionnpm install koa-session

Session Mechanism Initializingvar koa = require('koa');

var session = require( 'koa-session');

// 建立一個網站伺服器

var app = koa();

// 自訂或以亂數設定一組加密金鑰

app.keys = [ 'asdfghjkl!@#$%ASDFGHJ' ];

// 初始化 Session

app.use(session());

Session Usageapp.use(function *() {

// 將 Session 中 count 屬性的數字累加

var n = this.session.count || 0;

n++;

this.session.count = n;

// 將 Session 中 count 屬性內容回傳給客戶端

this.body = this.session.count;

});

Questions?

Thanks