Node.js 和 Express 搭建一个简单的 Web 应用程序

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时,而 Express 是一个简洁而灵活的 Node.js Web 应用程序框架。使用 Express,你可以快速搭建一个 Web 服务器,处理 HTTP 请求和响应。

以下是如何使用 Node.js 和 Express 搭建一个简单的 Web 应用程序的步骤:

1. 安装 Node.js 和 npm

首先,确保你的系统上已经安装了 Node.js 和 npm(Node Package Manager)。你可以通过以下命令检查是否已安装:

node -v

npm -v

如果没有安装,可以从 Node.js 官网 下载并安装。

2. 创建项目目录

创建一个新的项目目录,并进入该目录:

mkdir myapp

cd myapp

3. 初始化项目

使用 npm 初始化项目,生成 package.json 文件:

npm init -y

4. 安装 Express

使用 npm 安装 Express:

npm install express

5. 创建 Express 应用程序

在项目目录中创建一个 app.js 文件,并添加以下代码:

javascript 复制代码
// app.js
const express = require('express');
const app = express();
const port = 3000;

// 定义一个简单的路由
app.get('/', (req, res) => {
  res.send('Hello, World!');
});

// 启动服务器
app.listen(port, () => {
  console.log(`Server is running on http://localhost:${port}`);
});

6. 运行应用程序

使用以下命令运行应用程序:

node app.js

打开浏览器,访问 http://localhost:3000,你应该会看到 "Hello, World!" 的输出。

7. 添加更多路由

你可以添加更多的路由来处理不同的请求。例如:

javascript 复制代码
// app.js
const express = require('express');
const app = express();
const port = 3000;

// 定义一个简单的路由
app.get('/', (req, res) => {
  res.send('Hello, World!');
});

// 定义一个关于页面的路由
app.get('/about', (req, res) => {
  res.send('This is the about page.');
});

// 定义一个用户页面的路由
app.get('/user/:id', (req, res) => {
  res.send(`User ID: ${req.params.id}`);
});

// 启动服务器
app.listen(port, () => {
  console.log(`Server is running on http://localhost:${port}`);
});

8. 使用中间件

Express 支持中间件,可以用来处理请求和响应之间的逻辑。例如,使用 express.json() 中间件来解析 JSON 请求体:

javascript 复制代码
// app.js
const express = require('express');
const app = express();
const port = 3000;

// 使用 express.json() 中间件来解析 JSON 请求体
app.use(express.json());

// 定义一个简单的路由
app.get('/', (req, res) => {
  res.send('Hello, World!');
});

// 定义一个关于页面的路由
app.get('/about', (req, res) => {
  res.send('This is the about page.');
});

// 定义一个用户页面的路由
app.get('/user/:id', (req, res) => {
  res.send(`User ID: ${req.params.id}`);
});

// 定义一个 POST 请求的路由
app.post('/user', (req, res) => {
  const { name, age } = req.body;
  res.send(`User created: Name - ${name}, Age - ${age}`);
});

// 启动服务器
app.listen(port, () => {
  console.log(`Server is running on http://localhost:${port}`);
});

9. 使用模板引擎

Express 支持多种模板引擎,如 EJS、Pug 等。以下是使用 EJS 模板引擎的示例:

安装 EJS

npm install ejs

配置模板引擎
javascript 复制代码
// app.js
const express = require('express');
const app = express();
const port = 3000;

// 设置模板引擎为 EJS
app.set('view engine', 'ejs');

// 定义一个简单的路由
app.get('/', (req, res) => {
  res.render('index', { title: 'Home Page' });
});

// 启动服务器
app.listen(port, () => {
  console.log(`Server is running on http://localhost:${port}`);
});
创建模板文件

在项目目录中创建一个 views 目录,并在其中创建一个 index.ejs 文件:

javascript 复制代码
<!-- views/index.ejs -->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><%= title %></title>
</head>
<body>
  <h1>Welcome to <%= title %></h1>
</body>
</html>
相关推荐
艾小码4 小时前
手把手教你实现一个EventEmitter,彻底告别复杂事件管理!
前端·javascript·node.js
前端小哲5 小时前
MCP从入门到实战
node.js·ai编程
dasseinzumtode6 小时前
nestJS 使用ExcelJS 实现数据的excel导出功能
前端·后端·node.js
梅孔立11 小时前
服务器不支持node.js16以上版本安装?用Docker轻松部署Node.js 20+环境运行Strapi项目
服务器·docker·node.js
XiaoMu_00111 小时前
基于Node.js和Three.js的3D模型网页预览器
javascript·3d·node.js
卿·静11 小时前
Node.js对接即梦AI实现“千军万马”视频
前端·javascript·人工智能·后端·node.js
lvlv_feifei12 小时前
N8N macOS (Apple Silicon) 完整安装配置教程
node.js·workflow
Cosmoshhhyyy1 天前
Node.js 18+安装及Claude国内镜像使用、idea中claude插件下载指南
node.js
徐_三岁1 天前
关于npm的钩子函数
前端·npm·node.js
不买Huracan不改名1 天前
安装Codex(需要用npm)
前端·npm·node.js