node.js/express.js新手快速入门及搭建MVC项目
2015-04-12 16:07
1011 查看
node.js作为服务器端强大的后台语言，怎样牛逼我就不多说了，其他博客上面有。本文作为一篇入门级学习总结，供没有node.js基础的同学们学习，不足之处欢迎指正。另外在学node.js之前我几乎是完全不懂啥叫MVC，搭建了一个项目之后豁然开朗。在此写一篇博客以帮助后来的人快速学习。
首先是需要vs2013，编译环境任选，不过照目前来看vs2013作为ide最方便。然后需要下载的东西，由于比较零散不好找，我就放在百度云了，当然你也可以根据文件名去找找最新版。点此下载
其中x86和x64只下载一个就行了。安装步骤：
1、下载node-xxx.msi，安装。步骤简单，不多说。
2、执行cmd命令：node --version，显示版本号就表示安装成功。
3、下载Git_for_Windows_1.9.5.zip，安装。这个是github的windows客户端，git高手可以忽略。
4、执行以下5条命令：
git clone --recursive git://github.com/isaacs/npm.git
cd npm
node cli.js install npm -gf
npm install underscore
npm install express
上面代码意思是，安装npm（这个相当于ruby的gem，可以方便下载共享的扩展包，然后通过gem安装underscore和express）如果有哪条执行失败，我也不造如何解决，自行bing吧
5、安装NTVS 1.0 VS 2013.msi，不用vs2013的到此为止吧。后面的基于vs2013
6、新建项目
然后弹出一个全英文的对话框，点是就行了。
在此项目建完了，可以直接点运行。然后我们来一步一步分析源代码。
1、网页布局
找到views目录下的layout.jade，打开。上面的代码对于有HTML基础的人来说一看就懂。只不过不是XHTML，而是类似于python的缩进。
第一行doctype html，这个就是网页的第一行，解析器会在左边加上<!，右边加上>，就完了。在此我们将它改成HTML4的：
DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"从第二行开始，关键来了，同志们注意！！第二行默认html，解析器会将其解析为<html></html>。假如需要添加属性，比如<html xmlns="http://www.w3.org/1999/xhtml"></html>这样，咋搞？简单，第二行改为：
html(xmlns="http://www.w3.org/1999/xhtml")解析器会将括号中的内容解析为XHTML属性，假如有多个可以 html(xx="xx" yy="yy") 这样，就ok了。
第三行不多说。第四行，title= 这句话的意思是后面引用了一个变量，名为title，解析器将会解析为<title>变量的值</title>。变量名随意。这行还有一种写法：
title #{title}含义同上。建议新同学们统一写成 #{变量名} 这样的形式，这样更清晰直观。
第五、六行不解释。第七行：block content。这句话的意思是新建一个代码扩展块，通过其他jade文件中包含layout.jade，即可定义将什么内容放在代码扩展块中。
然后，基础的布局介绍的差不多了，我们接来下看看index.jade：
第一行的意思是从layout.jade中扩展布局，简单粗暴的理解是：自动复制layout.jade中的布局。
第三行，定义块中的内容。
重点说的差不多了，说说这个缩进。我不太喜欢两个空格缩进，我于是试了下改成tab缩进也可以正常解析。
2、如何处理请求
处理页面：
index.jade并不是创建好文件就可以使用了，还需要在node.js中引用。找到routes目录下的index.js。
第六行：exports代表一个node.js对象，声明的函数可以直接供外部模块调用。这里定义了一个index函数。两个参数req与res，其实就是所谓的request与response。
第七行：意思就是路由一个页面index.jade，然后传入参数title，值为Express。发现什么了嘛？对了，就是上面的title #{title}。将这个东替换为传入的值。
直接输出：
找到routes目录下的user.js，这儿没有调用网页了，而是直接输出。
第七行：这儿就是服务器直接向前台输出一串字符串。如果不嫌麻烦可以试试输出<html><body><p>啥的啥的
3、处理关联
打开解决方案管理器中项目根目录下的app.js，找到第七、八行 var routes = require('./routes'); var user = require('./routes/user'); 这两行的意思就是引用刚才的两个js文件，其中引用的如果是index.js那么可以简写。
引用了之后，如何调用呢？找到第32、33行，两个app.get。分别传入了两个参数，前一个表示url请求的路径，后一个表示如何处理，就是上面的两个js文件啦。
以上的express.js搭建服务器基础介绍完毕。估计有朋友还不清楚node.js、express.js、io.js等等的区别，我简要说说：
node.js就是一个服务器端用javascript写后台语言的一个库，大多功能都基于此的。
express.js为node.js中的一个包，可以简化node.js项目开发。以上代码都是express.js，如果用纯node.js不知道要麻烦到哪去。不过听说express.js作者弃用node.js转而使用go语言了，不知道为啥。但作为node.js中使用最广泛的库，这个还是可以玩玩的。
io.js是一个从node.js中分离出来的。由于node.js由企业管制，导致项目进度缓慢，5个核心开发者中有4个转而参与io.js项目开发。io.js与node.js同根，express.js等库可以完全兼容使用，唯一的区别为io.js关注最新技术，使用最新javascript引擎，可以支持什么什么最新版本的javascript语法，速度上貌似也有一定优势，但可能不太稳定。node.js成熟稳定，就是项目推进的有点慢。
首先是需要vs2013，编译环境任选，不过照目前来看vs2013作为ide最方便。然后需要下载的东西，由于比较零散不好找，我就放在百度云了，当然你也可以根据文件名去找找最新版。点此下载
其中x86和x64只下载一个就行了。安装步骤：
1、下载node-xxx.msi，安装。步骤简单，不多说。
2、执行cmd命令：node --version，显示版本号就表示安装成功。
3、下载Git_for_Windows_1.9.5.zip，安装。这个是github的windows客户端，git高手可以忽略。
4、执行以下5条命令：
git clone --recursive git://github.com/isaacs/npm.git
cd npm
node cli.js install npm -gf
npm install underscore
npm install express
上面代码意思是，安装npm（这个相当于ruby的gem，可以方便下载共享的扩展包，然后通过gem安装underscore和express）如果有哪条执行失败，我也不造如何解决，自行bing吧
5、安装NTVS 1.0 VS 2013.msi，不用vs2013的到此为止吧。后面的基于vs2013
6、新建项目
然后弹出一个全英文的对话框，点是就行了。
在此项目建完了，可以直接点运行。然后我们来一步一步分析源代码。
1、网页布局
找到views目录下的layout.jade，打开。上面的代码对于有HTML基础的人来说一看就懂。只不过不是XHTML，而是类似于python的缩进。
第一行doctype html，这个就是网页的第一行，解析器会在左边加上<!，右边加上>，就完了。在此我们将它改成HTML4的：
DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"从第二行开始，关键来了，同志们注意！！第二行默认html，解析器会将其解析为<html></html>。假如需要添加属性，比如<html xmlns="http://www.w3.org/1999/xhtml"></html>这样，咋搞？简单，第二行改为：
html(xmlns="http://www.w3.org/1999/xhtml")解析器会将括号中的内容解析为XHTML属性，假如有多个可以 html(xx="xx" yy="yy") 这样，就ok了。
第三行不多说。第四行，title= 这句话的意思是后面引用了一个变量，名为title，解析器将会解析为<title>变量的值</title>。变量名随意。这行还有一种写法：
title #{title}含义同上。建议新同学们统一写成 #{变量名} 这样的形式，这样更清晰直观。
第五、六行不解释。第七行：block content。这句话的意思是新建一个代码扩展块，通过其他jade文件中包含layout.jade，即可定义将什么内容放在代码扩展块中。
然后，基础的布局介绍的差不多了，我们接来下看看index.jade：
第一行的意思是从layout.jade中扩展布局，简单粗暴的理解是：自动复制layout.jade中的布局。
第三行，定义块中的内容。
重点说的差不多了，说说这个缩进。我不太喜欢两个空格缩进，我于是试了下改成tab缩进也可以正常解析。
2、如何处理请求
处理页面：
index.jade并不是创建好文件就可以使用了，还需要在node.js中引用。找到routes目录下的index.js。
第六行：exports代表一个node.js对象，声明的函数可以直接供外部模块调用。这里定义了一个index函数。两个参数req与res，其实就是所谓的request与response。
第七行：意思就是路由一个页面index.jade，然后传入参数title，值为Express。发现什么了嘛？对了，就是上面的title #{title}。将这个东替换为传入的值。
直接输出：
找到routes目录下的user.js，这儿没有调用网页了，而是直接输出。
第七行：这儿就是服务器直接向前台输出一串字符串。如果不嫌麻烦可以试试输出<html><body><p>啥的啥的
3、处理关联
打开解决方案管理器中项目根目录下的app.js，找到第七、八行 var routes = require('./routes'); var user = require('./routes/user'); 这两行的意思就是引用刚才的两个js文件，其中引用的如果是index.js那么可以简写。
引用了之后，如何调用呢？找到第32、33行，两个app.get。分别传入了两个参数，前一个表示url请求的路径，后一个表示如何处理，就是上面的两个js文件啦。
以上的express.js搭建服务器基础介绍完毕。估计有朋友还不清楚node.js、express.js、io.js等等的区别，我简要说说：
node.js就是一个服务器端用javascript写后台语言的一个库，大多功能都基于此的。
express.js为node.js中的一个包，可以简化node.js项目开发。以上代码都是express.js，如果用纯node.js不知道要麻烦到哪去。不过听说express.js作者弃用node.js转而使用go语言了，不知道为啥。但作为node.js中使用最广泛的库，这个还是可以玩玩的。
io.js是一个从node.js中分离出来的。由于node.js由企业管制，导致项目进度缓慢，5个核心开发者中有4个转而参与io.js项目开发。io.js与node.js同根，express.js等库可以完全兼容使用，唯一的区别为io.js关注最新技术，使用最新javascript引擎，可以支持什么什么最新版本的javascript语法，速度上貌似也有一定优势，但可能不太稳定。node.js成熟稳定，就是项目推进的有点慢。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- TWaver html5 + NodeJS + express + websocket.io + redis 快速搭建项目（一）
- nodejs express 快速搭建一个项目过程
- TWaver html5 + NodeJS + express + websocket.io + redis 快速搭建项目（二）
- TWaver html5 + NodeJS + express + websocket.io + redis 快速搭建项目（三）
- 使用Node.js的express框架搭建一个简单项目并且添加了一个路由
- （原创）node.js入门之一：express简单服务器搭建－Mac环境开发
- node.js 快速搭建vue项目
- 快速搭建 node.js+express
- 零基础搭建Node.js、Express、Ejs、Mongodb服务器及应用开发入门
- 零基础搭建Node.js、Express、Ejs、Mongodb服务器及应用开发入门
- Node.js Express 从入门到菜鸟（二）——Cookie+Session+三层搭建
- 入门如何搭建Node.js新项目
- 新手如何快速入门node.js
- Node.js Express 从入门到菜鸟（二）——Cookie+Session+三层搭建
- nodejs+express搭建电影网站之二 -----具体项目结构 开发环境的建立 测试页面流程跑通
- node.js之快速搭建koa2项目
- Nodejs+express+angularjs+mongodb搭建前端项目框架NJBlog
- 新手如何快速入门node.js
- Nodejs+express+angularjs+mongodb搭建前端项目框架NJBlog
- VUE2.0的简单入门（一）-安装node.js环境搭建与项目构建