框架選型

1、 此項目為傳統門戶網站，頁面較多，可以使用模版提取html公共代碼
2、客戶對seo要求高,不適合作為單頁應用
3、 客戶指定使用express加jade模版引擎

因此，基于express ，設計了如下方案：

• express: 作為基礎框架，提供整個項目的后端服務。

• Nunjucks:html模版引擎，用來提取公共代碼，綁定數據，在服務器端動態生成頁面。
  選擇nunjucks而不用jade的原因是:
  靜態頁面由其他公司提供，由于jade語法特殊，為了最大程度的減少工作量
  其綁定數據的方式與angular雙向綁定語法類似，對團隊來說比較熟悉

• Sequelize:數據庫ORM框架，把關系數據庫的表結構映射到對象上。避免編寫相對復雜的底層查詢代碼，使代碼更易讀

• es6: 使用更高級的語法特性，編寫更易讀的代碼。本項目中選擇es6作為服務端開發代碼，主要是需要使用其promise語法，避免書寫回調地獄，讓代碼更整潔。

• sass:css預處理語言，有利于樣式代碼模塊化。以及其他總所周知的原因。

打包方案：

• babel : 把服務器端es6代碼轉換成es5
• gulp : 編寫任務腳本，將版本信息部署到線上
• webpack : 模塊化前臺的靜態資源（css和js），開發環境下使用其熱更新插件，自動刷新瀏覽器，打包時進行文件合并、壓縮等工作，并提取樣式。

優化方案：

• 壓縮合并文件
• css sprite 減少http請求
• 圖片、視頻資源懶加載
• 數據庫表中加索引，提高查詢效率

部署方案：

• 帶有負載均衡功能的Node應用的進程管理器 pm2

項目目錄結構

_ 
├── client/··················<- 靜態資源
│   ├── common/··············<- 公共樣式
│   ├── home/················<- 頁面內樣式
│   ├── img/·················<- 圖片資源
│   ├── vender/··············<- 為了適配IE8修改的插件
├── logs/····················<- 日志文件
├── public/··················<- 生產環境編譯后的靜態資源目錄
├── server/··················<- gulp打包后的服務器端js代碼
├── src/·····················<- 使用es6特性的服務器代碼（開發使用）
│   ├── config/··············<- 配置文件
│   ├── proxy/···············<- 數據處理層/數據庫連接層
│   ├── routes/··············<- controller
│   ├── app.js ··············<- 入口文件
│   ├── log.js                      
├── views/ <- 頁面模板
├── .bablerc                        
├── .bowerrc                        
├── .gitignore                      
├── bower.json                      
├── gulpfile.js                     
├── package.json                    
├── README.md                       
├── webpack.config.js               
├── webpack.production.config.js