Node.js 的 30 天學習日記--第二十天

Node.js 學習第二十天

學習進度真的有點慢，大概會超過 30 天的學習吧(?)，反正就繼續學下去，看什麼時候學完 XD 。

如果在看的過程中有任何錯誤歡迎寫 E-MAIL： pp840405@gmail.com 提醒我錯誤。

EJS - 語言介紹

EJS - Templates 樣版語言，簡單來說就是一個改了其中一個全部同時更改，像你做了 30 頁的 html 網頁其中 header 跟 footer 這兩個版型 30 頁都是同樣的設計，但是發現有地方出錯的話一個一個更改很吃力，所以有需要一個版型，更改它之後它會套用到全部有使用這個版型的網頁上面。
兩種最多人使用寫法，不強制使用哪種看個人與公司習慣，我的學習害是已 EJS 來學，它的寫法比較有 JavaScript 的語法，可以加強基礎。
EJS
Code-pug

EJS - 環境安裝

一樣用 npm 來安裝 EJS 但是我們是安裝已 EJS 為基底延伸出來的套件 EJS-locals 。
npm install ejs-locals --save

  1. 新增一個 views 資料夾後，下面都設定好在 views 資料夾新增一個 index.ejs 的檔案用 HTML 格式隨便用一個 H1 標題
    文字。
  2. 在 app.get 裡面更改成 res.render('index'); 它會要的呈現畫面從 views 資料夾抓 index 名稱檔案，因偽有設定要使用 ESJ 去渲染網頁。
  3. 去用 cmd 的 node 執行這支 JS 檔案。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    var express = require('express');
    var app = express();

    app.use(express.static('public'));
    //使用 ejs-locals 模組
    var engine = require('ejs-locals');
    app.engine('ejs',engine);
    //要設定ESJ樣版都需要放在views資料夾
    app.set('views','./views');
    //要使用EJS檔案去渲染
    app.set('view engine','ejs');
    app.get('/',function(req,res){
        //不用打副檔名
        res.render('index');
    });
    //監聽 port
    var port = process.env.PORT || 3000;
    app.listen(port);

結語

有任何問題歡迎寫 MAIL： pp840405@gmail.com 一起共同討論。