首先把这个库加载下来

npm install -g express

这样会安装它所有依赖包,这个非常恐怖。这个框架要依赖这么多外来的东西,如果有一个不与时俱进就会拖累整个框架的质量。


C:\windows\System32>npm install -g express
npm http GET https://registry.npmjs.org/express
npm http 304 https://registry.npmjs.org/express
npm http GET https://registry.npmjs.org/commander/1.2.0
npm http GET https://registry.npmjs.org/connect/2.8.5
npm http GET https://registry.npmjs.org/range-parser/0.0.4
npm http GET https://registry.npmjs.org/mkdirp/0.3.5
npm http GET https://registry.npmjs.org/cookie/0.1.0
npm http GET https://registry.npmjs.org/buffer-crc32/0.2.1
npm http GET https://registry.npmjs.org/fresh/0.2.0
npm http GET https://registry.npmjs.org/methods/0.0.1
npm http GET https://registry.npmjs.org/send/0.1.4
npm http GET https://registry.npmjs.org/cookie-signature/1.0.1
npm http GET https://registry.npmjs.org/debug
npm http 304 https://registry.npmjs.org/cookie/0.1.0
npm http 304 https://registry.npmjs.org/buffer-crc32/0.2.1
npm http 304 https://registry.npmjs.org/fresh/0.2.0
npm http 304 https://registry.npmjs.org/mkdirp/0.3.5
npm http 304 https://registry.npmjs.org/methods/0.0.1
npm WARN package.json methods@0.0.1 No repository field.
npm WARN package.json methods@0.0.1 No readme data.
npm http 304 https://registry.npmjs.org/cookie-signature/1.0.1
npm WARN package.json cookie-signature@1.0.1 No repository field.
npm http 304 https://registry.npmjs.org/debug
npm http 304 https://registry.npmjs.org/commander/1.2.0
npm http 304 https://registry.npmjs.org/range-parser/0.0.4
npm WARN package.json range-parser@0.0.4 No repository field.
npm http 304 https://registry.npmjs.org/send/0.1.4
npm http 304 https://registry.npmjs.org/connect/2.8.5
npm http GET https://registry.npmjs.org/mime
npm http GET https://registry.npmjs.org/keypress
npm http GET https://registry.npmjs.org/formidable/1.0.14
npm http GET https://registry.npmjs.org/bytes/0.2.0
npm http GET https://registry.npmjs.org/qs/0.6.5
npm http GET https://registry.npmjs.org/pause/0.0.1
npm http GET https://registry.npmjs.org/uid2/0.0.2
npm http 304 https://registry.npmjs.org/keypress
npm http 304 https://registry.npmjs.org/pause/0.0.1
npm http 304 https://registry.npmjs.org/formidable/1.0.14
npm WARN package.json pause@0.0.1 No repository field.
npm http 304 https://registry.npmjs.org/qs/0.6.5
npm http 304 https://registry.npmjs.org/uid2/0.0.2
npm WARN package.json uid2@0.0.2 No repository field.
npm WARN package.json uid2@0.0.2 No readme data.
npm http 304 https://registry.npmjs.org/mime
npm http 304 https://registry.npmjs.org/bytes/0.2.0
npm WARN package.json bytes@0.2.0 No repository field.
C:\Users\正美\AppData\Roaming\npm\express -> C:\Users\正美\AppData\Roaming\npm\n
ode_modules\express\bin\express
express@3.3.5 C:\Users\正美\AppData\Roaming\npm\node_modules\express
├── methods@0.0.1
├── range-parser@0.0.4
├── cookie-signature@1.0.1
├── fresh@0.2.0
├── buffer-crc32@0.2.1
├── cookie@0.1.0
├── debug@0.7.2
├── mkdirp@0.3.5
├── commander@1.2.0 (keypress@0.1.0)
├── send@0.1.4 (mime@1.2.11)
└── connect@2.8.5 (uid2@0.0.2, pause@0.0.1, qs@0.6.5, bytes@0.2.0, formidable
@1.0.14)

