小弟的規劃表 - http://blog.kerkerj.in/blog/2014/11/01/planning/
好讀版 - http://blog.kerkerj.in/blog/2014/10/10/api-d10/
今天就要來安裝主角之一的 Express 了!
一樣開啟虛擬機器我應該是可以不用多說了 XD
先確認自己的 node 是不是 NVM 的 node 喲
$ cd /vagrant/
$ mkdir API
$ cd API/
$ npm init
就會產生 package.json 了!
// 在專案目錄底下 (/vagrant/API/)
$ npm install express -save
下 -save 的原因是要將 express 加入 package.json 中
離開虛擬機,其實我們也可以在虛擬機資料夾看到剛剛建立的專案了,
現在開始就可以使用自己喜歡的編輯器來開啟這個專案資料夾,我個人偏好使用 Sublime Text
要執行專案時再回終端機即可
在 API 資料夾中建立一個 app.js
內容是:
javascript
var express = require('express');
var app = express();
app.get('/', function(req, res){
res.send('Hello World');
});
app.listen(3000, function() {
console.log('Listening on port %d', server.address().port);
});
儲存後,回到終端機,將 express 跑起來:
vagrant@vagrant-ubuntu-trusty-64:/vagrant/API$ node app.js
Listening on port 3000
出現 Hello World! Express! 啦~~ 又一個 Hello World 啦~~
是不是有比 Node.js 的範例更簡潔一點呢?
簡單分析一下這段 code :
// 引入 express module
var express = require('express');
// 產生一個 express instance - app
var app = express();
// Express 的重點所在! 稍後解釋
app.get('/', function(req, res){
res.send('Hello World');
});
// 讓 express server 跑在 port 3000
app.listen(3000, function() {
console.log('Listening on port %d', server.address().port);
});
值得一提的是 Express 的 Routing:
app.get('/', function(req, res){
res.send('Hello World');
});
在這邊就必須用上了!
我們可以看一下 express 的 API reference
app.get 的 .get 就是代表 HTTP GET
如果後面接 .post 就是 HTTP POST, 等等都同樣概念
API reference 中提到,
router.VERB(path, [callback...], callback)
path 的意思就是要開放給 client 的路由, 透過不同的路由導向不同的動作
中間的 [callback...] 是 middleware 這個之後會再解釋
最後一個 callback 是用來處理 request 及 response
在這個例子中,client 並沒有丟參數,因此不需要對 request 作處理,
而 server 要回應 response
所以使用了 res.send('Hello World'); 來回傳資料
是不是很簡單勒!
或許有人會使用 express-generator 來產生 expresss 專案目錄
雖然它很方便,一次建立好專案結構,並且安裝一些常用搭配的套件,
但是由於在尚未瞭解 express 的運作原理,
一開始一次建立完整我認為過快,因此先不建議這樣用,
當然,如果已經很熟練很瞭解 express 中可以使用的東西了,使用產生器當然是節省時間囉~
$ npm install -g express-generator
$ express /tmp/foo && cd /tmp/foo