技术栈
支持以下技术栈
开发运行:微信开发者/hbuilderx
前端开发框架:vue.js
数据库 mysql 版本不限
后端语言框架支持:
1 java(SSM/springboot)-idea/eclipse
2.Nodejs+Vue.js -vscode
3.python(flask/django)–pycharm/vscode
4.php(thinkphp/laravel)-hbuilderx
数据库工具:Navicat/SQLyog等都可以
很强的定制性,用户可以根据自己的需求来添加相应的功能,在保持核心功能简单的同时实现功能的丰富与扩展,其强大的插件库可以让用户实现个性化的网站定制,开发出功能强大的网站。
🌟文末获取源码+数据库🌟
感兴趣的可以先收藏起来,还有大家在选题,项目以及开题任务书文档等编写等相关问题都可以给我留言咨询,希望帮助更多的人
详细视频演示
请联系我获取更详细的演示视频
具体实现截图
系统设计
微信开发者工具中我运用到的程序语言是wxml、wxss和js。
(1)WXML:和前端开发的html5是差不多,使用逻辑也是类似的,wxml是前端开发中的主要功臣点,是一切美化装修的基础、必备因素;
(2)WXSS:wxss和前端开发的css使用效果是相差不大的,其作用都是对wxml作一个修饰、排版作用,使得页面更加得体美观:
(3)JS:js的使用也是和前端中的is没有什么不同的,它的作用是在wxml和 wxss的基础上加以修饰操作的,并且微信小程序中的js是新增了一些微信的API接口的,去除了前端开发中一些没有作用的性能。
- 了解uni-app的特点
2.掌握uni-app运行环境和开发环境的部署
3.了解整个uni-app项目的开发流程 - 熟悉uni-app的页面开发
5.掌握uni-app的组件库和样式设计
6.实现页面布局和样式设计
7.数据处理和绑定
8.网络请求和数据交互
9.状态管理和全局数据
10.导航和路由控制
11.本地存储和缓存
12.第三方插件和扩展
13.多平台适配和界面优化
14.多平台打包发布
系统实现阶段包括前台界面的UI设计和后台功能模块代码设计。要求系统界面简洁直观、系统操作流畅,后台代码采用三层架构(界面表示层、业务逻辑层、数据访问层)编写。
系统测试阶段包括界面测试和功能测试。使用系统,验证系统界面是否简洁,页面不同功能的衔接是否灵活,正确。根据实际流程,在设计的系统上进行模拟测试,查看功能是都基本满足工作的需要。从而进一步修改完善系统,提高系统的实用性和稳定性
后端
后端:使用微信小程序原生技术栈 JavaScript 简称 JS,是计算机编程语言,常用于控制整个页面的逻辑,是基于 web 页面开发并且具有安全性的脚本语言,该语言的类型是动态且灵活的,仅仅需要浏览器 功能支持即可运转,故跨平台性和适用性都很高。JSON:全称 JavaScript Object Notation,可用于存储数据,配置系统全局或单页面。WXML:全称 WeiXin Markup Language,是微信小程序框架设计语言,用于展示 UI(User Interface 用户界面)模板;WXSS:全称基于JavaScript 的垃圾分类系统的设计与实现 4 WeiXin Style Sheets,用于规定 UI 样式,具有CSS(Cascading Style Sheets 层叠样式表) 的大部分特性,在其基础上扩展了尺寸单位和样式导入功能。WXS:全称 WeiXin Script, 封装后的 JS 一般内嵌于 WXML 页面,方便构建页面。
前端
小程序前端使用微信开发者工具设计wxml,对应小程序的基本组件和页面,通过微信官方的控件属性或者自设属性填充wxss,然后根据业务流程确定各页面逻辑js。数据库使用mysql
前端:使用微信web开发者工具微信,web 开发者工具是微信官方平台发布的用于开发微信小程序和小游戏的平台,由微信官方平台供应小程序的前端开发框架和后台服务器。微信开发者工具集中了开发、调试、预览和上传等功能。该工具主要是根据系统层提供的框架来进行开发,由于小程序并非在浏览器中运行的,因此在 web 中禁用了 Document、Window 之类的方法。 微信开发者工具与 HTML5 开发工具有相似之处,但在预览模式方面存在一定差异,该工具属于微信本身,故能够有效的实现同步本地文件、开发小程序以及调试等一系列流程。除此之外,该工具开发了一些标签语言和样式语言。在微信小程序用的开发过程中, 进一步的提供了原生АРР的组件,使得开发者的工作更为便捷。
java类核心代码部分展示
@RestController
@RequestMapping("/yuangong")
public class YuangongController {
@Autowired
private YuangongService yuangongService;
@Autowired
private TokenService tokenService;
/**
* 登录
*/
@IgnoreAuth
@RequestMapping(value = "/login")
public R login(String username, String password, String captcha, HttpServletRequest request) {
YuangongEntity user = yuangongService.selectOne(new EntityWrapper<YuangongEntity>().eq("yuangonggonghao", username));
if(user==null || !user.getMima().equals(password)) {
return R.error("账号或密码不正确");
}
String token = tokenService.generateToken(user.getId(), username,"yuangong", "员工" );
return R.ok().put("token", token);
}
/**
* 注册
*/
@IgnoreAuth
@RequestMapping("/register")
public R register(@RequestBody YuangongEntity yuangong){
//ValidatorUtils.validateEntity(yuangong);
YuangongEntity user = yuangongService.selectOne(new EntityWrapper<YuangongEntity>().eq("yuangonggonghao", yuangong.getYuangonggonghao()));
if(user!=null) {
return R.error("注册用户已存在");
}
Long uId = new Date().getTime();
yuangong.setId(uId);
yuangongService.insert(yuangong);
return R.ok();
}
/**
* 退出
*/
@RequestMapping("/logout")
public R logout(HttpServletRequest request) {
request.getSession().invalidate();
return R.ok("退出成功");
}
/**
* 获取用户的session用户信息
*/
@RequestMapping("/session")
public R getCurrUser(HttpServletRequest request){
Long id = (Long)request.getSession().getAttribute("userId");
YuangongEntity user = yuangongService.selectById(id);
return R.ok().put("data", user);
}
/**
* 密码重置
*/
@IgnoreAuth
@RequestMapping(value = "/resetPass")
public R resetPass(String username, HttpServletRequest request){
YuangongEntity user = yuangongService.selectOne(new EntityWrapper<YuangongEntity>().eq("yuangonggonghao", username));
if(user==null) {
return R.error("账号不存在");
}
user.setMima("123456");
yuangongService.updateById(user);
return R.ok("密码已重置为:123456");
}
可行性论证
采用微信开发者工具,使用云函数,MySQL数据库。采用云函数和数据库就能够实现在互联网上利用微信小程序进行健身,查询等功能。
操作可行性:目前健身人群主要集中在18岁——60岁之间操作起来更容易,更容易让人上手使用。
设备可行性:开发者工具只需要一台电脑和能登陆微信的手机,软件使用的工具是微信开发者工具、数据库是MySQL。这些软件已经成功的下载到个人的电脑中
通过研究背景、意义和目的——确定题目——查看文献综述;国内外现状和本文主要研究内容——系统分析、需求分析、可行性分析——数据库设计——系统设计;总体布局设计、详细功能、显示设计——系统测试与实现
个人心得
软件编程是孤独的,也是枯燥的。在外行看似简单的一个操作,背后却是数以百行的代码,有时一个项目的开发甚至需要连续十几天甚至一个月。 软件开发入行的同学很多,但真正能坚持下去的却很少,因为软件行业加班是出了名的,并且技术更新速度非常快,可能这一刻这个技术你才掌握,下一刻他的升级替代品就已经出来了。这让我们意识到更新自己知识的重要性。所以,我一直提醒自己,只要你不努力,你就随时有可能被别人超越和取代。
。
操作可行性
pages 主要页面, 其中pages文件夹中 index文件中可布局底部的tab页面,通过v-if判断显示不同的tab页
colorui 使用了color-ui样式,个人认为样式非常好看,非常感谢!
static目录: 存放静态文件
App.vue: 页面入口文件
main.js: 项目入口文件
manifest.json: 存放App信息
pages.json: 页面信息
uni.scss: 全局样式
(1)通过查阅相关的书籍搜集材料,进行需求调查。
(2)写需求分析文档,确定系统的主要模块。
(3)画出ER图,流程图等图示以用来明确模块之间的关系
(4)根据需求分析,建立数据库文档,设计表和字段。
(5)进行系统的界面设计。
(6)通过python+java+node.js+php语言和MySQL数据库实现本系统。
源码获取
文章最下方名片联系我即可~
✌💗大家点赞、收藏、关注、评论啦 、查看✌💗
👇🏻获取联系方式👇🏻