基于Vue和Spring Boot的笔记上传和聊天网站

这是自己在学习过程中自己尝试去实现的页面,目前还有很多需要完善的地方,就当是学习记录啦。

天天发知识,累了,来个项目吧,也希望觉得可以的哥哥、姐姐为我的仓库点点star❤️❤️

仅供学习,不喜勿喷

技术栈

前端: Vue3框架和element-plus

后端:Spring Boot  MyBatis 

数据库: MySQL

聊天使用: Websocket

前端仓库地址:👉👉PostgraduateForF

🎉🎉🎉🎉

后端API项目位置👉👉PostgraduateForFAPI

登录后的首页

image-20240727175906742

上传笔记页面

image-20240727175938559

登录后的首页1.0 切换页码获取不同的数据

image-20240806161648356

登录后的首页2.0 查看详情

image-20240810155637514

登录后的首页3.0(添加消息中心)

点击笔记了解详情(附加下载功能)

image-20240810155709489

个人中心(我的页面)

image-20240727180032214

个人中心(今日上传页面)

image-20240810160259017

个人中心(往日追忆页面)

image-20240806161515402

个人中心(往日追忆编辑)

还存在bug,图没有显示,而且为了编辑过程中不影响原本的数据,使用了深拷贝 _.cloneDeep()

将拷贝的数据传递给子组件,头晕🥲🥲🥲,将修改的内容又请求api传递,,,,,,,要做的事很多

image-20240806161845728

聊天页面(获取好友列表)并实现websocket第一步,接收用户的连接

页面很丑,后续会逐渐优化

Postgraduate_20240813162124695

聊天页面1.0(获取好友列表)并实现websocket第二步,好友间的实时聊天

由于初学,很多的逻辑也没有考虑周到,后续会优化🤣🤣🤣🤣🤣,目前只能很简单的消息转发。

微信图片_20240814174059

聊天页面2.0(添加消息的持久化处理,美化页面)

 登录页面

  • 6
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值