发布于 2026-01-06 0 阅读
0

Node Express:5 分钟内搭建你的第一个 Node 和 Express Web 服务器 步骤 1:安装 Node 步骤 2:配置 npm 步骤 3:安装并导入 Express 中间件 步骤 4:添加 JSON 路由处理程序 步骤 5:添加 HTML 路由处理程序 步骤 6:启动服务器 步骤 7:测试 Node 工作坊材料代码

Node Express: 5分钟内用Node和Express搭建你的第一个Web服务器

步骤 1:安装节点

步骤 2:设置 npm

步骤 3:安装并导入 Express 中间件

步骤 4:添加 JSON路由处理程序

步骤 5:添加 HTML路由处理程序

步骤 5:启动服务器

步骤 6:测试

节点研讨会

材料

代码

我知道,我知道……又一个 Node Express 教程😑。
但如果你还没来得及学习 Node 和搭建服务器,或许这个超快速教程正是你一直在等待的!😆

步骤 1:安装节点

好的,这肯定要花不止 5 分钟,但如果你已经安装了 Node,那就跳过这一步,直接开始吧!

安装适用于您操作系统的最新 LTS 版本

https://nodejs.org/en/download/

为了测试它是否有效,请server.js在项目根目录中创建一个文件。



// server.js
console.log("Hello World!");


Enter fullscreen mode Exit fullscreen mode

然后测试一下



$ node server.js
Hello world!


Enter fullscreen mode Exit fullscreen mode

太棒了!我们准备好进行一些后端开发了!

步骤 2:设置 npm

我们使用 NPM 来管理 Node 包。
初始化 npm 并使其采用默认设置。



$ npm init -y


Enter fullscreen mode Exit fullscreen mode

步骤 3:安装并导入 Express 中间件

中间件是一段可以访问 ` and`对象的代码。目前,可以把Express理解为充当我们代码和 Node 的 HTTP 处理之间的“中间人”🕵️,从而简化了我们的工作requestresponse



$ npm install express


Enter fullscreen mode Exit fullscreen mode


// server.js
const express = require('express');
const server = express();


Enter fullscreen mode Exit fullscreen mode

步骤 4:添加 JSON路由处理程序

每当客户端请求/访问“/json”(localhost:4000/json)时,发送包含“Hello world”消息的 JSON 数据。



// server.js
...
server.get("/json", (req, res) => {
   res.json({ message: "Hello world" });
});


Enter fullscreen mode Exit fullscreen mode

步骤 5:添加 HTML路由处理程序

当客户端请求/访问“/”(localhost:4000)时,发送一个HTML页面文件。

__dirname保存当前模块(server.js)的目录



// server.js
...
server.get("/", (req, res) => {
   res.sendFile(__dirname + '/index.html');
});


Enter fullscreen mode Exit fullscreen mode

创建方式 与“尽情使用 HTML!”index.html相同。或者,如果您喜欢蓝色标题,也可以复制粘贴此代码。server.js



<!DOCTYPE html>
<html lang="en">
 <head>
   <title>Node Workshop</title>
 </head>
 <body>
     <h1 style="color: blue;">
        Express: HELLO WORLD
     </h1>
 </body>
</html>


Enter fullscreen mode Exit fullscreen mode

步骤 5:启动服务器



// server.js
...
const port = 4000;

server.listen(port, () => {
    console.log(`Server listening at ${port}`);
});


Enter fullscreen mode Exit fullscreen mode


# CTRL+C to stop server if currently running
$ npm start


Enter fullscreen mode Exit fullscreen mode

步骤 6:测试



# on another terminal

$ curl http://localhost:4000/json
{"message":"Hello world"}

$ curl http://localhost:4000
<!-- index.html --> ...


Enter fullscreen mode Exit fullscreen mode

或者打开浏览器并访问

黑客

黑客

完整代码



const express = require('express');
const server = express();
const port = 4000;

server.get("/", (req, res) => {
   res.sendFile(__dirname + '/index.html');
});

server.get("/json", (req, res) => {
   res.json({ message: "Hello world" });
});

server.listen(port, () => {
    console.log(`Server listening at ${port}`);
});


Enter fullscreen mode Exit fullscreen mode

“好吧,这很不错。但我该拿它做什么呢?”

添加一些路由和 HTML 页面
,你就拥有了一个 HTML + JSON 服务器!



...
server.get("/items", (req, res) => {
   res.json({ items: [{ "id": 1, "name": "banana" }, 
                      { "id": 2, "name": "apple" }
                     ] 
           });
});

server.get("/info", (req, res) => {
   res.sendFile(__dirname + '/info.html');
});
...


Enter fullscreen mode Exit fullscreen mode

我们需要涵盖更多内容。

  • 构建一个实现 GET / POST / PUT / DELETE 的 RESTful API 服务器
  • 提供可接受数据的模板(而不是静态 HTML)
  • 还有更多!

接下来:

本文是我正在撰写的Node+Express系列文章的一部分。

与此同时,如果你对 Node+Express 还意犹未尽🤓,
不妨看看我的 Node 工作坊(Gihub 代码库和幻灯片):

GitHub 标志 lenmorld / node_workshop

使用 Node、Express 和 MongoDB 为您的下一个 Web 应用程序构建服务器和 API。

节点研讨会

为您的下一个 Web 应用程序创建服务器 + REST API!

本次研讨会将探讨有关 Web 服务器的概念,并通过实践活动进行讲解。这里介绍的代码和概念将为您的下一个 Web 项目奠定良好的基础。主题包括但不限于:

  • 使用 Node 和 Express 构建 Web 服务器和 REST API
  • 了解路由、请求和响应
  • 使用 HTTP 方法实现 CRUD
  • 使用模板构建服务器端渲染的网站
  • 连接到云端 NoSQL 数据库:MongoDB Atlas 数据库
  • 使用会话、cookie 和令牌进行用户身份验证
  • 使用外部 API,例如 GitHub Jobs、Giphy 和 Spotify。

以往活动

材料

预览幻灯片:Google 云端硬盘文档

材料:Notion链接

代码

研讨会后续安排:

$ git checkout dev
$ node server.js

开发最新版

$ git checkout master
$



本文讨论了以下内容:

  • 使用 Node 和 Express
  • 路由、请求和响应
  • 构建 REST API
  • 服务器端渲染模板
  • 连接到 NoSQL(MongoDB)数据库
  • 使用外部 API,例如 Spotify
  • 还有更多!

感谢阅读我的第一篇开发者日志!
祝您服务器运行愉快!

文章来源:https://dev.to/lennythedev/quick-server-with-node-and-express-in-5-minutes-17m7