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

项目所需,要用到nodejs,那就去学咯。简单的看了下 七天学会NodeJSNode.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. (一)Servlet简介

    相关名词解释 HTML:Hyper Text Markup Language,超文本标记语言 HTTP:Hyper Text Transfer Protocol,超文本传输协议 URL:Uniform ...

  2. java基础学习周计划之1--语言基础

    JAVA语言基础第一天一. 知识点:1. 认识Linux操作系统2. JAVA开发环境3. Eclipse IDE二. 关键问题(理论):1. Linux中常用命令pwd.ls.cd的作用2. 简述J ...

  3. PACKAGE-INFO.JAVA 作用及用法详解

    转自http://strong-life-126-com.iteye.com/blog/806246 及http://blog.sina.com.cn/s/blog_93dc666c0101gzlr. ...

  4. 安卓---RedioButton(单选按钮)、CheckBox(复选按钮)

    <RadioGroup android:layout_width="fill_parent" android:layout_height="wrap_content ...

  5. Golang 的内存管理(上篇)

    Golang 的内存管理基于 tcmalloc,可以说起点挺高的.但是 Golang 在实现的时候还做了很多优化,我们下面通过源码来看一下 Golang 的内存管理实现.下面的源码分析基于 go1.8 ...

  6. BZOJ_4448_[Scoi2015]情报传递_主席树

    BZOJ_4448_[Scoi2015]情报传递_主席树 Description 奈特公司是一个巨大的情报公司,它有着庞大的情报网络.情报网络中共有n名情报员.每名情报员口J-能有 若T名(可能没有) ...

  7. 快照(Snapshot)技术发展综述

    快照(Snapshot)技术发展综述 刘爱贵 摘要:传统数据备份技术存在备份窗口.恢复时间目标RTO和恢复时间点RPO过长的问题,无法满足企业关键性业务的数据保护需求,因此产生了数据快照技术.本文对快 ...

  8. C# 在异步线程操作类的变量

    如下代码: public partial class Form1 : Form { public Form1() { InitializeComponent(); } public string Me ...

  9. Pc与移动端的测试异同性

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px ".PingFang SC"; color: #454545 } p.p2 ...

  10. selenium IDE 使用方法整理

    1.设置起始点(确定case从哪步开始执行),快捷键:S,效果图如下: 2.设置断点(case执行到添加断点处,将自动停止),快捷键:B,效果图如下: 3.设置判断点    如:百度输入ceshi,点 ...