简单的记录下关于如何使用nodejs+Express 极速搭建一个web应用。

项目所需，要用到nodejs，那就去学咯。简单的看了下 七天学会NodeJS，Node.js 教程。发现其实好简单的，分分钟上手，这里只是简单记录，nodejs 对数据库的操作不做详细介绍。

 看七天不存在的，呵呵。大概的过了一遍，然后开始干活。

首先显得有nodejs环境吧，nodejs下载地址，安装完毕后，检查版本号，看是否成功安装。

huangenaideMacBook-Pro:x-wallet huangenai$ node --version

v10.12.0

NPM是随同NodeJS一起安装的包管理工具，测试是否安装成功。

huangenaideMacBook-Pro:x-wallet huangenai$ npm --version

6.4.

先简单了解下什么是 Express ➡️ http://Express.com

Fast, unopinionated, minimalist web framework for Node.js。

嗯，又快又简单，适合我。

新建一个文件夹nodejsDemo  创建一个 package.json

npm init
package name: (nodejsDemo) nodejs-demoe

version: (1.0.)

description: none

entry point: (index.js) server.js

test command:

git repository:

keywords:

author: huangenai

license: (ISC)

About to write to /Users/huangenai/Desktop/test/nodejsDemo/package.json:

{

  "name": "nodejs-demoe",

  "version": "1.0.0",

  "description": "none",

  "main": "server.js",

  "directories": {

    "test": "test"

  },

  "scripts": {

    "test": "echo \"Error: no test specified\" && exit 1"

  },

  "author": "huangenai",

  "license": "ISC"

}

Is this OK? (yes) y

新建文件server.js

touch server.js

新建app文件夹，并在app文件夹下新建index.html

mkdir app

cd app

touch index.html

大致目录

项目目录下，安装express模块

npm install express 

根据情况安装所需要的模块

npm install body-parser --save   //处理 JSON, Raw, Text 和 URL 编码的数据。

npm install cookie-parser --save  //解析Cookie工具,通过req.cookies取到cookie并转成对象

npm install multer --save   //用于处理 enctype="multipart/form-data"（设置表单的MIME编码）的表单数据

安装 nodemon，使用nodemon来启动程序，这样不用每次改了 又要重新启动了。

npm install nodemon

server.js

var express = require('express');

var app = express();

var bodyParser = require('body-parser');

var urlencodedParser = bodyParser.urlencoded({

  extended: false

})

app.use(express.static('public'));

app.get('/', function (req, res) {

  res.sendFile(__dirname + "/app/index.html");

})

app.get('/test', function (req, res) {

  res.send("test");

})

app.post('/helloworld', urlencodedParser, function (req, res) {

  var data = req.body.data;

  res.send(data);

  res.end();

})

var server = app.listen(, function () {

  var host = server.address().address

  var port = server.address().port

  console.log("server start port:" + port)

})

app/index.js

<!DOCTYPE html>

<html lang="zh-CN">

<head>

  <meta charset="utf-8">

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>helloworld</title>

</head>

<body>

  <h1>index page</h1>

  <button id="helloworld">helloworld</button>

  <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>

  <script type="text/javascript">

    $(function () {

      $('#helloworld').on('click', function () {

        $.post("http://localhost:8001/helloworld", {

          data: "hello world！"

        }, function (res) {

          alert(res)

        })

      })

    })

  </script>

</body>

</html>

修改package.json scripts 新增 start 启动。

启动程序

npm run start

效果

此随笔乃本人学习工作记录，如有疑问欢迎在下面评论，转载请标明出处。

如果对您有帮助请动动鼠标右下方给我来个赞，您的支持是我最大的动力。

