前言
Express.js 是 Node.js 最流行的 Web 框架之一，适用于构建 Web 应用，API 和微服务。它提供了丰富的 HTTP 工具和插件，使得开发 Web 应用非常简单且高效。
在本文中，我们将使用 Express.js 构建一个简单的日程提醒应用，帮助你更好地理解框架的基本操作和功能。
1. 安装和初始化项目
在开始之前，需要先在系统上安装 Node.js 和 NPM。如果你还没有安装，可以在 Node.js 官网下载最新的 LTS 版本进行安装。
安装完成后，打开终端，创建一个新目录，并进入该目录：
mkdir schedule-app cd schedule-app
初始化一个新的 Node.js 项目，并添加 Express.js 依赖：
npm init -y npm i express
2. 编写基本路由
接下来，我们需要在项目目录中创建一个名为 app.js 的文件，并添加下面的代码：
// javascriptcn.com 代码示例
const express = require('express');
const app = express();
app.get('/', (req, res) => {
res.send('Welcome to Schedule App!');
});
app.listen(3000, () => {
console.log('Schedule App listening on port 3000!');
});这段代码运行了一个简单的 Express.js 服务器，当浏览器访问主页（/）时，它将显示“Welcome to Schedule App!”的文本。
在命令行中运行以下命令：
node app.js
如果一切顺利，你应该会看到终端输出了“Schedule App listening on port 3000!”的消息。
打开浏览器，并访问http://localhost:3000，你将看到 “Welcome to Schedule App!” 的文本显示在页面上。
现在我们已经创建了一个简单的 Express.js 应用程序，并为页面请求创建了路由。接下来，我们将添加一个页面来支持用户添加新的日程提醒。
3. 添加页面模板
在本例中，我们将使用 EJS（Embedded JavaScript）模板作为 Web 应用的视图层。EJS 可以方便地将数据注入 HTML 模板中，并生成最终的 HTML 页面。
继续创建名为 views 的文件夹，并在该文件夹中创建一个名为 add.ejs 的文件并添加以下HTML代码：
// javascriptcn.com 代码示例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Schedule App</title>
</head>
<body>
<h1>Add new Schedule Reminder</h1>
<form method="POST">
<label for="title">Title:</label>
<input type="text" id="title" name="title">
<label for="description">Description:</label>
<textarea id="description" name="description"></textarea>
<label for="date">Date:</label>
<input type="date" id="date" name="date">
<button type="submit">Add</button>
</form>
</body>
</html>这个页面将允许用户输入新的日程提醒的标题、描述和日期。当用户提交表单时，应用程序将收到 POST 请求并在后台保存提醒。
4. 处理 POST 请求
在 app.js 中添加下面的代码：
// javascriptcn.com 代码示例
app.use(express.urlencoded({ extended: true }));
app.get('/add', (req, res) => {
res.render('add.ejs');
});
app.post('/add', (req, res) => {
const newSchedule = {
title: req.body.title,
description: req.body.description,
date: req.body.date
}
console.log(newSchedule); // 输出新日程提醒的内容
res.redirect('/');
});在第一行中，我们使用了 express.urlencoded 中间件来处理表单中的 URL 编码数据，使得应用程序可以正确解析 POST 请求的内容。
接下来，我们为 /add 路由注册了 GET 请求的处理程序。当用户访问 /add 时，应用程序将呈现 add.ejs 页面。res.render 方法将模板渲染为 HTML，将通过模板变量传递给模板，模板将在渲染时使用。
最后，我们注册了用于处理 POST 请求的 /add 路由，并从表单数据中获取标题、描述和日期，创建一个新的日程提醒对象，并将其输出到控制台。
5. 创建 Model
在本节中，我们将创建一个简单的 Model（模型）来存储和检索存储在应用程序中的日程提醒对象。
在项目根目录中创建一个名为 schedule.js 的文件，并添加以下代码：
// javascriptcn.com 代码示例
let schedules = [];
module.exports.add = function(schedule) {
schedules.push(schedule);
};
module.exports.getAll = function() {
return schedules;
};上述代码创建了一个名为 schedules 的空数组并暴露了两个函数来添加以及获取所有日程提醒。add 函数用于将新的日程提醒添加到数组中，getAll 函数则用于检索所有日程提醒。
该订阅可以随时更改为使用数据库或其他数据存储/检索机制。
6. 在应用中使用 Model
现在我们已经创建了一个 Model，我们需要更新应用程序代码以使用该 Model 来管理日程提醒。
在 app.js 中添加以下代码：
// javascriptcn.com 代码示例
const scheduleModel = require('./schedule');
app.get('/', (req, res) => {
const schedules = scheduleModel.getAll(); // 获取所有日程提醒对象
res.render('index.ejs', { schedules: schedules });
});
app.post('/add', (req, res) => {
const newSchedule = {
title: req.body.title,
description: req.body.description,
date: req.body.date
}
scheduleModel.add(newSchedule); // 存储新的日程提醒
res.redirect('/');
});我们将模块 schedule.js 导入到 app.js 中，并使用 scheduleModel 变量引用。当用户打开主页（/）时，应用程序将从 Model 中获取所有日程提醒并显示它们。在创建新的日程提醒时，我们将它们添加到 Model 中。
总结
本文介绍了使用 Express.js 构建一个简单的日程提醒应用的过程。我们涵盖了诸如路由、模板、中间件和 Model 等基本概念。最后，我们以示例代码的形式提供了一些指导，读者可以根据这些建议建立自己的应用程序。
当然，本文所实现仅仅是一个最简单的版本，生产的应用程序需要更为复杂的处理逻辑和更高的安全性考虑。
本文涵盖的主题涉及的篇幅可能过于简略，读者也可以在官网及其他相关教程中进一步学习。 但希望读者可以通过本篇文章了解并激发写出一款日程提醒应用程序的潜力。
参考官方文档：http://expressjs.com/zh-cn/。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6544e48c7d4982a6ebeb163f