简单的记录下关于如何使用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. python已安装了一个包,但是导入包中的模块时报错没有这个包

    执行import sys; print(sys.path)查看python搜索路径,确保自己的模块在python搜索路径中 python的搜索路径与包(package) python的搜索路径其实是一 ...

  2. bzoj3236 作业 莫队+树状数组

    莫队+树状数组 #include<cstdio> #include<cstring> #include<iostream> #include<algorith ...

  3. BZOJ_4378_[POI2015]Logistyka_树状数组

    BZOJ_4378_[POI2015]Logistyka_树状数组 Description 维护一个长度为n的序列,一开始都是0,支持以下两种操作: 1.U k a 将序列中第k个数修改为a. 2.Z ...

  4. BZOJ_2298_[HAOI2011]problem a_线段树

    BZOJ_2298_[HAOI2011]problem a_线段树 Description 一次考试共有n个人参加,第i个人说:“有ai个人分数比我高,bi个人分数比我低.”问最少有几个人没有说真话( ...

  5. Java基础-抽象类和接口

    抽象类与接口是Java语言中对抽象概念进行定义的两种机制,正是由于他们的存在才赋予java强大的面向对象的能力.他们两者之间对抽象概念的支持有很大的相似,甚至可以互换,但是也有区别. 抽象定义: 抽象 ...

  6. Java并发编程阅读笔记-Java监视器模式示例

    1.前言 书中在解释Java监视器模式的时候使用了一个车辆追踪器例子,根据不同的使用场景给出了不同的实现和优化. 2.监视器模式示例 实现一个调度车辆的"车辆追踪器",每台车使用一 ...

  7. 车牌定位与畸变校正(python3.7,opencv4.0)

    一.前言及思路简析 目前车牌识别系统在各小区门口随处可见,识别效果貌似都还可以.查阅资料后,发现整个过程又可以细化为车牌定位.畸变校正.车牌分割和内容识别四部分.本篇随笔主要介绍车牌定位及畸变校正两部 ...

  8. 解决tomcat部署项目中碰到的几个问题

    在tomcat上部署项目并进行测试,经常会碰到各种问题.在不同的操作系统上部署,对问题的解决也会有一些差异. 1 发现问题 1.1 项目部署 先将项目达成war包,放到tomcat的webapps目录 ...

  9. ES 11 - 配置Elasticsearch的映射 (mapping)

    目录 1 映射的相关概念 1.1 什么是映射 1.2 映射的组成 1.3 元字段 1.4 字段的类型 2 如何配置mapping 2.1 创建mapping 2.2 更新mapping 2.3 查看m ...

  10. 强化学习(十五) A3C

    在强化学习(十四) Actor-Critic中,我们讨论了Actor-Critic的算法流程,但是由于普通的Actor-Critic算法难以收敛,需要一些其他的优化.而Asynchronous Adv ...