Nodejs+Express 搭建 web应用的更多相关文章

  1. 用Nodejs+Express搭建web，nodejs路由和Ajax传数据并返回状态，nodejs+mysql通过ajax获取数据并写入数据库

    小编自学Nodejs,看了好多文章发现都不全,而且好多都是一模一样的 当然了,这只是基础的demo,经供参考,但是相信也会有收获 今天的内容是用Nodejs+Express搭建基本的web,然后呢no ...

  2. [NodeJs] 用Nodejs+Express搭建web，nodejs路由和Ajax传数据并返回状态，nodejs+mysql通过ajax获取数据并写入数据库

    小编自学Nodejs,看了好多文章发现都不全,而且好多都是一模一样的 当然了,这只是基础的demo,经供参考,但是相信也会有收获 今天的内容是用Nodejs+Express搭建基本的web,然后呢no ...

  3. 【nodejs之我的开源module】 使用express搭建web服务器，代码即文档的实现。

    前言 都说nodejs适合制作restful_API,因为它有异步处理能力,能吞吐更多的请求,这一点是大家都认可的.前不久我使用nodejs+express+postgresql搭建了一个restfu ...

  4. nodejs+express搭建服务器

    1.Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具. 使用 Express 可以快速地搭建一个完整功能 ...

  5. 用nodejs+express搭建前端测试服务端

    平时开发前端应用,如果没有现成的后端接口调试,又要保证前端进度,该怎么办呢,当然办法还是很多的,很多大牛都分享过很多经验,我也来说说我常用的方法. 请求本地数据文件 把本地数据放到程序指定目录,发起h ...

  6. nodejs+express搭建小程序后台服务器

    本文使用node.js和express来为小程序搭建服务器.node.js简单说是运行在服务端的javascript:而express是node.js的一个Web应用框架,使用express可以非常简 ...

  7. nodejs express搭建一个网站整理

    先前用安卓完成了一个优惠券搜索的app,发现在app上操作比较麻烦,于是决定弄个网页版的.做网站是自己的擅长的,毕竟毕业之后咱一直用asp.net mvc做网站也好几个年头了. 可是这次我又想换个方式 ...

  8. express搭建web服务器、路由、get、post请求、multer上传文件、EJS模板引擎的使用

    express官网 postman工具下载地址  multer的npm文档地址 express模板引擎怎么使用  地址:http://www.expressjs.com.cn/guide/using- ...

  9. NodeJS+Express开发web,为什么中文显示为乱码

    把你的文件另存为下,格式为utf-8的试下就行!

随机推荐

  1. 如何查看selenium的版本号

    方法一: 打开cmd,输入python >>> import selenium >>> help(selenium) Help on package seleniu ...

  2. 从零开始学Web之HTML（二）标签、超链接、特殊符号、列表、音乐、滚动、head等

    大家好,这里是 Daotin 从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享 ...

  3. j2ee 使用db.properties连接mysql数据库

    转自: http://blog.csdn.net/u013815546/article/details/50808493 注: 下面的方法是未安装构架的写法,需要自己加载驱动并建立连接. 若引入了Ac ...

  4. Java 学习笔记 (二) Selenium WebDriver Java 弹出框

    下面这段实例实现了以下功能: 1. profile使用用户本地电脑上的 (selenium 3有问题.因为selenium 3把profile复制到一个temp文件夹里,但并不复制回去.所以每次打开仍 ...

  5. random.nextInt()与Math.random()基础用法

    相关文章:关于Random(47)与randon.nextInt(100)的区别 1.来源 random.nextInt() 为 java.util.Random类中的方法: Random类中还提供各 ...

  6. c# Web.config中 windows连接数据库

    <add name="DataModel" connectionString="data source=iZ25i7k61adZ;initial catalog=P ...

  7. BZOJ_1100_[POI2007]对称轴osi_KMP+计算几何

    BZOJ_1100_[POI2007]对称轴osi_KMP+计算几何 Description FGD小朋友——一个闻名遐迩的年轻数学家——有一个小MM,yours.FGD小朋友非常喜欢他的MM,所以他 ...

  8. BZOJ_4872_[Shoi2017]分手是祝愿_概率与期望

    BZOJ_4872_[Shoi2017]分手是祝愿_概率与期望 Description Zeit und Raum trennen dich und mich. 时空将你我分开.B 君在玩一个游戏,这 ...

  9. Spring 系列之Spring常用注解总结

    传统的Spring做法是使用.xml文件来对bean进行注入或者是配置aop.实物,这么做有两个缺点: 1.如果所有的内容都配置在.xml文件中,那么.xml文件将会十分庞大:如果按需求分开.xml文 ...

  10. CentOS 本地和网络yum源简单说明及配置

    1.简述 Yellow dog Updater, Modified由Duke University团队,修改Yellow Dog Linux的Yellow Dog Updater开发而成,是一个基于R ...