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 代码库和幻灯片):
使用 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
开发最新版
本文讨论了以下内容:
使用 Node 和 Express
路由、请求和响应
构建 REST API
服务器端渲染模板
连接到 NoSQL(MongoDB)数据库
使用外部 API,例如 Spotify
还有更多!
感谢阅读我的第一篇开发者日志! 祝您服务器运行愉快!
文章来源:https://dev.to/lennythedev/quick-server-with-node-and-express-in-5-minutes-17m7