然后我们在控制台切换到E盘,输入如下命令,创建一个目录,进入到它里面

E:\>mkdir helloworld

E:\>cd helloworld

里面创建一个json文件,里面记录我们要依赖的包,项目名,版本号什么的,然后通过npm安装

{
"name": "helloworld",
"description": "hello world test app",
"version": "0.0.1",
"private": true,
"dependencies": {
"express": "3.x"
}
}

然后执行npm install命令,Express 3.x 和它的依赖就安装到你的 ./node_modules 目录里了

到这里,我们才开始写代码!创建一个名为app.js 或者 server.js的文件,叫什么看你个人喜好了。 引入express 然后使用代码 express()创建一个新的应用程序:


var express = require('express');
var app = express();

现在我们要处理HTTP请求,返回hello world字样给前端


var express = require('express');
var app = express(); app.get('/', function(req, res){
res.send('hello world');
}); app.listen(3000);

然后在控制台执行node app, 打开浏览器就看到hello world的字样了。

好了,我们继续前进。在当前目录建立一个index.html页面。此时,目录结构为:

node_modules
app.js
index.html
package.json

页面内容如下,暂时不引入JS与CSS文件

<!DOCTYPE html>
<html>
<head>
<title>index</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<h3>高级大气国际化的express.js页面</h3>
<div>by 司徒正美</div>
</body>
</html>

app.js文件的内容改成:


var express = require('express');
var app = express(); app.get('/', function(req, res){
res.send('hello world');
}); app.listen(3000);

刷新浏览器,就能发现正确地输出页面。在stackoverflow这篇文章中《Render basic HTML view in Node JS Express》,提到另外两个方法。一个要用register方法,但这是express2.x的方法,现在已经移除;一个要用到engine 方法,它是用来指定模板引擎,但express默认什么引擎也不加载,因此我暂时也放弃它。

最后我们看看如何引入静态资态。我们在当前目录建立一个public文件夹,里面放置style.css, test.js文件:

window.onload = function(){
var p = document.createElement("p");
p.innerHTML = "动态创建元素节点"
document.body.appendChild(p)
}
h3{
background:violet;
color:#fff;
}

然后app.js文件加多一行,变成这样

var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public')); app.get('/', function(req, res){
res.sendfile('index.html');
}); app.listen(3000);

然后index.html改成这样:

<!DOCTYPE html>
<html>
<head>
<title>index</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="style.css"/>
<script src="test.js"></script>
</head>
<body>
<h3>高级大气国际化的express.js页面</h3>
<div>by 司徒正美</div>
</body>
</html>

刷新页面,就能看到效果了!

