学习 MERN Stack 第 44 天

我的 Express.js 服务器以前只发送 JSON 数据。今天我改变了这一点。

我学习了如何直接从后端提供 HTML、CSS 和图像。这使我的项目从一个简单的 API 变成了一个全栈应用程序。

我通过 Complete Coding 的后端学习路径来掌握文件路由。

在真实的生产环境中,你需要一种高效的方式来交付前端文件。你不应该编写自定义循环来读取文件。

以下是我今天使用的配置:

  • express.static() 中间件 Express 内置了一个名为 express.static() 的工具。它可以让你选择一个文件夹(例如 publicassets)并将其提供给浏览器。

  • path.join() 我使用了 Node.js 的 path 模块和 __dirname 变量。这确保了我的服务器在 Windows、Linux 或 Mac 上都能无误地找到文件。

以下是代码:

const express = require("express"); const path = require("path"); const app = express(); const PORT = 8000;

app.use(express.static(path.join(__dirname, "public")));

app.get("/", (req, res) => { res.sendFile(path.join(__dirname, "public", "index.html")); });

app.listen(PORT, () => { console.log(Server running on http://localhost:${PORT}); });

掌握这些基础知识有助于我理解 Web 的工作原理。

来源:https://dev.to/ali_hamza_589ec7b3eb6688d/day-44-of-learning-mern-stack-3c0m