在 Web 开发中，Express.js 是一个非常流行的 Node.js 框架，它提供了快速、简单、灵活的方式来构建 Web 应用程序。本教程将介绍如何使用 Express.js 构建一个简单的博客应用，并包含示例代码。
前置知识
在开始本教程之前，您需要掌握以下技术：
- Node.js 知识
- JavaScript 基础知识
- HTML、CSS 和基本的前端知识
- MongoDB 数据库基本知识
如果您还不熟悉上述技术，请先学习相关知识。
步骤
1. 安装 Express.js
在开始构建应用程序之前，您需要安装 Express.js。您可以使用以下命令进行安装：
npm install express --save
2. 创建 Express.js 应用程序
创建一个新的文件夹，并在其中创建一个新的文件 app.js。然后，使用以下代码创建一个 Express.js 应用程序：
const express = require('express');
const app = express();
app.listen(3000, () => {
console.log('Server started on port 3000');
});在上面的代码中，我们导入了 express 模块，并创建了一个新的 Express.js 应用程序。然后，我们使用 app.listen 方法来启动服务器并监听端口 3000。
3. 配置路由
在 Express.js 中，路由用于将请求发送到正确的处理程序。我们可以使用 app.get 方法来创建路由。例如，以下代码将创建一个简单的路由，将请求发送到 / 路径：
app.get('/', (req, res) => {
res.send('Hello World!');
});在上面的代码中，我们使用 app.get 方法来创建一个路由，将请求发送到 / 路径。当请求到达时，我们使用 res.send 方法将消息发送回客户端。
4. 集成 MongoDB
在本教程中，我们将使用 MongoDB 来存储博客文章。我们可以使用 mongoose 模块来连接 MongoDB 数据库。首先，我们需要安装 mongoose：
npm install mongoose --save
然后，我们可以使用以下代码连接到 MongoDB 数据库：
-- -------------------- ---- ------- ----- -------- - -------------------- -------------------------------------------- - ---------------- ----- ------------------- ---- ---------- -- - -------------------- ------------- -------------- -- - ---------------------- ---------- -------- ----- ---
在上面的代码中，我们使用 mongoose.connect 方法连接到 MongoDB 数据库。我们还传递了一些选项，如 useNewUrlParser 和 useUnifiedTopology。这些选项可以帮助我们避免一些常见的错误。
5. 创建博客文章模型
在本教程中，我们将创建一个简单的博客应用程序，它将包含博客文章和评论。首先，我们需要创建一个博客文章模型。我们可以使用 mongoose.Schema 方法来定义模型。例如，以下代码将创建一个新的博客文章模型：
-- -------------------- ---- -------
----- -------- - --------------------
----- ---------- - --- -----------------
------ -
----- -------
--------- ----
--
-------- -
----- -------
--------- ----
--
----------- -
----- -----
-------- --------
-
---
----- ---- - ---------------------- ------------
-------------- - -----在上面的代码中，我们使用 mongoose.Schema 方法创建了一个新的模式，并定义了 title、content 和 created_at 属性。然后，我们使用 mongoose.model 方法将模式编译为模型，并导出该模型。
6. 创建路由处理程序
现在，我们需要创建一些路由处理程序来处理我们的请求。我们可以使用以下代码创建一个路由处理程序，用于获取所有博客文章：
-- -------------------- ---- -------
----- ------- - -------------------
----- ------ - -----------------
----- ---- - --------------------------
--------------- ----- ----- ---- -- -
--- -
----- ----- - ----- --------------
----------------
- ----- ----- -
-------------------
---------------------------- --------
-
---
-------------- - -------在上面的代码中，我们使用 router.get 方法创建一个路由处理程序，用于获取所有博客文章。我们使用 Blog.find 方法从数据库中检索所有博客文章，并使用 res.json 方法将它们发送回客户端。如果发生错误，我们将使用 res.status 方法发送错误消息。
7. 集成路由
现在，我们需要将路由集成到我们的应用程序中。我们可以使用以下代码将路由添加到我们的应用程序中：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- --- - ---------- ----- ---------- - -------------------------- ----------------- ------------ ---------------- -- -- - ------------------- ------- -- ---- ------- ---
在上面的代码中，我们使用 app.use 方法将 /blogs 路径映射到我们的博客路由处理程序。这意味着当客户端发送 /blogs 请求时，我们的应用程序将使用博客路由处理程序来处理请求。
8. 创建前端页面
现在，我们需要创建一个前端页面来显示博客文章。我们可以使用以下代码创建一个简单的 HTML 页面：
-- -------------------- ---- -------
--------- -----
------
------
--------- ------------
-------
------
------ ---------
--- --------------------
------- ---------------------------
-------
-------在上面的代码中，我们创建了一个简单的 HTML 页面，并在其中包含了一个用于显示博客文章的列表。我们还使用 <script> 标签引入了一个 JavaScript 文件，该文件将获取博客文章并将它们添加到列表中。
9. 创建前端 JavaScript 文件
我们需要创建一个 JavaScript 文件来获取博客文章并将它们添加到列表中。我们可以使用以下代码创建一个简单的 JavaScript 文件：
-- -------------------- ---- -------
----- -------- - -------------------------------------
---------------
--------- -- -----------
---------- -- -
----------------- -- -
----- -- - -----------------------------
------------ - -----------
-------------------------
---
---在上面的代码中，我们使用 fetch 方法从服务器获取博客文章。然后，我们使用 res.json 方法将响应转换为 JSON 格式。最后，我们使用 forEach 方法将博客文章添加到列表中。
10. 运行应用程序
现在，我们已经完成了所有的设置，可以运行我们的应用程序。在终端中，使用以下命令启动服务器：
node app.js
在浏览器中访问 http://localhost:3000，您应该能够看到一个包含所有博客文章的列表。
总结
在本教程中，我们介绍了如何使用 Express.js 构建一个简单的博客应用程序。我们学习了如何配置路由、集成 MongoDB、创建博客文章模型、创建路由处理程序、集成路由、创建前端页面和 JavaScript 文件。通过本教程，您可以学习到如何使用 Express.js 构建 Web 应用程序，并了解了一些常见的 Web 开发技术。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6572e269d2f5e1655dbea457