Sean's Note: 3月 2017

2017年3月5日星期日

Node.js 學習筆記 (二)

Express

Express 是最小又靈活的 Node.js Web 應用程式架構。
以下是一個簡單的 Hello World Web Application 範例：

var express = require('express');
var app = express();

app.get('/', function (req, res) {
  res.send('Hello Express!');
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

第四行指的是設定了一個 handler，用來處理 "/" 的網頁請求，結果如圖 1。

圖1. Hello Express!

使用中介軟體 (Middleware)

在 express app 回傳任何請求前，可以透過 middleware function 來截斷請求，這裡可以用來印一些資訊到 console 上，或處理驗證請求的合法性。之後呼叫 next 函式，讓請求繼續被處理，否則程式會停擺在那。
範例，在任何請求之前印出當前的時間資訊：

var app = express()

app.use(function (req, res, next) {
  console.log('Time:', Date.now())
  next()
})

Handlebars

Handlebars 是一套模板引擎，且相容於 Mustache 的格式，可以用來動態渲染 HTML 的內容。
透過 npm 安裝：

npm install hbs --save

範例：

var express = require('express');
var hbs = require('hbs');

var app = express();
app.set('view engine', 'hbs');
app.get('/about', function (req, res) {
  res.render('about.hbs', {
    pageTitle: 'This is About Page!'
  });
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

// about.hbs

<pre class="brush: html">
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{{pageTitle}}</title>
</head>
<body>
    <h1>About Page</h1>
</body>
</html>

在網址列上輸入 localhost:3000/about 後，就可以看到顯示 "This is About Page!"，表示 pageTitle 有正確被傳遞給 about.hbs 了。

部署網頁應用程式

網路上有很多平台，可以幫助開發者或企業部署網頁應用程式，如 HEROKU, Amazon S3 等等。

2017年3月5日 星期日