手把手用 express 搭建後臺

前言 想必不少小夥伴開始學 node 的時候想搞個項目出來殊不知道怎麼下手吧，這個教程的話就是教你們用 express 框架簡單粗暴搭建一個能夠用的後臺出來，而後關於 node 和 express 的其餘知識，你們仍是須要本身去看看文檔瞭解一下。

1 環境準備

express 既然是基於 node 的開發框架，首先 node 那些確定都配好了吧，這個就本身搞去。而後下面就是要搞 express 的東西了。

一、全局安裝 express，方便後面直接導入 express 模塊。

npm install express -g

二、再全局安裝 express 的腳手架工具，裝完咱們就能夠很舒服的生成一個 express 項目了

npm install express-generator -g

2 項目

2.1 搭建

環境配好後，搭建項目就很舒服啦，直接就是一條指令

express express-demo

接下來就是，安裝依賴，運行項目

npm install
npm run start

而後咱們打開瀏覽器查看 3000 端口，看到下面的頁面就說明咱們 express 後臺已經跑起來了

2.2 項目結構

生成的項目結構以下圖所示

│  app.js
│  package.json
│
├─.idea
│  │  express-demo.iml
│  │  modules.xml
│  │  vcs.xml
│  │  workspace.xml
│  │
│  └─inspectionProfiles
├─bin
│      www
│
├─public
│  │  index.html
│  │
│  ├─images
│  ├─javascripts
│  └─stylesheets
│          style.css
│
├─routes
│      index.js
│      users.js
│
└─views
        error.jade
        index.jade
        layout.jade

咱們一個一個來講明哈。

一、bin 文件夾

裏面的話有 www 文件，那個就是項目的啓動腳本文件，監聽端口在裏面設置，通常狀況無論這個文件。

二、public 文件夾

靜態資源文件夾，放着 css，js，img 那些，而後若是在裏面寫個 index.html 的話，咱們訪問 3000 端口的時候就會直接訪問 index.html 的那個頁面。因此這邊的話，能夠把咱們前端開發打包好的代碼。

三、routes 文件夾

這個是重點啦，路由文件夾，裏面的文件用於生成路由實例，這個路由實例用來響應前端發過的請求，按照如今先後端分離的思想，咱們在這裏面寫後臺的那些接口了。咱們抓一個文件來看一下

// index.js
// 引入依賴
var express = require('express');
var router = express.Router();

// 處理前端請求
/* GET home page. */
/* 這邊的 router.get 是接收前端的 get 請求
  第一個參數是路由地址，這邊的 '/' 就指根路由，也就是http://localhost:3000 啦
  第二個參數是一個響應接口的回調函數，裏面有三個參數，分別是 請求頭request 響應體response，和一個next
*/
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});
// 導出路由模塊
module.exports = router;

上面這個是系統默認的給的，他的話是根據模板（下面會講）生成了一個頁面渲染回去，可是咱們如今先後端都分離啦，通常都是後臺寫接口丟給前端就好啦，因此咱們要改爲下面這個樣子

router.get('/', function(req, res, next) {
  // 處理好要返回給前端的數據
  let data = {
      name:'xhm',
      age:12 }
  // 用 res.json 方法寫接口
  res.json({
    code:0,
    msg:'ok',
    data:data
  })
});

安裝上面這樣搞，咱們從新訪問 3000 端口的時候就會發現這個時候返回就是一個 json 的數據啦（以下圖），這樣就寫了一個簡單的後臺接口，後面的不一樣業務邏輯的接口，就看你前面怎麼去處理那些數據啦。

四、views 文件夾
這個用於存放 jade 模板，這個的話，不懂也比較少會用到，只知道這個能夠做爲頁面的模板來使用，渲染一下報錯頁面和主頁，其餘就沒有用了。

五、app.js 文件
這個是項目的入口文件，這邊有着項目的一下配置，也在此整合了項目的模塊，其中要注意的就是裏面關於路由模塊的配置了。看下面代碼

// 引入 routes 文件夾中的路由文件
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
...
// 設置這些路由的地址
app.use('/', indexRouter);
app.use('/users', usersRouter);

這邊作一點說明吧：

• 這邊設置路由的地址是相對於項目的，而後在 routes 文件夾裏面的地址是相對於這邊的，用上面的代碼來講，假設那個 ./routes/users 文件裏面定義了 '/login' 這麼一個路由地址，那麼因爲整個 users 的地址是 '/users'，因此咱們在外面要訪問那個 login 的話，該訪問的地址是 http://localhost:3000/users/login。
• 後面要再想加其餘路由模塊的時候，就按照上面先引入路由模塊，再用 app.use 設置好地址，後面就能夠用了。

六、package.json 文件

這個就是整個項目的配置文件啦。項目的名字啦，版本號和項目所需的那些依賴全都寫在這裏面的啦，可是通常咱們是不用管的。

3 數據庫

既然搭建了後臺，數據庫確定是要鏈接的，不一樣的數據庫的話，就安裝不一樣的插件來使用，若是你使用的是 mongoDB 的話，就推薦使用 mongoose 來操做數據庫，關於 mongoose 的使用能夠看我另一篇教程

4 後記

源代碼的話我放到個人 Github 上面去了,能夠去 clone 下來看一下。關於 express 項目的簡單開發就講到這邊啦，可是若是是這麼簡單的設置這個項目的目錄結構的話，可擴展性不高，代碼複用也很差，因此咱們要看下一篇文章啦--express 項目分層實踐