Node.js與Express 4.16.1 的學習之旅(二) 初始項目剖析與修改

上一節我們創建了一個初始的Express模板，那我們現在開始對該模板進行解析吧。

一、替換默認模板

項目的初始渲染模板是Jade，但是我個人並不喜歡使用渲染模板，因爲我認爲業務邏輯的話，最好的處理方式還是通過Javascript去控制。因此，我要把使用Jade修改爲使用Html。

打開app.js，並且找到下面語句，註釋

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

安裝EJS，在終端中輸入

npm install ejs

在app.js中加入下面語句

var ejs = require('ejs');
app.engine('.html', ejs.__express);
app.set('view engine', 'html');

至此，我們已經可以使用Html頁面了。

二、Express的路由機制

再次打開app.js文件，找到以下語句

app.use('/', indexRouter);
app.use('/users', usersRouter);

這裏，就是創建了路由。當輸入127.0.0.1:3000時，我們進入的頁面，就是第一句語句在配置。而127.0.0.1:3000/users,則是第二句語句的配置。

再次找到下面語句：

var indexRouter = require('./routes/index');

根據這個，我們可以找到這個配置文件

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

module.exports = router;

因爲我們剛剛已經把Jade改成Html了，因此可以改爲：

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index');
});

module.exports = router;

router.get表示只接受Get請求。如果需要使用Post，就用router.post

render的頁面在View文件夾下面。

三、public文件夾

如果所有文件都需要自己手動配置路由的話，那麼開發網站的效率就會大大降低，並且不方便維護。而public文件夾則是專門用來存放這些不需要配置路由的文件的。如圖片、css樣式文件和頁面js文件等等。