前端开发入门:框架篇-ExpressJS入门学习

Love The Way You Lie 2022-08-19 00:26 186阅读 0赞

一、安装

官网http://expressjs.com/     我们说，Express\[1\] 是一个简洁而灵活的 [ node.js][node.js] \[2\]Web应用框架, 提供一系列强大特性帮助你创建各种Web应用。\[3\]

Express.js在Node.js社区中是比较出名web框架，而它的定位是“minimal and flexible（简洁、灵活）”。Express主要解决了 请求路由 和 视图模板 的问题，其中Middleware是它最重要的概念。它是不错的Web框架，但本屌还是有些想法的：

1. Express不是MVC的框架，因为它没有对Model解决方案，Express本身定位就不是MVC，只是minimal and flexible的Web框架。

2. 由于Express实在是flexible，没有强制的规范约束，加上js是可以把代码写得很随意的编程语言，所以本屌找到的Demo中，Config，Controller，View的维护、管理、技巧都可能各式各样。

Express  是一个简洁而灵活的 [ node.js][node.js 1] Web应用框架, 提供一系列强大特性帮助你创建各种Web应用。Express 不对 node.js 已有的特性进行二次抽象，我们只是在它之上扩展了Web应用所需的功能。丰富的HTTP工具以及来自Connect框架的中间件随取随用，创建强健、友好的API变得快速又简单。

Express不是对[node.js][node.js 2] 已有的特性进行二次抽象，我们只是在它之上扩展了Web应用所需的功能。

express4.X的有一些变化，4.x版本中将命令工具单独分出来了(https://github.com/expressjs/generator),所有要先按装express-generator，否则创建项目时，会提示express命令没找到。

**\[plain\]** [ view plain][view plain] [copy][view plain] [print][view plain] [?][view plain] [![在CODE上查看代码片][CODE]][CODE_CODE] [![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  $ npm install -g express-generator \#需先安装express-generator  
2.    
3.  $ npm install -g express  
4.    
5.  $ express -V  \#验证是否安装成功

二、创建项目

1.  $ express myfirstexpress \# express的默认模版采用jade，若需要ejs模版支持，加上-e选项，即 express -e myfirstexpress  
2.  $ cd myfirstexpress  
3.    
4.  $ ls  
5.  app.js  bin  package.json  public  routes  views \#项目的目录结构

三、运行项目

1.  $ npm install \#需要等待一段时间，因为需要获取很多的库文件  
2.    
3.  $ npm start  
4.    
5.  > myfirstexpress@0.0.1 start /root/myfirstexpress  
6.  > node ./bin/www

四、访问第一个express项目

浏览器中输入 http://你的IP:3000

显示

**\[html\]** [ view plain][view plain] [copy][view plain] [print][view plain] [?][view plain] [![在CODE上查看代码片][CODE]][CODE_CODE] [![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  Express  
2.    
3.  Welcome to Express

说明express安装成功

比如本地localhost：3000

[node.js]: http://baike.baidu.com/view/3974030.htm
[node.js 1]: http://www.oschina.net/p/nodejs
[node.js 2]: http://baike.baidu.com/subview/3974030/3974030.htm
[view plain]: http://blog.csdn.net/jonahzheng/article/details/33758645#
[CODE]: https://code.csdn.net/assets/CODE_ico.png
[CODE_CODE]: https://code.csdn.net/snippets/404298
[ico_fork.svg]: https://code.csdn.net/assets/ico_fork.svg
[ico_fork.svg 1]: https://code.csdn.net/snippets/404298/fork