Node Express框架快速入门教程

最新推荐文章于 2023-06-27 02:21:33 发布

super code

最新推荐文章于 2023-06-27 02:21:33 发布

阅读量236

点赞数 1

分类专栏： Node.js 笔记 JavaScript 基础笔记文章标签： node.js

本文链接：https://blog.csdn.net/m0_52128556/article/details/119898559

版权

笔记同时被 3 个专栏收录

8 篇文章 0 订阅

订阅专栏

JavaScript 基础笔记

8 篇文章 0 订阅

订阅专栏

Node.js

3 篇文章 0 订阅

订阅专栏

`Express` 框架

介绍 `Express` 框架是什么

Express 是一个基于 Node平台的Web应用开发框架，它提供了一系列的强大特性，帮助你创建各种Web应用。

下载

npm install express

Express 框架特性

提供了简洁的路由定义方式
对获取 http 请求参数进行了简化处理
对模板引擎支持程度高，方便渲染动态HTML页面
拥有中间件机制有效控制 HTTP 请求
拥有大量第三方中间件对功能进行扩展

1、搭建 `Express` 开发环境

# 安装express脚手架，此命令不需要每次执行
$ cnpm i express-generator -g

# 创建项目
$ express -e jd-server

# 进入项目根目录
$ cd jd-server

# 初始化依赖
$ cnpm i

配置项目启动

在 package.json 文件中，修改启动命令：

{
    "scripts": {
        "start": "nodemon ./bin/www"
    }
}

配置完成后执行 npm start 命令启动项目，在浏览器地址栏访问 http://localhost:3000/,即可执行添加得路由（端口号）

2、项目目录结构

- public 服务器的静态资源文件管理目录
- routes 路由管理目录
- views 网页模板文件管理目录
- app.js 入口文件
- package.json NPM配置文件

3、创建模块的流程

以学生模块为例，创建步骤：

第1步：创建路由文件

在 routes 目录下创建 stu.js， /routes/stu.js 示例代码：

var router = require('express').Router();

//跳转添加学生页面
router.get('/page/add', function(req,res){
    //渲染模板
    res.render('stu_add')
})

module.exports = router

第2步：创建一级路由

在 app.js 入口文件中注册一级路由，app.js 示例代码：

var express = require('express')
//引入路由文件
var stuRouter = require('./routes/stu.js')

var app = express()

//声明一级路由
app.use('/stu', stuRouter)

第3步：创建模板文件

在 /views 目录下创建 stu_add.ejs 文件，/views/stu_add.ejs 示例代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>添加学生</h1>
    <form action="/stu/add" method="POST">
        <div>
            学生姓名：<input type="text" name="stuname">
        </div>
        <div>
            学生年龄：<input type="text" name="age">
        </div>
        <div>
            <button type="submit">提交</button>
        </div>
    </form>
</body>
</html>

第4步：创建添加学生数据的路由

在 /routes/stu.js 文件中添加 /add 二级路由，/routes/stu.js 示例代码：

var router = require('express').Router();

router.get('/page/add', function(req,res){
    res.render('stu_add')
})

//添加以下代码
router.post('/add', function(req,res){
    //接收post请求参数
    let stu = req.body
    
    //添加数据库
})

module.exports = router

super code

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Node Express框架快速入门教程

Express 框架介绍 Express 框架是什么Express 是一个基于 Node平台的Web应用开发框架，它提供了一系列的强大特性，帮助你创建各种Web应用。下载npm install expressExpress 框架特性提供了简洁的路由定义方式对获取 http 请求参数进行了简化处理对模板引擎支持程度高，方便渲染动态HTML页面拥有中间件机制有效控制 HTTP 请求拥有大量第三方中间件对功能进行扩展1、搭建 Express 开发环境# 安装express脚手
复制链接

扫一扫