express 学习笔记的更多相关文章

  1. Node 之 Express 学习笔记 第一篇 安装

    最近由于工作不忙,正好闲暇时间学学基于 node 的 web开发框架. 现在关于web开发框架除了Express 还有新出的 KOA以及其它一些. 但是想想还是先从 Express 入手吧.因为比较成 ...

  2. Node 之 Express 学习笔记 第二篇 Express 4x 骨架详解

    周末,没事就来公司加班继续研究一下Express ,这也许也是单身狗的生活吧. 1.目录结构: bin, 存放启动项目的脚本文件 node_modules, 项目所有依赖的库,以及存放 package ...

  3. Express 学习笔记纯干货(Routing、Middleware、托管静态文件、view engine 等等)

    原始文章链接:http://www.lovebxm.com/2017/07/14/express-primer/ 1. Express 简介 Express 是基于 Node.js 平台,快速.开放. ...

  4. express 学习笔记(一)路由

    先导入express: var express = require('express'); var app = express(); 1.路由方法: get, post, put, head, del ...

  5. Nodejs学习笔记(六)--- Node.js + Express 构建网站预备知识

    目录 前言 新建express项目并自定义路由规则 如何提取页面中的公共部分? 如何提交表单并接收参数? GET 方式 POST 方式 如何字符串加密? 如何使用session? 如何使用cookie ...

  6. Nodejs学习笔记(六)—Node.js + Express 构建网站预备知识

    前言 前面经过五篇Node.js的学习,基本可以开始动手构建一个网站应用了,先用这一篇了解一些构建网站的知识! 主要是些基础的东西... 如何去创建路由规则.如何去提交表单并接收表单项的值.如何去给密 ...

  7. Nodejs学习笔记(三)——一张图看懂Nodejs建站

    前言:一条线,竖着放,如果做不到精进至深,那就旋转90°,至少也图个幅度宽广. 通俗解释上面的胡言乱语:还没学会爬,就学起走了?! 继上篇<Nodejs学习笔记(二)——Eclipse中运行调试 ...

  8. Nodejs学习笔记(二)——Eclipse中运行调试Nodejs

    前篇<Nodejs学习笔记(一)——初识Nodejs>主要介绍了在搭建node环境过程中遇到的小问题以及搭建Eclipse开发Node环境的前提步骤.本篇主要介绍如何在Eclipse中运行 ...

  9. <老友记>学习笔记

    这是六个人的故事,从不服输而又有强烈控制欲的monica,未经世事的千金大小姐rachel,正直又专情的ross,幽默风趣的chandle,古怪迷人的phoebe,花心天真的joey——六个好友之间的 ...

随机推荐

  1. OpenStack介绍

    简介 OpenStack是一个开源的云计算管理平台项目,由几个主要的组件组合起来完成具体工作.OpenStack支持几乎所有类型的云环境,项目目标是提供实施简单.可大规模扩展.丰富.标准统一的云计算管 ...

  2. Quickhit快速击键

    一.项目分析 根据输入速率和正确率将玩家分为不同等级,级别越高,一次显示的字符数越多,玩家正确输入一次的得分也越高.如果玩家在规定时间内完成规定次数的输入,正确率达到规定要求,则玩家升级.玩家最高级别 ...

  3. UVa (一道比较复杂的广搜) 816 Abbott’s Revenge

    题意: 给出一个迷宫,在迷宫的节点处,面向某个方向只能向给定的方向转弯.给出起点和终点输出迷宫的最短路径,这里指的是刚刚离开起点的时刻,所以即使起点和终点重合路径也非空. 分析: 用三个变量来表示状态 ...

  4. blocked because of many connection errors; unblock with 'mysqladmin flush-hosts;MySQL在远程访问时非常慢的解决方法;MySql链接慢的解决方法

     一:服务器异常:Host 'xx.xxx.xx.xxx' is blocked because of many connection errors; unblock with 'mysqladmin ...

  5. Windows Tftpd32 DHCP服务器 使用

    /********************************************************************* * Windows Tftpd32 DHCP服务器 使用 ...

  6. HDU 5273 Dylans loves sequence (逆序对,暴力)

    题意: 给定一个序列,对于q个询问:(L,R)之间有几个逆序对?序列元素个数上限1000,q上限10万.仅1测试例子. 思路: [L,R]的逆序对数量可以这么算,假设L<=K<R,将区间拆 ...

  7. (转)每天一个Linux命令(5): rm

    http://www.cnblogs.com/peida/archive/2012/10/26/2740521.html 昨天学习了创建文件和目录的命令mkdir ,今天学习一下linux中删除文件和 ...

  8. AIX 第4章 指令记录

    root@db:/#lsdev -Cc disk --查看磁盘设备信息   -C customized -c class hdisk0       Available 00-08-00 SAS Dis ...

  9. linux 命令部分说明

    shell 文件头格式   #! /bin/sh 定义变量  dir_tmp=/tmp/xxx 级联创建 mkdir -p /etc/aaa/bbb 阻塞命令 等待用户输入回车  继续    read ...

  10. background-size background-positon合并的写法

    background:url('../../image/banner/banner1.jpg') #fff no-repeat 5px center/50px 50px; "/"前 ...