小白如何自学制作小程序?
先学thinkphp,再来小程序的那一套规则。0基础的话,努力点2年可以独立做个简单的
1. 当你准备开发一个微信小程序的时候,你首先需要一个小程序的 APPId ,在微信公众号官网可以获得。(暂时只有官方邀请的才可以获得)。
你还需要准备微信者工具,官网同样有下载,下载安装即可,支持windows,linux,和MAC平台。
2. 小程序使用的微信自己开发 MINA 框架,提供了视图层描述语言,WXML 和 WXSS 以及基于JavaScript的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统,可以让开发者可以方便的聚焦于数据与逻辑上。
打开的时候会自动提示创建一个demo,demo结构文件树如下:
3. 其中app.js、app.json、app.wxss 是必不可少的,是小程序生成的依赖文件。
app.js 监听并控制这整个程序的生命周期,也是全局变量声明的地方。如下是 app.js 中的一段代码:
4. 上述代码中的一些 API 介绍:
App : 注册一个小程序
onLunch :程序加载时执行的方法
getStorageSync:以同步的方式获取本地缓存
setStorageSync:设置缓存
wx.getUserInfo: 获取用户信息
5. app.json 是对整个小程序的全局配置。不可注释。
pages为注册页面的列表,均为相对路径,省去了后缀名,程序默认显示列表第一个。
6. app.wxss 是整个小程序的公共样式表。
其中:
apx 是尺寸单位,可根据屏幕宽度自适应大小。与之对应的有rem:规定屏幕宽度为20rem;1rem = (750/20)rpx 。
7. 全局文件就这些,然后我们看 index 文件中的内容
有三部分内容,index.js ,index.wxml ,index.wxss,下面介绍它们的作用。
8. index.wxml 文件
这是一个展示页面,作用于html相同。可以看出,内容分块均采用 view 标签,这也很容易让人想到Android 中的布局,但其实只是更多的是 div 标签的另一个版本,在这里面有很多 MINA 自定义的属性,而且在我们在其中也看到了{{ }}样式的值操作,这也很容易让人联想到 angularJS 中的数据双向绑定,在 MINA 中也是支持的。
同时,页面的展示,均需要在小程序全局的json配置文件中配置,前面已有说明。
9. index.js 文件
其中:
getApp() 获取应用实例
Page : 声明页面。
data: 定义数据
bindViewTap :为在view中绑定的是tap事件定义操作方法。
wx.navigateTo :导航到响应页面。
onLoad : 定义页面加载时的事件。在这里使用了在全局 app.js 中定义的回调函数,将data中的数据更新,由于双向的绑定,页面中的 userInfo 实例也会更新,显示出您的头像和昵称。
10.
index.wxss 中同样定义了一些样式,写法思路与css文件基本一致,只是不需要再去关心屏幕适配问题。
随后就是效果展示了,在开发者工具中扫码即可查看效果。
谢谢邀请:
针对小白制作小程序建议使用第三方小程序平台
微信小程序已经迈入了爆发阶段,很多中小企业和商户正在不断涌入这个市场。但是很多不懂技术不懂代码的小白却不知道去哪里制作微信小程序,现在就以可视化小程序开发工具「速成应用」来告诉你们,如何制作出专属于自己的微信小程序。
针对想制作微信小程序却不懂技术不懂代码的小白,速成应用不但提供了海量的精美模板,还把小程序的页面拆分成诸如社区模块、电商模块、预约模块、餐饮门店、拼团秒杀等多个功能模块组合,也可以将功能模块拆分成大量更细致的组合,让一些不想套用模板又想省力的用户可以使用各个组合或者功能模块组装成一个新的小程序页面,继而制作出一个全新的微信小程序。接下来就来看看如何使用模块拼接成微信小程序。首先进入「速成应用」网站首页,点击“制作”,选择“空白模板”即可进入编辑页面。
进入编辑页面,可以看到左侧一栏的【组件库】。下面以"轮播banner"为例:添加“轮播”,点击“管理轮播图分组”往里图片,完成一个布局后保存,点击预览可以查看刚刚添加效果!
添加店铺名称和导航,首页先点击左侧自由面板,然后选择文本进行编辑文字,导航图片点击左侧“图片”然后直接拖拽到“自由面板”空白的地方替换图片,修改尺寸就可以了。地图导航链接,点击事件,调用功能选择“地图导航”,添加之前先到地图管理里面添加地址
图片列表添加,点击左侧“图片列表”点击添加图片,先填写表填,然后点击更好图片,布局和排版更具自己的喜好来设计!
点击预约到店里的“技师列表”显示数量设置好,点击管理对象,跳转到后台添加技师基础设置、预约设置、详情页样式设置,保存后前端预览就能显示出来了。
底部导航设置:点击底部导航,然后点击“添加”设置底部导航图片和描述,替换设置好图片和描述,点击链接至“预约”然后保存就OK了.
其他子页面点击右下角,添加页面或添加分组,其他操作或设置跟主要操作基本一样的。
编辑好页面以后,建议大家先点击保存,然后再点击上方的「管理」进入后台。看到左侧的后台功能列表,用户可以找到部分对应的模块上传数据。比如进入页面数据,展示的是用户制作好的页面。在这里可以添加店铺设置,服务管理,订单管理等
当前端和后台都调整好后,回到小程序编辑页面点击右上角的「保存」,然后「预览」看页面显示效果,确定界面显示没问题后点击右上角的「发布」,会自动跳转到后台,此时我们进行打包上传,选择微信小程序,可以选择一键上传至微信公众平台,直接登录小程序后台提交审核,或者下载代码包自己通过开发者工具上传。
上传好后,等待微信平台那边审核通过就可以发布啦,发布后就可以在微信搜索到专属你的微信小程序了。是不是特别简单?赶快来试试看吧~
你如果是小白,大神的任何干货,你都看不懂 好吧~_~
你面对大神的干货,都是个小白。
先从阅读微信官方开发指南开始,然后去技术论坛上下载一些前辈们的小程序开发源码;不过如果你想快速开发完成一个小程序,那么可以省略这些步骤,用小程序模版制作一个小程序。
找到要模精品的小程序,破解它,虽然不能拿到100%可运行的代码但是可以超样式,知道他们用了什么开元控件之类。
夜神模拟器,得到小程序安装包,拷贝到电脑上 https://www.yeshen.com/
破解到脚本 *.wxapkg 解包到源码 https://github.com/qwerty472123/wxappUnpacker
下载解压,运行下面的命令。缺少依赖按,提示安装。 node wuWxapkg.js _-1480364242_104.wxapkg
小伙子,听说你要干货?
来,我教你
前端方面的需要学习css 加 小程序特有的标签,看这两个教程,小白预计耗时1-2个月
CSS 教程 | 菜鸟教程微信开放文档把这些都看完先,基本能做出个界面出来,但是还没功能的,再来学后台语言php或者java来做功能,小白耗时3-4个月
PHP 教程 | 菜鸟教程类似这种风格的,以为学完这些就够了?接着学mysql,再学服务器linux去吧,这些都是干货,你确定小白能学下来?
小白想做小程序商城的话,与其费时费力,还不如找专业的服务商更好
现在无需代码编程的第三方平台有很多,推荐百赞小程序这个制作平台,多模板选择,功能强大,小白也能轻松做出一个漂亮的小程序出来
百赞小程序-专注于微信小程序开店|开发|制作|模版-上小程序,用百赞