导语:作为一篇新手入门，这篇文章没有太多的技巧和花式，只是从零开始带你学习和掌握express的开发应用，比较适合于完全没有使用过express的新手，以及其他非前端同学。
文章分为几个部分
1.express
2.Hello World
3.页面和接口都是路由
4.数据库
5.前端
一.express
相当一部分前端同学，很少会去做一些服务端的事情,平时正常的工作流程，就是做拿到数据接口之后的事情。那么如果突然有一天，比如就现在，一个从服务端到前端全部都需要你来完成的任务交给你，当然，对于大牛来说无论是用一门后端语言或是用node来完成可能都是很简单的事情，但是如果你不懂后端语言，node写的也不咋地（就像我），你将如何完成这个任务？
这篇文章就是写给暂时不知道怎么完成的同学，我们一起来完成！
express就是我们完成这个任务要使用的一个基于node的前端框架，他的特点是简洁，灵活，可以让你快速创建一个从后到前功能完整的网站，可以设置中间件来响应http请求，可以自定义路由来执行不同的http请求动作，可以向模板传递参数来动态渲染html页面…等等，说到这里可能有些新手同学已经不太清楚是什么了，没关系，后面我都会用这个人任务来给你讲解清楚。
但是在创建这个网站之前，你至少需要会使用以及已经安装好了node和npm。
那么第一步，我们安装express!
在你的硬盘里找个地方新建一个我们学习和测试用的文件夹吧，比如我，新建一个叫 lianxiaoxi 的文件夹。
进入到这个文件夹，执行
npm init
这个命令为你的应用创建一个 package.json 文件至于package.json是什么，在这里我们不再细说，大部分同学肯定都知道，不清楚的可以自行搜索一下相关知识点。
执行完命令以后会要你输入一些信息，比如应用的名称，版本等等，这些你都可以随意瞎填，爱写啥写啥，反正是个测试任务。我比较懒，就一路回车默认或者为空。到了entry point 这一项，是给你创建一个入口文件，其他教程应该都是改成了app.js，我就不！我这里入口文件的名字是test.js。
yes之后，我们开始安装express，执行命令 npm install express
这里上次遇到一个哥们问我，其他教程安装都会带着 —save 参数，你怎么不带?
这是个好问题，建议和我一样的新手同学自行查一下 —save 的意义和使用方法，也是需要学习的知识点。查完以后你就能明白，加和不加到底有什么不同，不过我依然选择不加，就是这么傲娇。
这一步就安装完毕了,非常成功，至于那两个warn，看字面意思就知道是刚才我们偷懒的缘故，不需要去管他。但是上次那哥们还是问我，别的教程都会一起安装几个重要的模块，比如cookie-parser 那些，你怎么没装?
这里既然我们是零基础入门，就先不去打包安装那些东西，我们需要一个安装一个，讓自己安装的每一个模块都清楚是做什么的!
二 . Hello World
安装完之后我们就开始学习使用这个框架，自然是先跑一个Hello World出来。
现在在项目目录下新建一个 test.js 文件，我们逐行写这个代码。
代码语言：javascript复制//先require
var express = require('express');
var app = express();
//处理文件路径的模块
var path = require('path');
/* view处理,还记得我们开头的时候说，express可以向模板传递参数来动态渲染html页面，
那么在这里我选择 ejs 来当模板，用ejs来渲染出第一个Hello World页面。,在运行这个test程序之前，
回到命令行那里，运行 npm install ejs,就可以成功安装,然后进行如下设置。*/
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
/*静态文件处理,定义并创建一个目录，存放你的静态文件，比如css，图片，前端js代码等等。我这里定义为 src 目录*/
app.use(express.static('src'));
/*页面路由处理,这里路由我没有按照官方教程那样直接使用get或者post示例，
而是用了use中间件的方式,这样可以直接让你的项目目录建立起来，而且足够清晰。
在测试项目里新建 routers 文件夹，里面用来放路由文件，我分为两个子目录，
一个用来存放page路由，一个用来存放api路由.
这段处理代码表示，路由为/ 也就是首页的时候执行index*/
var routers = require('./routers/page/index');
app.use('/', routers);
//运行 127.0.0.1:9527
var server = app.listen(9527, function () {
var host = server.address().address
var port = server.address().port
console.log(“启动成功")
})到这里这个test程序就写完了，但是肯定还跑不起来，因为我们还没有写自己设置的路由中间件.
现在打开routers/page 目录下的 index.js 文件，开始写这个首页的路由中间件:
代码语言：javascript复制//require
var express = require('express');
var router = express.Router();
//设置首页路由get请求，后面会详细介绍
router.get('/', function(req, res, next){
/* 模板与注入数据,现在在项目目录下新建一个 view 目录，用于存放我们的页面模板,
目录里创建一个test.ejs文件，这个语句里test是我们的模板页面，后面的对象是我们手
动创建用来注入的数据，下面会在模板里调用.*/
res.render('test', {title: 'Hello World'});
})
module.exports = router;
到这里我们首页理由就处理完了，现在我们打开新建的 views/test.ejs 文件，关于ejs的语法大家可以查看一下官方文档，非常简单，我们这里就先写一个纯html的页面。
代码语言：javascript复制<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><%= title %></title>
<!-- 你的样式表，指向的是你设置的静态文件目录，src -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
Hello World
</body>
</html>
Title 的这个引用方式是ejs语法，这个title就是我们在路由文件里注入的数据.
到这里,整个Hello World页面的路由，模板，全部都已经完成了，现在我们对一下文件目录，如图:
Node_modules是我们依赖的所有模块，routers是我们的路由文件，src里放前端css和js代码，views是我们的模板文件。
然后回到shell面板，执行 node test.js 命令
这时候我们在浏览器里打开 127.0.0.1:9527
可以看到title就是我们注入到模板的数据对象，我们的hello world 也就正式跑通了。
三. 页面和接口都是路由
我们的任务是做一个从后到前功能完整的站点，现在只是成功启动了服务，完成了页面的路由，下一步，我们开始写第一个接口给”前端”。
既然express是个前端框架，那么我们写接口的时候还是用js的方法，前面我们说了，路由决定由谁去响应客户端的请求，我们就可以利用路由来给客户端写接口。
路由的定义由如下结构组成：app.METHOD(PATH, HANDLER)。其中，app 是一个 express 实例；METHOD 是某个 HTTP请求方式中的一个；PATH 是服务器端的路径；HANDLER 是当路由匹配到时需要执行的函数。
例如:
代码语言：javascript复制app.get('/', function (req, res) {
console.log("主页 GET 请求");
});
app.post('/', function (req, res) {
console.log("主页 post 请求");
});
app.put(‘/put_test', function (req, res) {
console.log("put_test put 请求");
});
app.delete(‘/delete_test', function (req, res) {
console.log("delete_test delete 请求");
});
我们就用一个 post 实例来完成这个接口任务，这个接口要实现的功能，是把一个自定义的 mod 模块存到数据库。在routers/api下面新建一个addMod.js文件，用来做第一个接口文件。
四.数据库
既然是存到数据库，那么我们这里就需要加载相应数据库的 Node.js 驱动，这个实例里我们使用MySQL
首先安装 $ npm install mysql
接下来在项目里建立一个config目录，用于存放一些配置文件，在目录里建立一个config.json文件，这个文件写数据库配置:
代码语言：javascript复制{
"host" : “你的数据库host",
"port": “端口",
"user": “用户",
"password" : "密码",
"database" : “数据库"
}
然后我们逐行写这个addMod.js接口的代码：
代码语言：javascript复制//require
var express = require('express');
var router = express.Router();
var mysql = require('mysql');
var config = require('../../config/config.json');
//post 接口
router.post('/', function(req, res, next){
//链接数据库
var connection = mysql.createConnection(config);
connection.connect();
//获取传进来的参数
var modName = req.body.modName || '';
var modCode = req.body.modCode || '';
var modTpl = req.body.modTpl || '';
//构建添加语句,Id属性为auto_increment
var sql = "insert into mods values ("
"'','"
modName
"','"
modTpl
"','"
modCode
"')";
// 执行添加
connection.query(sql,function(err,rows,fields){
if(err){
res.send({
status:false,
data:[],
massage:err.massage
})
}
//返回数据
res.send({
status:true,
data:rows,
massage:"处理成功"
})
});
connection.end();
})
module.exports = router;这样通过路由来实现post一个mod对象到数据库的接口就写好了，但是这里有个问题，就是获取传进来的参数这一步实际上是会报错的，因为req.body没有被解析，那我们就需要安装一个中间件 body-parser 来解析
执行 npm install body-parser
并且在 我们的入口文件 test.js里添加代码:
代码语言：javascript复制//require
var bodyParser = require('body-parser’);
//数据处理
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended : false}));
//接口路由处理
//添加模块
var addMod = require('./routers/api/addMod');
app.use('/addMod', addMod);然后你就可以给自己写出第一个接口文档:
代码语言：javascript复制url: /addMod
type: post
argument: {modId:'',modName:str,modTpl:str,modCode:str}
callback:func五. 前端
到这里，一个后端服务，以及一个post请求接口都已经写好了，我们的hello world 首页也跑了起来，下面要做的就是大家轻车熟路，在前端用自己写的接口给数据库写入一行。
代码语言：javascript复制function addModEvent(){
$('.mod-btn').on('click',function(){
var modData = {};
modData.modName = $modName;
modData.modTpl = $modTpl;
modData.modCode = $modCode;
$.post(‘/addMod', modData, function(data){
alert('添加成功，模块id是' data.data.insertId)
})
})
}执行完这个函数以后，你新建的一个 modData 就成功地保存到了数据库里，然后你可以自己写一个新的 get 请求接口，来读取这个数据，并在页面上渲染出来啦。
后记
到这一步，一个从服务，到接口，到前端的完整站点就全部完成了，但是如果我要把这套代码部署到服务器或者其他机器上，需要将全部文件打包上传,包括mudules，有没有更简单地方法，只要npm install一下就可以自动加载那些包的方法哪?有的，还记得一开始让大家去了解的 —save 吗?
作者博客 https://www.chengrang.com/
