【实战】SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0
基于SpringBoot+uniapp简单通讯聊天软件
项目介绍
JavaDog Chat 简单通讯聊天软件是基于SpringBoot+MybatisPlus+uniapp+uview+stomp等更多优秀组件及前沿技术开发,注释丰富,代码简洁,开箱即用,兼容H5+小程序+APP,及其适合入门学习!将想说却不敢说,相爱去不敢爱的思绪放置与此。
快速链接
微信公众号:JavaDog程序狗
关注公众号,发送 chat ,无任何套路即可获得
或访问https://blog.javadog.net/archives/chat
体验地址
因二维码图被和谐,最好访问https://blog.javadog.net/archives/chat进行扫码访问体验
1.网页H5
2.APP
体验账号
账号:18306390693
密码:123456
如需多个账户可自行注册
主要模块功能
️登录注册
- 用户可自主注册,并通过用户名密码进行登录
- 如忘记密码则可通过邮箱找回密码,但需要在配置文件中配置邮箱相关内容
消息
- 展示群组及好友聊天信息,并有消息提醒及未读标记
- 可通过上方放大镜进行搜索,或者扫一扫进行好友添加
- 点击查看聊天信息,可进行文字/图片/视频/语音等发送方式
好友
- 按照字母索引展示所有好友列表,并可通过放大镜搜索
- 通过右上角扫描二维码进行好友添加
- "我添加的"本人通过扫码或者搜索添加好友申请列表数据
- "添加我的"其他用户通过扫码或者搜索添加我本人申请列表数据
- 通过点击好友进行好有名片查看
群组
- 按照字母索引展示所有群组列表,并可通过放大镜搜索
- 通过右上角扫描二维码进行群组加入
- "新建群组"可根据所需进行群组的创建
- 通过点击群组进行好有名片查看
我的
- 点击头像进行头像修改
- "我的名片"展示本人所属二维码
- "修改密码"可进行密码重置
- "关于"展示本狗的博客是个webview跳转
- 点击退出并退出当前账号
️快速启动
后端chat-provider推荐IDEA打开,前端chat-uniapp推荐HbuliderX打开。
前端支撑
| 插件 | 版本 | 用途 |
|---|---|---|
| uview-ui | ^2.0.31 | 多平台快速开发的UI框架 |
| uni-simple-router | ^2.0.7 | 专为uniapp打造的路由器 |
| moment | ^2.29.4 | js工具库 |
| mescroll-uni | ^1.3.7 | 上拉加载下拉刷新插件 |
| @uni-ui/code-ui | ^1.4.8 | 二维码生成工具 |
启动前端
- 在chat-uniapp项目目录下执行
npm install
- 在HBuilderX工具下运行,选择需要运行到哪个终端
3. 如需调整环境,请在/common/config/env.js修改环境变量
后端支撑
| 插件 | 版本 | 用途 |
|---|---|---|
| jdk | 1.8 | java环境 |
| lombok | 1.18.16 | 代码简化插件 |
| maven | 3.6.3 | 包管理工具 |
| druid | 1.1.24 | JDBC组件 |
| hutool | 5.7.20 | Java工具类库 |
| mybatis-plus | 3.4.1 | 基于 MyBatis 增强工具 |
| pinyin4j | 2.5.1 | 拼音组件库 |
| mysql | 8.0 / 5.7 | 数据库 |
启动后端
- 开发工具内配置好,并将maven配置好,建议使用阿里云镜像
- 将chat-provider包下的/doc/SQL/db_chat.sql进行本地执行,并在application配置文件中修改数据库配置
- 运行启动SpringBoot项目,如见到以下日志即为启动成功。
其他辅助
️♀️原型图
本狗第一次画原型,请大佬勿喷
项目路径下/doc/原型/chat.rp
DB设计
项目路径下/doc/数据库设计/chat.pdm
版权说明
JavaDog Chat 采用 Apache License2.0协议
代码可用于个人学习等,完全开源免费
二次开发如用于毕设等二次售卖,未经审核视为侵权
【实战】SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目的更多相关文章
- 微信小程序开发入门学习(1):石头剪刀布小游戏
从今天起开始捣鼓小程序了2018-12-17 10:02:15 跟着教程做了第一个入门实例有兴趣的朋友可以看看: 猜拳游戏布局 程序达到的效果 猜拳游戏的布局是纵向显示了三个组件:文本组件(tex ...
- 微信小程序开发入门学习(2):小程序的布局
概述 小程序的布局采用了和Css3中相同的 flex(弹性布局)方式,使用方法也类似(只是属性名不同而已). 水平排列 默认是从左向右水平依次放置组件,从上到下依次放置组件. 任何可视组件都需要使用样 ...
- 基于uniapp自定义Navbar+Tabbar组件「兼容H5+小程序+App端Nvue」
uni-app跨端自定义navbar+tabbar组件|沉浸式导航条|仿咸鱼凸起标签栏 在跨端项目开发中,uniapp是个不错的框架.采用vue.js和小程序语法结构,使得入门开发更容易.拥有非常丰富 ...
- uniapp之uni-starter小程序多端研发框架搭建与项目实践
随着移动互联网的飞速发展,无数移动APP琳琅满目:在移动App的发展的基础上,衍生了小程序.轻应用技术,它随时可用,但又无需安装卸载.小程序是一种不需要下载安装即可使用的应用,它实现了应用" ...
- 开发H5程序或者小程序的时候,后端Web API项目在IISExpress调试中使用IP地址,便于开发调试
在我们开发开发H5程序或者小程序的时候,有时候需要基于内置浏览器或者微信开发者工具进行测试,这个时候可以采用默认的localhost进行访问后端接口,一般来说没什么问题,如果我们需要通过USB基座方式 ...
- 原创:从零开始,微信小程序新手入门宝典《一》
为了方便大家了解并入门微信小程序,我将一些可能会需要的知识,列在这里,让大家方便的从零开始学习:一:微信小程序的特点张小龙:张小龙全面阐述小程序,推荐通读此文: 小程序是一种不需要下载.安装即可使用的 ...
- 微信小程序室内地图导航开发-微信小程序JS加载esmap地图
一.在微信小程序里显示室内三维地图 需要满足的两个条件 调用ESMap室内地图需要用到小程序web-view组件,想要通过 web-view 调用ESMap室内地图需要满足以下 2 个条件: 1. 小 ...
- Java生鲜电商平台-优惠券功能设计与开发(小程序/APP)
Java生鲜电商平台-优惠券功能设计与开发(小程序/APP) 说明:Java生鲜电商平台-优惠券功能设计与开发(小程序/APP) 目录 1.项目背景与需求分析 2.需求目的与功能点列表 3.业务逻辑 ...
- 支付宝小程序室内地图导航开发-支付宝小程序JS加载esmap地图
如果是微信小程序开发,请参考微信小程序室内地图导航开发-微信小程序JS加载esmap地图文章 一.在支付宝小程序里显示室内三维地图 需要满足的两个条件 调用ESMap室内地图需要用到小程序web-vi ...
- Java生鲜电商平台-关于学习生鲜电商平台的思考(小程序/APP)
Java生鲜电商平台-关于学习生鲜电商平台的思考(小程序/APP) 说明:最近群里面的一个网友问的一个问题,让我陷入了深思,他问的问题很基础也很真实,"大佬,你们是怎么学习的呢?" ...
随机推荐
- vxe-table 合并单元格
<vxe-table @cell-click="handleClickCell" :span-method="spanMethods" //自动合并单元格 ...
- web端测试的测试点和注意事项【转载】
文章来源:作者:simplesally 出处:https://www.cnblogs.com/simple1025/ [转载] 工作中接触了不同类型的web端系统,内容不同,需求不同,测试关注点也 ...
- Day17-JavaSE总结
不多说了,直接去看视频吧! 链接 完结撒花!!!
- C#——》发布ASP.NET Core项目到Windows IIS服务器中环境部署
服务器:Windows Server2012 R2 IIS:8 .net Core版本:1.1.2 一,在VS中点击项目-->依赖项-->SDK下可以查看当前项目.Net core是哪个版 ...
- Jmeter-接口测试(一)
一.接口测试分类 内部接口 外部接口--被测系统调用外部 --系统对外部提供的接口 接口测试重点:接口参数传递的正确性.接口功能的正确性.输出结果正确性.各种异常容错处理.权限控制.分页.调用 ...
- LSP原则中的逆变和协变
在复习过程中,LSP原则是个很重要的内容.这里先给出LSP原则的定义. LSP定义Functions that use pointers or referrnces to base classes m ...
- 枚举类list序列化与反序列化
//序列化 public class AuthTypeEnumListJsonSerializer extends JsonSerializer<List> { @Override pub ...
- Cortex-M内核指令WFI和WFI
背景 今天阅读Nordic SDK里的example时发现里面功耗管理使用的power_manage()函数主要就是调用了一个__WFE()函数.查阅资料了解到WFE是一条汇编指令,它可以让CPU内核 ...
- java-------token
https://el-admin.vip/guide/hdsc.html#%E6%96%B0%E5%BB%BA%E6%A8%A1%E5%9D%97
- openstack:OpenStack架构详解,
OpenStack既是一个社区,也是一个项目和一个开源软件,提供开放源码软件,建立公共和私有云,它提供了一个部署云的操作平台或工具集,其宗旨在于:帮助组织运行为虚拟计算或存储服务的云,为公有云.私有云 ...