微信小程序实战 (HelloWorld入门)

简介: 微信小程序实战 (HelloWorld入门)

这一篇开始微信小程序的开发。

我也是初次接触小程序,还是从官方文档开始吧!

1.微信小程序简介

1.1 微信小程序简介

一打开就是小程序简介、小程序技术发展史、体验小程序、、介绍信息,尽管没有干货,但是还是有必要了解一下的。 扫描体验小程序二维码,可以体验一下。

网络异常,图片无法展示
|

1.2 大佬总结的小程序优点和缺点

小程序优点:
1、方便快捷,即用即走。
不需要再下载什么APP啦,既费流量,又占空间内存。小程序就是方便,即用即走。
2、速度快、不占内存
因为小程序前端代码都是存在微信服务器上的,在腾讯云端存放呢,所以无需加载,直接就打开了,速
度也比较快。并且还不占用手机内存。
3、安全稳定、保密性强
其实小程序就类似苹果商店,首先需要审核才能发布。其次小程序通信采用的是https访问,SSL加密通
信,并且小程序样式代码都封装在微信小程序里面,所以安全性更高,更稳定。
4、功能丰富,场景丰富
可以调用比H5更多的手机系统功能来进行开发,例如GPS定位、录音、拍视频、重力感应等,能开发更
丰富的使用场景。
5、开发成本低、维护简便
同样的功能,做一个APP估计需要十几万甚至几十万,而开发一个小程序,一般几千元就搞定了。维护
起来也比较简单方便。
6、附近定位、入口众多
开放的入口比较多,除了通过扫码,发送朋友,搜索,附近等常用入口外,还能与公众号关联,群发文
章嵌入,公众号菜单链接等。
说了这么多优点,那么小程序缺点有哪些呢?
1、微信小程序只有1M的大小,这样导致无法开发大型一些的小程序。所以目前你会看到很多小程序真
的很小很简单。
2、小程序的技术框架还不稳定,开发方法时常有修改,导致短时间内经常要升级维护,或许这能解析为
什么小程序只能1M大小,怕部署太大型的项目会出大问题。
3、不能直接分享到朋友圈,哎呀,少了一个重要的推广方式。4、需要像APP一样审核上架,这点比HTML5即做即发布要麻烦些。
复制代码

2.开始HelloWorld吧

2.1 HelloWorld的准备工作注册开发者账号。

注册地址,根据实际情况填写即可,其中主体类型就选择个人了,对于有条件的可以注册企业、政府类的主体(他们的功能应该是多一些的)

安装开发者工具

下载地址

网络异常,图片无法展示
|

接着就是无脑安装,安装位置不建议C盘。

2.2 创建HelloWorld项目

安装好工具后就开始helloWorld项目了,见下如图。

网络异常,图片无法展示
|

工具介绍

开发工具的窗口构成:模拟器、工具栏、目录树、调试器、编辑器等组成。

网络异常,图片无法展示
|

我们发现模拟器中已经有了Hello World的示例,这是编辑器自动生成的index页面中存在的。我们打开index.wxml可以看到源码它获取了微信头像昵称。其中helloWord是通过motto参数展示的

网络异常,图片无法展示
|

在Page页面的datas属性(页面的初始数据,下一篇页面生命周期中有介绍)中定义motto初始化值为'Hello World'

网络异常,图片无法展示
|

下一篇: 小程序框架基础-应用/页面生命周期


相关文章
|
1月前
|
存储 JSON 小程序
微信小程序入门之新建并认识小程序结构
微信小程序入门之新建并认识小程序结构
50 1
|
1月前
|
XML 小程序 JavaScript
小程序入门之项目配置说明和数据绑定
小程序入门之项目配置说明和数据绑定
40 1
|
1月前
|
JavaScript 小程序 开发者
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
317 0
|
3月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
104 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
1月前
|
小程序 前端开发 JavaScript
小程序入门之认识view和text组件
小程序入门之认识view和text组件
51 0
|
3月前
|
人工智能 搜索推荐 安全
从零到一:微信机器人开发的实战心得
从零到一:微信机器人开发的实战心得
236 2
|
4月前
|
小程序 安全 搜索推荐
【微信小程序开发实战项目】——个人中心页面的制作
本文介绍了如何设计和实现一个网上花店的微信小程序,包括个人中心、我的订单和我的地址等功能模块。个人中心让用户能够查看订单历史、管理地址和与客服互动。代码示例展示了`own.wxml`、`own.wxss`和`own.js`文件,用于构建个人中心界面,包括用户信息、订单链接、收藏、地址、客服和版本信息。我的订单部分展示了订单详情,包括商品图片、名称、销量、价格和订单状态,用户可以查看和管理订单。我的地址功能允许用户输入和编辑收货信息,包括联系人、性别、电话、城市和详细地址。每个功能模块都附有相应的WXML和WXSS代码,以及简洁的样式设计。
209 0
【微信小程序开发实战项目】——个人中心页面的制作
|
4月前
|
小程序 开发者
uniapp实战 —— 开发微信小程序的调试技巧
uniapp实战 —— 开发微信小程序的调试技巧
429 1
|
4月前
|
前端开发 小程序
【微信小程序-原生开发】实用教程20 - 生成海报(实战范例为生成活动海报,内含生成指定页面的小程序二维码,保存图片到手机,canvas 系列教程)
【微信小程序-原生开发】实用教程20 - 生成海报(实战范例为生成活动海报,内含生成指定页面的小程序二维码,保存图片到手机,canvas 系列教程)
409 0
|
1月前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
479 7