博主创建的QQ群!点击蓝字加群
Web项目我们使用当下流行的开源框架搭建,采用前后端分离的技术来完成Web项目的搭建!
前端开发店长水平有限,只能实现基本的功能,正因为本开发手册,是为了让大家能够独自完成简单的智能家居系统的搭建而编写的,所以,也会尽量的使用基础的开发能力,来让大多数人都有跟上的机会!如果有大佬或者同学愿意加入本系统的开发,那是最好不过了!欢迎大家,一起研究我们自己的开源系统~
首先,介绍一下前端开发的技术:
前端开发使用组件化开发的Vue框架,我们能够站在开源的平台,搭建属于自己的项目。对于搭建前端的界面,我们的需求就是随心所欲的搭建自己想要的界面,满足我们所想要的功能。利用现成的组件开发,无异于让我们专注于对页面的开发实现和对页面跳转逻辑的设计!让我们的时间尽可能的用于构思我们的系统,而不用在意具体的css样式是如何实现的或者html的标签的书写,以上这两者都是店长懒得学的东西,哈哈哈哈哈!但是做前端的同学也很棒,我所熟知的同学,能够按照设计师的样式,独立写出页面的设计,让我羞愧不已!
上面已经提到了组件化开发,我们接下来就仔细的说说,什么是组件化开发?就我们系统开发的需求来看,就是使用现成的UI控件:按钮、输入框、下拉框来实现我们自己的界面。组件大多具有:简洁、可复用、易修改的特点,这样开发出来的界面,简洁大方!
我们系统选用的UI组件是:Element-UI来嵌入Vue项目!到此为止,我们需要记得的知识点有:Element-UI、Vue开发框架!接下来我们就开始我们的探索之旅啦!!!
不管我们开始学习什么内容,官网都是第一位的资料库!对于一个好的开源框架,官网的资料丰不丰富,相关生态的建设完不完善、开发者是否活跃,这些都是很关键的要素!我们选择的Vue开发框架,相信只要是接触过的前端的同学都有所耳闻,实践证明Vue是一款非常优秀的开源框架,社区拥有众多活跃的开发者,在各大博客网站和技术分享网站,比如:CSDN、Github、Gitee、简书等网站拥有众多解决方案和思路!在我们遇到问题时,可以快速的查找到相关的资料,来帮助我们解决问题。相信2021年的大家更加懂得生态的重要性。
Element-Ui组件库,也是非常经典的解决方案,我们可以快速便捷的开发出简洁大方、功能齐全的页面,实现设计好的复杂逻辑!在JSP时代是想都不敢想的!
下面就是项目前端开发的资料的下载方式和相关网站:
杂货店牌智能家居系统实操手册:https://showdoc.dongeast.top/web/#/p/4a9603272983f1774cf87633e472aa19
Node.js官网:https://nodejs.org/zh-cn/
Vue-Cli官网:https://cli.vuejs.org/zh/
Element-UI官网:https://element.eleme.cn/#/zh-CN
CSDN:https://www.csdn.net/
简书:https://www.jianshu.com/
百度:https://www.baidu.com/
输入“node -v”,如果返回版本号,即安装成功!
同时会安装“npm”
接下来安装“cnpm”:
npm install -g cnpm --registry=https://registry.npm.taobao.org
到这里,我们电脑上的node.js和cnpm就全部安装完成了!
5.百度搜索“Vue-cli”,进入Vue脚手架官网:https://cli.vuejs.org/zh/
cnpm install -g @vue/cli “-g 全局安装”
测试一下是否安装成功:
到这里,前端开发的环境就全部搭建完成了。开发工具可以选择VSCode或者IDEA,店长使用的是VSCode,我们就以VSCode为例!
6.从官网下载VSCode:https://code.visualstudio.com/
Windows下,在搜索框输入“cmd”,打开命令行窗口,输入“vue-ui”命令。
打开图形化配置界面,这是Vue3.0以上支持的一种图形化界面配置方式,图形化配置方式依赖于打开的命令行窗口,关闭上面的窗口,图形化界面也会终止。
接下来等待片刻,这样一个Vue项目工程就创建好了······接着我们使用VSCode打开新创建的项目
弹出如下对话框时,请相信自己!
点击项目的文件夹区域,右键选择在继承终端中打开:
使用“cd …”回退到Vuetest(项目文件夹下):
使用指令:“npm run serve” 运行程序:
”Ctrl + 鼠标左键点击“ ------ 打开网址访问 http://localhost:8080
到这里,我们的前端基本开发准备工作就已经做好啦!!!
https://space.bilibili.com/383001841
后端开发我们只是需要用到一些基础的SpringBoot开发框架的使用方法,店长更希望大家一起来完善它的功能使它更加强大。前端通过axios方法调用后端的接口,后端实现接口,完成对数据的增删改查,在后端的开发中,秉持着SpringBoot的理念,尽可能简化对增删改查的Sql语句的书写,我们使用包装好的 JpaRepository类,进行对数据库的操作。
首先我们,介绍一下在项目后端开发过程中,我们需要用到的技术条件。在项目中,我们使用SpringBoot框架对项目进行工程化开发,我们选择导入框架封装好的数据库操作类JPA,完成对 MySql 数据库的增删改查:
import org.springframework.data.jpa.repository.JpaRepository;
创建实体类来和表,进行绑定!
后端开发需要注意一下几个点:
Spring官网:https://spring.io/
Springboot开发文档:https://spring.io/projects/spring-boot
jdk1.8
maven3.6.1
Springboot最新版
IDEA
Springboot开发文档:https://spring.io/projects/spring-boot
点击”QuickStart“,去生成我们的项目模板!
先来配置左边这一大块!!!配置完后不要结束,还有右边需要加入依赖!
添加右边的依赖:
这样就配置完成了,点击右下角的生成即可!
下载完成:
Spring Boot项目现在已经下载完毕!
解压后,是一个标准的Maven项目!
将项目导入IDEA:
选择一个Maven项目导入:
选中路径,打开项目,基础配置可以全部默认,直接点击”Next“:
切换一下主题,项目会自动下载很多包,需要等待一段时间:
自动加载完毕,我们开始,运行一下看看效果:
如果报错:”error:java 无效的源发行版11“
直接使用IDEA新建一个Spring Boot项目。
这样我们就搭建好了,后端开发的基础项目!
为什么要开发一个安卓APP?一个项目必须得有一个前端界面来展示,否则就算硬件做的非常完善,别人都看不出来,只有用优美简洁的界面展示复杂的操作,别人才会懂,项目有多强!
安卓开发对于简单的逻辑设计和页面控制有很好的适用性,安卓的开发过程中,可以使用控件拖拽出一个简单的界面,完全可以符合自己的审美和需求,想要更好看的界面只需要花点心思布局就好了!安卓有很多开源的项目可以使用,加上手机的便捷性,使得使用安卓作为控制端和展示端都有着独特的优势,你可以尽情的调用手机任何功能,做你想做的事:震动、NFC识别、拍照、人脸识别、WiFi、蓝牙、陀螺仪,简直就是硬件宝藏库!!!安卓开发可以选择Java或者是Python,但是Java是主流,如果不是Python特别精通还是使用Java更好一些。
当然,如果不想开发安卓APP,使用网页端,或者微信小程序、QQ小程序、支付宝小程序,都可以接入我们的系统!只是方法不同,这里先讲解安卓APP接入的方法,如果大家感兴趣的话,以后再讲讲小程序的接入。
在开发安卓软件之前我们需要理清楚,我们想用它来做些什么?首先,物联网项目中最常见的就是温湿度传感器等设备了,最基础的功能应该是展示设备的各种信息,那么问题就来了,我们怎么样保证手机和后台可以通信呢?我们选用MQTT协议来完成数据之间的传递,硬件嵌入式设备接入方式也比较简单!其次,我们希望整个系统可以知道我们在哪个地方,如果设备可以发现我们离家的距离越来越近就可帮助我们做一些事情,或者采取手机的一些传感器数据来判断我们的状态,更好地利用智能设备来为我们服务!其次,我们同学大多备受百度网盘的罪,如果我们的服务器性能还可以,那我们大可搭建自己的家庭网盘!
要求代码整洁,可复用程度高,尝试使用Spring Boot框架开发,使用一些基础的开发知识,开发前做好规划和目标。
Android Studio最新版
创建一个新的项目
1.MQTT收发功能,选用MQTT作为通信协议,MQTT协议更符合物联网的特性;
2.获取web平台上的数据和内容,用于展示整个平台设备的运行状态和设备采集的数据信息;
3.实时上传位置信息,调用安卓手机的GPS模块,获取当前位置,用于系统的智能处理;
4.实现手机文件上传和下载功能,配合着网页端在服务器上搭建属于自己的云端网盘;(受限于服务器的带宽和磁盘容量)
https://space.bilibili.com/383001841
首先介绍Arduino入门的开发板经典的UNO板:
多种类型具有WiFi功能的Esp8266芯片:
如果你在网上买Esp8266芯片,你就会发现有好多种类,如果你是刚入门Esp8266这款WiFi芯片,那么你在开发的过程中,可能就会被搞的,一团懵!
首先我们来看看这款芯片都有哪些样子:
Esp8266-01:
Esp8266-12:
Esp8266-12F:
Esp8266-12E(NodeMCU):
NodeMCU的引脚图:
首先,我们需要有一个大概的印象,所有的这些板核心还都是基于ESP8266(EX)来构建的。也就是说,上面的开发板,虽然形状各有个的特色,但是芯片是一模一样的,功能完全一样!开发方法完全一样!板子的大小不是由芯片决定的,而是有板载外设决定的!
我们可以仔细的看,上面的各种开发板,如果把Esp-12、12F、NodeMCU的芯片金属外壳剥掉,其实全都是和Esp-01长得一个样子。其他看起来很强的样子,也就是多了一个可以抗干扰的金属外壳!
看到这里,也许大家就要问了,同一款芯片为什么要搞得这么花里胡哨的?这就是这款芯片的成功之处!一款芯片,体积小,可以使它本身可以做成非常小的尺寸,满足嵌入式开发的需要,也可以挡住一块开发板的核心板,撑起一大堆功能。另外一个原因就是,这块芯片是开源的,肯定就会有人来拿走,改成合适自己的尺寸来方便使用,大中小都有自己的流行版本!
说到对芯片的开发,我们需要明白两个芯片的意义:
上面说到,我们对芯片进行开发,目的就是为了对芯片进行编程,让芯片完成我们指定的操作。也就是我们需要改变芯片存储的代码,如果这样理解,代码开发就可以分为两种方式。
说了这么多,一定要自己好好品一品其中的道理,这对我们理解硬件开发很有帮助!
https://space.bilibili.com/383001841
QQ和微信是我们生活中最经常接触到的两个实时通讯类软件,可以说普及程度已经达到了装机必备的程度,懂的都懂!如何对这两个App开发?将自己的代码融入到这两款优秀的App中,是一项多么有成就感的工作!江湖传言:小孩子都玩QQ、家长才玩微信!所以尚在年幼的我,也选择用自己最常用的QQ接入我们的项目。微信也有相应的开源自动化框架,有兴趣大家可以自行搭建哦~(机器人可千万不要用于什么不好的地方!后果很严重!)
对于QQ机器人的开发,我们选择使用Github上一款开源框架”mirai“。它支持Java、Python等多种编程语言,为了方便后续对机器人的功能做一些拓展,所以我们选择使用Python开发。(有兴趣的小伙伴可以在官网找到相关文档使用自己喜欢的语言哦!)
我们先来了解一下它,mirai 是一个在全平台下运行,提供 QQ Android 协议支持的高效率机器人库。
项目地址:https://github.com/mamoe/mirai
用户手册:https://github.com/mamoe/mirai/blob/dev/docs/UserManual.md
开发文档:https://github.com/mamoe/mirai/blob/dev/docs/README.md
环境搭建流程参考网页:https://github.com/mamoe/mirai/blob/dev/docs/UserManual.md
首先,我们要为机器人找到一个QQ号(建议做好被封的准备!)
经过店长的一顿操作,QQ小号成就达成,接下来我们就按照官方文档一步一步来就好了!
一、安装Mirai的控制台:启动Mirai,使用 Mirai,一般人要启动的是 Mirai 控制台(即 Mirai Console),它可以加载插件。
mcl.cmd
启动,成功后会看到绿色的 mirai-console started successfully
。新建一个新的文件夹来存放QQ机器人项目的文件,在这个文件夹下运行这个安装文件,会自动下载文件(大约120M)到本地。由于项目是在Github上,我们需要多安装几遍确保安装完整,安装不完整会导致运行各种报错!
这个下载过程可能有点慢······
下载完成后:
文件夹名称 | 用途 |
---|---|
scripts |
存放启动器的脚本,一般不需要在意他们 |
plugins |
存放插件 |
data |
存放插件的数据,一般不需要在意它们 |
config |
存放插件的配置,可以打开并修改配置 |
logs |
存放运行时的日志,日志默认保留 7 天 |
如果安装不成功会导致,运行 mcl.cmd 闪退失败!(店长会放好配置好的环境~,如果同学们想自己搭建环境可以自己按照官方文档里一步一步来,也可以在交流群里问!)
PS:也可以在这里:https://github.com/iTXTech/mirai-console-loader/releases 直接下载MCL运行环境,下载完成解压即可,无需安装。
当我安装完MCL的时候,却发生了报错:
错误:发生JNI错误,请检查安装并重试
线程“main”java.lang.UnsupportedClassVersionError:org/itxtech/mcl/Loader中的异常已由较新版本的java运行时(类文件版本55.0)编译,此版本的java运行时仅识别高达52.0的类文件版本
是Java运行环境不对!