随笔（二）前端相关

//搭建服务端网页相关知识
//exit:Janice
//2024.07.10-09：43
//Sichuan.China

1.动态网页——服务器端编程

My question:

要想实现一个有服务器支持，动态展示且交互的网页具体怎样实现，其底层逻辑又是如何？

Solution:

• 什么是一个网页服务器 [What is a web server]
• 我需要什么软件去构建一个网页？ [What software do I need to build a website?]
• 你怎样上传文件到一个网页服务器？ [How do you upload files to a web server?]

服务器端网页编程 - 学习 Web 开发 | MDN (mozilla.org)

2.Express介绍

什么是 Express?

Express 是最流行的 Node 框架，是许多其他流行 Node 框架 的底层库。它提供了以下机制：

• 为不同 URL 路径中使用不同 HTTP 动词的请求（路由）编写处理程序。
• 集成了“视图”渲染引擎，以便通过将数据插入模板来生成响应。
• 设置常见 web 应用设置，比如用于连接的端口，以及渲染响应模板的位置。
• 在请求处理管道的任何位置添加额外的请求处理“中间件”。

虽然 Express 本身是极简风格的，但是开发人员通过创建各类兼容的中间件包解决了几乎所有的 web 开发问题。这些库可以实现 cookie、会话、用户登录、URL 参数、POST 数据、安全头等功能。可在 Express 中间件 网页中找到由 Express 团队维护的中间件软件包列表（还有一张流行的第三方软件包列表）。

3.express 实例

const express = require("express");
const app = express();

app.get("/", (req, res) => {
  res.send("Hello World!");
});

app.listen(3000, () => {
  console.log("示例应用正在监听 3000 端口 !");
});

前两行通过 require() 导入 Express 模块，并创建了一个 Express 应用。（导入和创建模块）传统上把这个对象命名为 app，它可以进行路由 HTTP 请求、配置中间件、渲染 HTML 视图、注册模板引擎以及修改 应用程序设置 等操作，从而控制应用的行为（例如，环境模式，路由定义是否为区分大小写等）。

代码的中间部分（从 app.get() 开始共三行）是路由定义。app.get() 方法指定了一个回调（callback）函数，该函数在每监听到一个关于站点根目录路径（'/'）的 HTTP GET 请求时调用。此回调函数以一个请求和一个响应对象作为参数，并直接调用响应的 send() 来返回字符串“Hello World!”

最后一个代码块在“3000”端口上启动服务器，并在控制台打印日志。服务器运行时，可用浏览器访问 localhost:3000，看看响应返回了什么。

---

基础知识order：

我该怎样开始设计我的网站？ - 学习 Web 开发 | MDN (mozilla.org)

网页、网站、网络服务器和搜索引擎的区别是什么？ - 学习 Web 开发 | MDN (mozilla.org)

什么是 web 服务器？ - 学习 Web 开发 | MDN (mozilla.org)