从零开始学习Express.js

Express.js 是一个简洁而灵活的 Node.js Web 应用程序框架，它提供了一组强大的特性帮助你构建高性能、可扩展的网络应用。在本文中，我们将从零开始学习 Express.js，并构建一个简单的 Node.js 应用。

准备工作

在开始之前，我们需要确保以下环境已经安装并配置好：

Node.js
npm (Node.js 的包管理器)

你可以通过在命令行中运行 node -v 和 npm -v 来验证它们是否正确安装。

创建一个新的 Express.js 应用

首先，我们需要创建一个新的 Express.js 应用。按照以下步骤进行操作：

打开命令行工具，并进入你想要创建应用的目录。
运行以下命令来创建一个新的 Express.js 应用：

$ npx express-generator

这将创建一个名为 myapp 的新目录，并在其中生成了 Express.js 的基本文件结构。

$ cd myapp

安装应用所需的依赖：

$ npm install

启动应用：

$ npm start

现在，你的应用应该已经在本地启动，并监听当前系统上的默认端口。在浏览器中访问 http://localhost:3000，你将看到一个欢迎页面。

探索 Express.js 应用结构

现在，让我们来深入了解一下 Express.js 应用的结构。

app.js: 这是应用的主要文件，其中包含了应用的配置和路由信息。
bin/www: 这是应用的入口文件，它将创建一个 HTTP 服务器并启动应用。
public/: 这个目录中存放了应用的公共资源，如样式表和脚本文件。
routes/: 这个目录中包含了应用的路由文件，每个路由文件对应一个或多个路由路径。
views/: 这个目录中存放了应用的视图文件，比如 HTML 文件。
package.json: 这个文件包含了应用的元数据和依赖信息。

添加一个新的路由

现在，我们将向应用中添加一个新的路由和对应的页面。

在 routes/ 目录中创建一个新的文件，命名为 users.js。
在 users.js 文件中，添加以下代码：

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

/* GET users listing. */
router.get('/', function(req, res, next) {
  res.send('respond with a resource');
});

module.exports = router;

这段代码定义了一个简单的路由，当访问 /users 路径时，将返回 "respond with a resource"。

在 app.js 文件中，将以下代码添加到路由部分的末尾：

var usersRouter = require('./routes/users');
app.use('/users', usersRouter);

这将告诉 Express.js 应用在 /users 路径下使用 usersRouter 这个路由。

重新启动应用并访问 http://localhost:3000/users，你将看到 "respond with a resource"。

构建动态页面

在现实世界的应用中，页面通常是动态生成的。让我们来创建一个返回动态内容的页面。

在 views/ 目录下创建一个名为 user.ejs 的文件，并添加以下代码：

<!DOCTYPE html>
<html>
<head>
  <title>User Profile</title>
</head>
<body>
  <h1>User Profile</h1>
  <p>User ID: <%= userId %></p>
  <p>Username: <%= username %></p>
</body>
</html>

这是一个简单的 EJS 模板，它将根据传入的 userId 和 username 渲染页面内容。

在 users.js 文件中修改 / 路由的处理函数：

router.get('/', function(req, res, next) {
  res.render('user', { userId: 1, username: 'John' });
});

这将告诉应用在访问 /users 路径时使用 user.ejs 模板渲染页面，并传入 userId 和 username。

重新启动应用并访问 http://localhost:3000/users，你将看到一个包含用户信息的页面。

总结

通过这篇博客，我们学习了如何从零开始使用 Express.js 构建一个简单的 Node.js 应用。我们了解了 Express.js 的基本结构和用法，并学会了添加路由和构建动态页面。希望这篇博客对你学习 Express.js 有所帮助！

本文来自极简博客，作者：网络安全守护者，转载请注明原文链接：从零开始学习Express.js