Nodejs+express 4.x

Node和NPM的安裝夠便捷了，不細說...有幾點基礎順手提一下：

1. 安裝命令中的 「-g」 表示全局(global)
2. express的版本不是一般的 「-v」 來查看，而是 「-V」
3. 安裝express項目的命令以下
   express -e nodejs-product
   
   -e, --ejs add ejs engine support 
   -J, --jshtml add jshtml engine support (defaults to jade)
   PS：模板引擎之類暫時沒必要care，不過俺當初學習搭建Node+express時用的是ejs，因此也就順手一直用着了

 

 

　　 Node的小基友supervisor　　

　　每次修改代碼後會自動重啓。懶程序員就期望這種省事省力的工具活着了:)

　　安裝： npm install -g supervisor

　　執行： supervisor app.js

　　另外一個 小基友forever

　　虛擬機一關node服務就關了，不過forever可讓node服務不中止，介紹以下，安裝和執行不細說啦，我懶：

　　forever是一個簡單的命令式nodejs的守護進程，可以啓動，中止，重啓App應用。forever徹底基於命令行操做，在forever進程之下，建立node的子進程，經過monitor監控node子進程的運行狀況，一旦文件更新，或者進程掛掉，forever會自動重啓node服務器，確保應用正常運行。

 

　　 express項目目錄　　

     

　　如上圖就是一個express項目結構，簡單過一下：

• app.js： 項目入口，反正express愛叫app.js沒轍，你能夠改爲index.js或者main.js都成。至關於php項目中的 index.php、index.html
• node_modules： 存放項目的依賴庫
• package.json： 項目依賴配置及開發者信息(這個要說就說多了，仍是看文檔好，俺就不誤人子弟了。下期看看抽個小段單說Node模塊)
• public： 靜態文件如 css,js,img (PS:俺其實習慣叫static)
• routes： 路由文件(學習的重要攻克對象。尼瑪業務好很差，路由是關鍵)
• Views： 頁面文件(Ejs或者jade的模板，默認是jade，俺這用Ejs，在初階練手最重要，因此均可以試試)

     打開View 文件發現index.ejs比較不習慣，因此對app.js進行小改動：

1. 「app.set('view engine', 'ejs');」 變成 「app.engine('.html', ejs.__express);app.set('view engine', 'html');」
2. 上一行出現的ejs變量須要require ejs模塊，增長代碼「var ejs = require('ejs');」

     最終的app.js以下：

     

 

　　 代碼小解：　　

     由於針對的是初階入門，俺們仍是繼續過一下express的使用與Node的方法哈：

     require() 用於在當前模塊中加載和使用其餘模塊；此方法是模塊的基礎，使用中大概有路徑的概念就行。PS：JS文件能夠去掉".js"後綴

　　 exports 表示模塊的導出對象，用於導出模塊的屬性和公共方法。在項目routes文件夾下有index.js和users.js（路由有細說），都使用到exports對象導出對象，如33行的routes.index和34行的user.list;

　　 PS：一個模塊的代碼只會在模塊第一次被使用時執行，不會因require屢次而被初始化屢次。

 

      express() 表示建立express應用程序。簡單幾行代碼其實就能夠建立一個應用，以下：

     var express = require('express'); 
     var app = express(); 
     app.get('/', function(req, res){ 
          res.send('hello world'); 
          console.log('hello world');
     }); 
     app.listen('8808');

     app.listen() 就是在給定的主機和端口上監聽請求，這個和node中http模塊的http.createServer(function(){...}).listen()效果一致；

     app.set(name, value)和app.get(name)就是你想的那樣，set()爲設置 name 的值設爲 value，get()爲獲取設置項 name 的值。如俺app.js的圖片16行中的一句「app.set('port', process.env.PORT || 3000)」就是設置項目的port，在下面使用http.createServer時就可使用app.get('port')來獲取，只是俺偷懶沒用來着 ；

     瞭解app.engine()方法以前先看看express應用的安裝命令:「express -e nodejs-product」，其中的 -e 和 -J 咱們一開始已經提到，表示ejs和jade模板。

     若是想把模板後綴改爲「.html」時就會用到app.engine方法，來從新設置模板文件的擴展名，好比想用ejs模板引擎來處理「.html」後綴的文件：app.engine('.html', require('ejs').__express);

     app.engine(ext, callback) 註冊模板引擎的 callback 用來處理ext擴展名的文件。

　　 PS：__express不用去care，其實就是ejs模塊的一個公共屬性，表示要渲染的文件擴展名。

 

     app.use([path], function) 使用中間件 function,可選參數path默認爲"/"。使用 app.use() 「定義的」中間件的順序很是重要，它們將會順序執行，use的前後順序決定了中間件的優先級(常常有搞錯順序的時候);

 

     最後介紹個頗有用的express API：

     app.render(view, [options], callback) 渲染 view, callback 用來處理返回的渲染後的字符串。

     

　　路由實戰：　　

     路徑代碼應該是項目中最本機的一部分了。express中建立一個或者一套新的handle很是簡單，先看看express現有的，一下子咱們建立倆個實際的規則。

     

     變量 routes 和 user 都是剛纔require的模塊，他們各自exports了index方法和list方法；其中Response.render()表示渲染view，同時傳進對應的數據，Response.send()爲發送一個響應；在設置路由時index和list方法做爲回調函數最終執行。

　　 

　　 流程大概瞭解啦，俺們也就實際搞一把，最easy的一種方式，簡單倆步：

1. 第一種方式就是在當前的routes/index.js或者routes/test.js中加幾行代碼以下
   

   exports.test = function(req, res){
     res.send('test welcome.');
   };

    

2. 在app.js文件設置路由那塊加上app.get('/test', routes.test);

　　 第二種方式就是多了兩步，先新建一個模塊如test.js文件，輸出而後exports對應的方法；在app.js中require這個模塊，再加一行設置路由即完成了。

 

　　快速炫起來，集成Bootstrap：　　

     JS工程師使用Nodejs上手仍是以快速搭建網站爲主，因此纔會介紹Express，那麼爲了讓網站更快的體面起來，集成使用Bootstrap就是上佳選擇，很是喜歡其響應式佈局和總體系的腳手架。

     PS：由於Bootstrap的JS插件都依賴jQeury，因此jQuery也一併引入了。

 

　　 前文已經說到了，靜態文件都放在public文件夾中，切文件夾內已經幫咱們把類目都分好了，images、 javascripts、 stylesheets。

　　 分別引入bootstrap.min.css文件至stylesheets目錄下；jquery-1.x.x.min.js和bootstrap.min.js放到javascripts文件夾下。

　　 而後俺們修改view/index.html把文件引入使用便可，下面放出俺在bootstrap demo的基礎改的index.html，你們隨意拿去使用和修改。

　　

  View Code

　　 若是樣式有問題請檢查下bootstrap的路徑是否正確引入。

　　 啓動項目以後以爲 高大上 很簡單，有木有！！