开发一个简单的留言板应用——使用 Node.js 、Express 库 和 jQuery 库来实现一个简单的留言板应用程序

目录

效果展示

Message boards开发步骤

项目初始化

安装包

新建文件夹

新建服务

新建页面

界面功能开发

前端

后端

写在后面

---

1.设计背景

本项目主要训练综合运用node+express技术搭建后台，html+css+JavaScript搭建前端页面,培养分析问题和解决问题的能力。

2.设计题目

题目描述：

你正在开发一个简单的留言板应用，用户可以在网页上发布留言并查看已发布的留言。请根据以下要求完成代码实现。

3.设计要求

前端任务：

在HTML页面上创建一个表单，包含以下字段：

昵称：用户输入自己的昵称。

留言内容：用户输入要发布的留言内容。

使用JavaScript/jQuery编写前端逻辑，实现以下功能：

在表单提交前对用户输入进行验证，验证不通过时阻止表单提交并给出相应提示信息。

验证昵称和留言内容是否为空。

使用jQuery的Ajax方法，将表单数据以JSON格式发送到后端的"/api/messages"路由，并在成功后刷新留言列表显示最新的留言。

后端任务：

使用Node.js和Express框架创建一个服务器应用程序。

创建一个POST路由"/api/messages"，接收来自前端的留言数据，并进行后端处理。

将接收到的留言数据保存到一个数组中（每个留言对象包含昵称和留言内容）。

创建一个GET路由"/api/messages"，用于获取已发布的留言列表。

你需要完成以下任务：

在前端编写HTML、CSS和JavaScript/jQuery代码，实现留言发布表单和验证逻辑。

在后端使用Node.js和Express框架，创建路由和处理逻辑。

将前后端代码连接起来，实现留言发布和留言列表的完整功能。

注意：为了简化题目，可以将留言数据保存在服务器端的数组中，无需使用真实的数据库

---

效果展示

---

Message boards开发步骤

项目初始化

新建文件夹，命名为`Message boards`，注意这里的命名不得为中文或其他特殊字符

npm init -y

安装包

npm i jquery express express-art-template

这里我们安装jQuery、express、express-art-template包，把他们都引入到了本地