文档章节

使用Express快速搭建前端项目框架

珲少
 珲少
发布于 2016/11/27 12:15
字数 799
阅读 872
收藏 0

使用Express快速搭建前端项目框架

    Express是基于Node.js的前端Web开发框架,使用其可以简洁快速的创建健壮友好的API服务。在前端或移动端的开发过程中,可以借助Express的这项功能模拟API数据,方便开发调试。

    Express是基于Node.js平台的,因此在安装Express之前,需要先安装Node.js。使用如下命令来检查系统中所安装的node版本:

node -v

如果系统中没有安装Node.js,可以在如下网站进行下载安装:

https://nodejs.org/en/

    创建一个测试工程目录,用于存放Express项目框架,首先在终端,使用如下命令进行Express的全局安装:

npm install express-generator -g

需要注意,很多时候国内网络使用npm的时候会非常慢,可以通过如下命令来修改仓库源。

npm install -g cnpm --registry=https://registry.npm.taobao.org

之后使用cnpm来进行包的安装:

cnpm install express-generator -g

    安装好Express后,在新建的文件夹目录下,执行Express的初始化:

express

如果文件夹不为空,会提示是否继续操作,输入yes后回车即可。

    初始化完成后的Express项目结构如下:

其中会默认创建一个package.json文件,其中会添加许多依赖包,在项目目录中执行如下命令来安装这些依赖:

npm install

依赖安装完成后,工程中会多一个node_modules的文件夹,里面是所有依赖包文件。

    再来看Express模板中的文件,其中bin文件夹下面的www.js文件是服务的启动文件,其中启动了HTTP的服务,默认端口为3000。routes文件夹下面的文件用于配置api路由,默认有index.js与users.js两个。app.js文件中对api进行了初始化与配置。可以在users.js中添加一个测试api如下:

var express = require('express');
var router = express.Router();

/* 这个是默认生成的. */
router.get('/', function(req, res, next) {
  res.send('respond with a resource');
});
/* 添加一个测试api*/
router.get('/testAPi',function(rep,res,next){
  res.send('{name:jaki,age:24}');
});
module.exports = router;

在项目目录下通过终端执行如下命令来将服务开启:

node bin/www

如果服务启动成功,在浏览器输入http://127.0.0.1:3000/users/testAPi会返回我们send()方法传递的字符串。

小提示:MacOS系统在服务进行中,可以使用control+c来释放端口的监听,如果不小心使用control+z或者关闭了终端,会导致所监听端口的无法释放,下次如果再次启动node服务,会报Port 3000 is already in use的错误,可以使用如下方法来进行所监听端口的释放:

首先使用如下命令查看所有监听某个端口的服务,例如3000端口:

sudo lsof -i:3000

之后终端会将服务名与进行id告诉我们,如下:

COMMAND PID USER   FD   TYPE             DEVICE SIZE/OFF NODE NAME
node    829  vip   13u  IPv6 0x9c3536500e84e203      0t0  TCP *:hbci (LISTEN)

使用如下命令来杀死对应进程即可:

 sudo kill -9 829

 

© 著作权归作者所有

珲少

珲少

粉丝 895
博文 395
码字总数 478712
作品 0
上海
程序员
私信 提问
全 Javascript 的 Web 开发架构:MEAN

引言 最近在Angular社区的原型开发者间,一种全Javascript的开发架构MEAN正突然流行起来。其首字母分别代表的是:(M)ongoDB——NoSQL的文档数据库,使用JSON风格来存储数据,甚至也是使用JS来...

疯狂的流浪
2014/04/02
4.6K
5
全Javascript的Web开发架构:MEAN和Yeoman

本文由伯乐在线 -华铭 翻译。未经许可,禁止转载! 英文出处:Addy Osmani。欢迎加入翻译组。 引言 最近在Angular社区的原型开发者间,一种全Javascript的开发架构MEAN正突然流行起来。其首字...

伯乐在线
2014/02/18
0
0
Express新手入坑笔记之动态渲染HTML

在日常项目中,我喜欢用Django做后端, 因为大而全 如果只是写一个简单服务的话, Express是更好的选择, Express是基于nodejs的一个后端框架,特点是简单,轻量, 容易搭建, 而且性能非凡,...

木子昭
2018/12/12
0
0
从零开始使用express搭建博客系统(一):前期环境构建与代码初始化

node 这里会有三篇文章,教你从零开始使用express搭建博客系统,每篇文章都很简单,希望大家看完文章能大致入门express。 一,安装node 直接在node官网进行下载,下载下来进行傻瓜式安装,安...

Darrell
2018/02/10
0
0
这绝对是有史以来最详细的web前端学习攻略

  第一阶段:   HTML+CSS:   HTML进阶、CSS进阶、div+css布局、HTML+css整站开发、   JavaScript基础:   Js基础教程、js内置对象常用方法、常见DOM树操作大全、ECMAscript、DOM、...

学习web前端
2017/10/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

金蝶EAS DEP 服务端 脚本

1、服务端执行SQL //服务端更新单据状态var imp = JavaImporter(); imp.importPackage(Packages.com.kingdee.eas.scm.im.inv); imp.importPackage(Packages.com.kingdee.eas.srt.comm......

路过饭堂门口
24分钟前
22
0
Hive之导出文件按逗号分隔到本地文件

如下所示,默认导出的是用\t分隔的,需要使用管道符进行转换,经常使用到,记录下. List-1 hive -e "SELECT * from student" | sed 's/\t/,/g' > /tmp/student.csv...

克虏伯
33分钟前
34
0
转置/解压缩功能(zip的反转)?

我有一个2项元组的列表,我想将它们转换为2个列表,其中第一个包含每个元组中的第一个项目,第二个列表包含第二个项目。 例如: original = [('a', 1), ('b', 2), ('c', 3), ('d', 4)]# an......

技术盛宴
49分钟前
53
0
小猪o2o系统v14.0升级v14.1攻略含小猪CMS微店铺和智慧店铺及小程序百项升级

首先我们要注意升级前的以下几个内容: 即 对环境的要求 网站需求PHP7.1 MYSQL5.1以上 Sw解密组件 解密组件在swoole-loader内 解压缩网站包 修改Conf/db.php内数据库文件 替换数据库内xxx.com...

my_gode
59分钟前
98
0
「干货来袭」Github最全Nodejs资源集

今天给大家分享一下Github上面最全的Nodejs资源集awesome-nodejs,该项目聚合了nodejs各类优质资源,对自立于全栈开发或者想了解nodejs技术栈的开发同学极有帮助,有想进一步了解nodejs的千万...

gamedilong
今天
56
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部