![Node.js+Webpack开发实战](https://wfqqreader-1252317822.image.myqcloud.com/cover/131/36862131/b_36862131.jpg)
上QQ阅读APP看书,第一时间看更新
4.9 留言板项目开发
本节将和大家一起使用所学的知识开发一个Web留言板。
项目的功能如下:
· 首页展示留言列表和发布按钮。
· 发布页面展示留言表单,单击发布后保存留言。
本节的留言数据存储在内存中,进程结束留言板数据会丢失。数据库相关的知识在后面的章节中介绍。
4.9.1 开始编码
初始化项目并安装相关依赖:
![](https://epubservercos.yuewen.com/1A2713/19549639501513406/epubprivate/OEBPS/Images/Figure-P83_94272.jpg?sign=1739287193-rfJHXUNyBJIosZzDeBfLTfC3INiO6aFN-0-0175c1cd2efdb13e8e4a449d76d35fd7)
下面列出本项目的完整代码。
index.js
![](https://epubservercos.yuewen.com/1A2713/19549639501513406/epubprivate/OEBPS/Images/Figure-P83_92811.jpg?sign=1739287193-fSrNJss5xhX8zUaCOSMrqgrU7bQ30G12-0-f6a51f744565f3559447d496aad5e685)
在index.js的同级新建templates/index.ejs来存放首页模板。
templates/index.ejs
![](https://epubservercos.yuewen.com/1A2713/19549639501513406/epubprivate/OEBPS/Images/Figure-P84_92814.jpg?sign=1739287193-BksbPnnWYavzGPaXG0yTPHVUQOHyT2ec-0-8914b30f21072fe29e6197a06396db55)
该模板文件对留言内容进行了判空处理,没有留言内容就显示“当前没有留言。”,有留言内容就显示留言列表。
在index.js的同级新建templates/publish.ejs来存放发布页模板。
![](https://epubservercos.yuewen.com/1A2713/19549639501513406/epubprivate/OEBPS/Images/Figure-P85_92816.jpg?sign=1739287193-NpQC42xc7wSAkMR7oXZ6EPhpcAweJ0dh-0-f4e2f66d71120c43c298f194c9dd525c)
4.9.2 运行项目
node inde.js
浏览器访问http://localhost:8080,首页效果如图4-1所示。
![](https://epubservercos.yuewen.com/1A2713/19549639501513406/epubprivate/OEBPS/Images/Figure-P86_55428.jpg?sign=1739287193-OIIhgF7p4xd9gDy6eX3VOIiOLvrSk6zN-0-1948499143070c7ca77021e87a8939e5)
图4-1
单击【发表留言】,发布页效果如图4-2所示。
![](https://epubservercos.yuewen.com/1A2713/19549639501513406/epubprivate/OEBPS/Images/Figure-P86_55438.jpg?sign=1739287193-Kb1Urn19SJqhMJRqgUF4ip8JWAdpYKCA-0-15ec7d22e94fbbf13bc4441cae80b51d)
图4-2
输入姓名和内容后,单击【发表】自动重定向到首页,首页效果如图4-3所示。
![](https://epubservercos.yuewen.com/1A2713/19549639501513406/epubprivate/OEBPS/Images/Figure-P86_55448.jpg?sign=1739287193-gJy6AEqFbZNJmrKXVuRr7KBZzHZynd3E-0-391d790e0b72eeeccc8d5537a7103c17)
图4-3
恭喜!你的第一个Express应用已经运行成功了!如果遇到问题可以咨询作者的公众号。
回顾一下一个Express应用的开发流程:
(1)初始化项目。
(2)安装依赖。
(3)编写路由文件,并导入中间件。
(4)编写模板文件。
(5)运行项目并测试。