kerkerj
Express - Hello World!
今天就要來安裝主角之一的 Express 了!
一樣開啟虛擬機器我應該是可以不用多說了 XD
先確認自己的 node 是不是 NVM 的 node 喲
建立專案
$ cd /vagrant/
$ mkdir API
$ cd API/
$ npm init
自己輸入專案的相關內容吧，不知道的就直接按 enter 空白丟給他~
就會產生 package.json 了!
安裝 Express
// 在專案目錄底下 (/vagrant/API/)
$ npm install express -save
下 -save 的原因是要將 express 加入 package.json 中
離開虛擬機，其實我們也可以在虛擬機資料夾看到剛剛建立的專案了，
現在開始就可以使用自己喜歡的編輯器來開啟這個專案資料夾，我個人偏好使用 Sublime Text
要執行專案時再回終端機即可
Express Hello World!
在 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
開啟瀏覽器，瀏覽 http://192.168.33.10:3000 (url 視個人環境而定)
出現 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);
});
以上概念基本上都和 Node.js 概念差不多
值得一提的是 Express 的 Routing:
app.get('/', function(req, res){
res.send('Hello World');
});
最前面有提到 HTTP 的動詞 GET, POST, PUT, DELETE …
在這邊就必須用上了！
我們可以看一下 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
下一篇會講解如何簡單操作 MongoDB!