自学WEB后端02-基于Express框架完成一个交互留言板!

提示：

浏览器V8是JavaScript的前端运行环境
Node.js 是JavaScript 的后端运行环境
Node.js 中无法调用 DOM 和 BOM等浏览器内置 API

这个作业案例包含2部分内容，

第一部分是前端

前端完成界面内容+CSS框架

第二部分是后端

完成用户留言存储，并返回

1.创建好文件夹目录

我这里为了方便放在了后端myapp目录里，创建了新文件夹放前端文件

通常情况下，前端文件（包括HTML、CSS和前端JavaScript）和后端文件（包括后端JavaScript、服务器配置等）应该放在不同的文件夹中，以便进行区分和管理。

可以按照以下方式组织文件夹结构：

- 网站项目文件夹 -

 -backend 

    server.js 

    myapp.js

- frontend 

  index.html

  style.css

  script.js - 

以上是一种常见的文件夹结构示例，其中backend文件夹用于存放后端文件（如server.js），而frontend文件夹则用于存放前端文件（如index.html、style.css和script.js等）。

请注意，这只是一种示例文件夹结构，你可以根据自己的需求和项目规模进行调整和扩展。

2.开始写前端代码

HTML 里面代码会通过路径调用对应CSS代码。如果没有CSS代码，也可以不用！

创建一个index.html

这次我们用py打开项目方便看到代码提示

  
  


  
留言板

  


  

    
    发送
  

  
  

3.后端代码

创建一个新的 XXXX.js 文件，并将以下代码复制到其中：

这个脚本是后端的脚本！由JavaScript编写

  
  


  
留言板

  


  

    
    发送
  

  
  

然后在py中右键运行这个后端js脚本（如果你没有用py打开）那么就需要用命令窗口（CMD）

一个非常丑的留言板网站就出现了！

 （如果你没有用py打开）那么就需要用命令窗口（CMD）

恭喜，第一次感受到前端和后端协调工作的结果！