首先新建一个目录mkdir myblog,在该目录下运行npm init 生成package.json

然后安装express,加--save写入package.json

npm i express@4.14.0 --save

新建index.js并写入:
var express = require('express');
var app = express(); app.get('/', function(req, res) {
res.send('hello, express');
}); app.listen(3000); //req.query: 解析后的 url 中的 querystring,如 ?name=haha,req.query 的值为 {name: 'haha'} //req.params: 解析 url 中的占位符,如 /:name,访问 /haha,req.params 的值为 {name: 'haha'} //req.body: 解析后请求体,需使用相关的模块,如 body-parser,请求体为 {"name": "haha"},则 req.body 为 {name: 'haha'}

  文件结构如下:



然后全局安装supervisor并启动:

npm install -g supervisor

supervisor --harmony index

supervisor 会监听当前目录下 node 和 js 后缀的文件,当这些文件发生改动时,supervisor 会自动重启程序

安装一个模版引擎ejs:
npm i ejs --save 此时各文件代码如下:
index.js:
var path = require('path');
var express = require('express');
var app = express();
var indexRouter = require('./routes/index');
var userRouter = require('./routes/users'); app.set('views', path.join(__dirname, 'views'));// 设置存放模板文件的目录
app.set('view engine', 'ejs');// 设置模板引擎为 ejs app.use('/', indexRouter);
app.use('/users', userRouter); app.listen(3000);

  routes/index.js:

var express = require('express');
var router = express.Router(); router.get('/', function(req, res) {
res.send('hello, express');
}); module.exports = router;

  routes/users.js:

var express = require('express');
var router = express.Router(); router.get('/:name', function(req, res) {
res.render('users', {
name: req.params.name
});
}); module.exports = router;

  views/header.ejs

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body {padding: 50px;font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;}
</style>
</head>
<body>

  views/footer.ejs

  </body>
</html>

  views/users.ejs:

<%- include('header') %>
<h1><%= name.toUpperCase() %></h1>
<p>hello, <%= name %></p>
<%- include('footer') %>

 

运行: 

访问localhost:3000/users/richard:

https://maninboat.gitbooks.io/n-blog/content/book/3.3%20%E6%A8%A1%E6%9D%BF%E5%BC%95%E6%93%8E.html


 

初始化一个Express项目的更多相关文章

  1. 新建一个express项目的流程

    1.先创建一个文件夹,然后创建一个项目,默认有一个:package.json 文件 #初始化项目 npm init 2.初始化项目会出现一个默认的提醒 #这个实用程序将指导您创建一个包,json文件. ...

  2. 初始化一个vue项目

    1.安装node 端开发框架和环境都是需要 Node.js ,先安装node.js开发环境,vue的运行是要依赖于node的npm的管理工具来实现,下载https://nodejs.org/en/,安 ...

  3. Node.js--安装express以及创建第一个express项目(windows)

    1.根据新版的express出现了安装器的概念,安装express需要两个步骤(命令行找到nodejs目录全局安装): (1)npm install -g express@4.15.0   (也可省略 ...

  4. 如何用vue-cli初始化一个vue项目

    单文件组件和vue-loader 解析打包.vue文件 vue为了能够使我们在项目开发中对组件进行更好的维护,提供了一个单文件组件系统,vue把每一个独立的组件放在一个.vue的文件中,在这个文件中提 ...

  5. 初始化一个React项目(TypeScript环境)

    React将由三部分组成,其中,Redux是应用状态管理服务,React-Router用于路由映射,React View用于显示界面. 我们使用Facebook推荐的create-react-app来 ...

  6. 使用Go module和GoLand初始化一个Go项目

    我最新最全的文章都在南瓜慢说 www.pkslow.com,欢迎大家来喝茶! 1 简介 Golang是一门优秀的语言,特别是在并发编程上,得益于它的协程和channel等,非常方便易用.它通过go m ...

  7. webpack 4.x 从零开始初始化一个vue项目

    创建目录 项目名称: vue-init app css reset.sass js home index.vue router index.js main.js App.vue views index ...

  8. 初始化一个React项目

    1.create-react-app是一个通过npm发布的安装包,在确认Node.js和npm安装好之后,输入下面命令创建. 2.安装结束后,使用下面命令创建应用目录. 3.打开目录 4.运行项目 5 ...

  9. vue学习笔记-初始化一个vue项目(1)

    1.cnpm install -g vue-cliUsage:vue init <template-name> <project-name> 2.我们一般使用webpack模版 ...

随机推荐

  1. git系列讲解

    1.git是什么呢?维基百科给出的定义: git是一个分布式版本控制软件,最初由(Linus Torvalds)创作 什么是版本控制?项目经理与程序员的恩怨情仇企业真实案例:开发了a功能,之后项目所要 ...

  2. IBM MQ Explore使用

    一,版本说明: 系统:win10.MQ:V9.04 二.关于帮助文档: 1.读了差不多一大半,个人感觉说明的比较生僻,应该是直译过来的.但是还是可以从这里面学一下基本的操作. 2.对于一些基本的操作, ...

  3. response.setContentType("text/html;charset=utf-8")后依然乱码的解决方法

    从浏览器获取数据到服务器,服务器将得到数据再显示在浏览器上英文字母正常显示,中文字符乱码的问题,已经使用了 response.setContentType("text/html;charse ...

  4. oc字典

    #import <Foundation/Foundation.h> int main(int argc, const char * argv[]) { @autoreleasepool { ...

  5. Docker学习笔记--2 镜像的创建

    如果我们需要在Docker环境下部署tomcat.redis.mysql.nginx.php等应用服务环境,有下面三种方法: 1,根据系统镜像创建Docker容器,这时容器就相当于是一个虚拟机,进入容 ...

  6. phpstudy iis版本 php4.4.5 和 php5.6.7目录权限问题

    开始用的php4.4.5  +iis 权限设置好了,切换成php5.6.7后目录没有了写入权限,各种百度后未能解决 php4.4.5  +iis  时 iis 匿名身份验证 用户是 IUSR    目 ...

  7. Fakeapp 入门教程(3):参数篇

    参数可以让软件自由度更高.Fakeapp的参数并不算多,但是也非常使用.本文就讲解下几个重要的参数.参数设置界面可以通过点击SETTINGS打开. 参数修改无需点击保存,一旦修改直接生效. Proce ...

  8. python3.7 time模块

    #!/usr/bin/env python __author__ = "lrtao2010" #python3.7 time模块 #time模块没有time.py文件,是内置到解释 ...

  9. #include "*.c"文件的妙用

    在看uCOS II V2.91版本源代码时,在ucos_ii.c源文件中发现下面的代码: #include <os_core.c> #include <os_flag.c> # ...

  10. 1717: [Usaco2006 Dec]Milk Patterns 产奶的模式

    1717: [Usaco2006 Dec]Milk Patterns 产奶的模式 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 1469  Solved: ...