IoT小能手的微信小程序快速入门教程

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/iotisan/article/details/99782346

小能手的技能栈终于要拓展到微信小程序啦,这真是一件令人高兴的事。

“IoT小能手,你一个搞 IoT 的为啥要学小程序”
“物联网是个筐,啥都能够往里装。小程序作为端侧经典应用,当然也得把它收入囊中。”

关于学习路线和学习资源

在一开始的学习过程中,小能手是围绕小程序-微信官方文档来学习,通过结合热心网友文章凑合着实现了一个 MQTT 小程序,用来和我们 LoRa 核心网进行通信。虽然做出来了一个 DEMO,简历上是可以写“熟练掌握”了,但实际绝逼拿不出手。

最近参加了腾讯云主办的0基础10天小程序开发夏令营,发现这套教程干货满满,尤其是在学习路线上帮我这个初学者做了纠正:微信官方文档更适合做工具书,初学者只需花一点时间了解下大致的文档结构即可。腾讯云云开发团队设计了一套循序渐进的教程,UI -> API -> 云开发,并且每一部分都设计了实战 DEMO,帮助初学者在实战中掌握小程序。

所以在学习路线上,小能手尤为推荐腾讯云云开发的这套教程(链接我后面补上,听说会把这套教程放到官网上),循序渐进实现 3 个 DEMO。同时整个过程中可以结合 小程序-微信官方文档 对感兴趣的知识点进行深入和扩展。


这个系列笔记,IoT小能手将会按照 UI、API、云开发 三个部分,结合教程的 3 个示例系统性地学习小程序的开发,最后运用前面所学知识,实现一个物联网小程序“花花草草守护仪”。


1 UI 页面入门 - Hello World 小程序

1.1 小程序开发入门

这节搭建了基础的开发环境,熟悉了小程序的框架基础,对开发框架做了初步尝试:先是全局性地配置了窗口表现、页面、底部 tab 栏,接着对具体页面做了配置。

1.2 WXML 和 WXSS

这节开始学习小程序的视图层,WXML 和 WXSS 就像网页开发的 HTML 和 CSS,一个负责页面结构,一个负责页面样式,即美化页面。本节尝试使用了 WXML 的 view 组件,同时增加了选择器;通过选择器给相应组件增加了字体文本属性和盒模型属性。

1.3 链接与图片

这节学习了 navigator 组件用于页面跳转,还学习了最常见的图片组件以丰富我们小程序展示,同时还介绍了外链图片、图片裁剪缩放模式、背景图片、美化边框、图片点击跳转等操作。

API 开发入门 - 天气小程序

云开发入门 - 新闻小程序

我的小程序 - 花花草草守护仪

END


展开阅读全文

没有更多推荐了,返回首页