史诗手册!微信小程序新手自学入门宝典!

2017-01-11

一、小程序官方指南


1:官方开发工具下载:

https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=201714

0.12.1304Win版:https://pan.baidu.com/s/1miNleBY

0.12.1304Mac版:https://pan.baidu.com/s/1qYNIQZy


2:官方提供的简单教程

https://mp.weixin.qq.com/debug/wxadoc/dev/


3:小程序设计指南:

https://mp.weixin.qq.com/debug/wxadoc/design/index.html


4:小程序运营规范

https://mp.weixin.qq.com/debug/wxadoc/product/index.html


5:小程序接入指南

https://mp.weixin.qq.com/debug/wxadoc/introduction/index.html 


6:小程序支付文档:

https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_3&index=1 


7:小程序客服消息:https://mp.weixin.qq.com/debug/wxadoc/introduction/custom.html?t=20161221 


8:特殊行业所需资质材料:https://mp.weixin.qq.com/debug/wxadoc/product/material.html?t=201714 


9:小程序数据分析:

https://mp.weixin.qq.com/debug/wxadoc/analysis/index.html?t=201714




二、如何自学小程序



1、了解基础知识先!去网上搜搜看什么是CSS,HTML,JS;

CSS+HMTL+JS入门干货分享

链接: https://pan.baidu.com/s/1i5I76kd 密码: 6r42


2、读读上面提供的官方文档,看看都能干什么;

微信小程序官方文档知识解读,推荐新手仔细阅读

http://www.moquu.com/v/1427.html

微信小程序认知、安装与demo学习摘要

http://www.moquu.com/v/426.html


3、降低预期,不要一开始就想做出多牛逼的,就从静态页面开始;

初识微信小程序:结构概览,app.js 解析

http://www.moquu.com/v/414.html

微信小程序开发及发布实践

http://www.moquu.com/v/425.html


4、写代码跟做设计一样,模仿才是王道!下载人家的demo,看看怎么写的,修改修改,找到思维逻辑,就会一步步往前走了!

500款小程序案例源码下载

http://www.moquu.com/m3


5、不懂就问,新手入门的知识点!基本网上都搜的到答案!自学的话,就不要想着太依赖他人!



三、开发前必读



微信小程序政策虽不允许个人开发!其实也可以通过方法,申请到开发权限,只是不是能发布而已!有了开发权限,对于只是自学还是够了!


个人无appid申请开发者权限,无限制账号申请方法

http://www.moquu.com/v/372.html

关于如何真机预览(手机测试)简易流程说明

http://www.moquu.com/v/1534.html


如何设置体验者/开发者/体验版本

http://www.moquu.com/v/1535.html


如果是企业的话!由于微信小程序需要https请求,需要准备

1:备案的域名:

2:受认可的证书https

3:如开发多个小程序,要申请多个开发者帐号!因为一个账号只能发布一个


https问题排查说明:

http://www.moquu.com/v/1528.html


需要使用微信支付功能,要先微信认证!认证方法:

https://mp.weixin.qq.com/debug/wxadoc/product/renzheng.html?t=201714


最新微信小程序服务范围!

http://www.moquu.com/v/1551.html


微信小程序服务类目审核不通过?解决方法...

http://www.moquu.com/v/1552.html



四、开发工具说明



开发工具界面说明


配置信息:用于解决在后台配置域名未生效的问题;

预览:真机预览

上传:管理员上传至后台,设置体验及审核版本使用;

开发环境不校验:为了让开发环境中使用appid时,不合规则的域名也可以正常使用(比如本地或IP地址及未配置的域名)

压缩代码:为了节约空间,小程序上限为1M:参考:http://www.moquu.com/v/1536.html

删除项目:删除相应的项目



代理:在这里可以设置代理,或取消代理;用于解决很多因代理而引发的问题;





选择无appid,即可在没有appid情况下进行开发,但是无法预览;

项目名称:随意填写

项目目录:1:如果你选择了一个demo导入,请选择app.json所在的根目录文件夹,请勿选择其上级文件夹,否则会报错:找不到app.json;2:如果你想新建一个项目,请先在电脑内新建一个空文件夹,选择空文件夹即可,假如你选择的不是空文件夹,可能无法看到新建quickstart项目;




快速生成项目目录技巧:在app.json内输入路径后保存,即可生成相应路径的完整文件目录,防止因js或json文件为空而引发的一系列报错


后台配置域名方法:

http://www.moquu.com/v/1532.html


必须配置域名后,才可以使用配置的域名,比如你需要请求XX地址的数据,必须在后台设置了域名之后,才可以真机请求数据; 必须https的域名才可以请求,如果出现https的问题,请查询排查:http://www.moquu.com/v/1528.html



开发工具快捷键说明


格式调整 

Ctrl+S:保存文件(必须保存才可以看到效果) 

Ctrl+[, Ctrl+]:代码行缩进 

Ctrl+Shift+[, Ctrl+Shift+]:折叠打开代码块 

Ctrl+C Ctrl+V:复制粘贴,如果没有选中任何文字则复制粘贴一行 

Shift+Alt+F:代码格式化 

Alt+Up,Alt+Down:上下移动一行 

Shift+Alt+Up,Shift+Alt+Down:向上向下复制一行 

Ctrl+Shift+Enter:在当前行上方插入一行 

Ctrl+Shift+F:全局搜索 


光标相关 

Ctrl+End:移动到文件结尾 

Ctrl+Home:移动到文件开头 

Ctrl+i:选中当前行 

Shift+End:选择从光标到行尾 

Shift+Home:选择从行首到光标处 

Ctrl+Shift+L:选中所有匹配 

Ctrl+D:选中匹配 

Ctrl+U:光标回退 


界面相关 

Ctrl + \\:隐藏侧边栏 

Ctrl + m: 打开或者隐藏模拟器


五、小程序开发详解



1、开发准备,开发工具使用简介,工程目录结构 

http://www.moquu.com/v/1537.html

2、开发组件使用初步,配置 

http://www.moquu.com/v/1538.html

3、APP生命周期 

http://www.moquu.com/v/1539.html

4、页面生命周期和参数传递 

http://www.moquu.com/v/1540.html

5、布局基础 程序员实战系列 

http://www.moquu.com/v/1541.html


6、零基础小程序开发系列《一》理论篇

http://www.moquu.com/v/1405.html

7、程序员开发实战系列《二》微信小程序架构篇

http://www.moquu.com/v/1554.html

8、程序员开发实战系列《三》App()和Page()

http://www.moquu.com/v/711.html

9、视图层WXML绑定数据、模板、逻辑

http://www.moquu.com/v/722.html

10、实战视图层WXML:事件

http://www.moquu.com/v/723.html


11、学习记录《一》:目录结构介绍,开发工具菜单介绍

http://www.moquu.com/v/735.html

12、学习记录《二》:系统配置app.json,程序和页面注册

http://www.moquu.com/v/737.html

13、学习记录《三》:视图容器

http://www.moquu.com/v/745.html

14、微信小程序开发(一)开始

http://www.moquu.com/v/1543.html

15、现学现卖微信小程序开发(二)

http://www.moquu.com/v/1544.html


16、现学现卖微信小程序开发(三):引入“Rx”

http://www.moquu.com/v/1545.html

17、现学现卖的一个“快递查询“的小程序开发

http://www.moquu.com/v/1553.html

18、微信小程序登录与支付简要流程

http://www.moquu.com/v/1412.html

19从零入门系列《二》手动创建目录结构

http://www.moquu.com/v/1039.html

20、微信小程序开发—快速掌握组件及API的方法

http://www.moquu.com/v/1001.html


六、新手跳坑指南



新手跳坑指南《一》:真机上预览,背景图无效

http://www.moquu.com/v/502.html

新手跳坑指南《二》:app.json之pages路径重复错误

http://www.moquu.com/v/503.html

新手跳坑指南《三》:宽高设置百分比无效果

http://www.moquu.com/v/504.html

新人跳坑系列《四》官方文档BUG,tip及QA提示一览

http://www.moquu.com/v/1053.html

新手跳坑指南《五》:this与that:this.setData报错

http://www.moquu.com/v/506.html


新手跳坑系列《六》:找不到自己的相匹配手机预览页面

http://www.moquu.com/v/507.html

新手跳坑系列《七》tabBar不显示

http://www.moquu.com/v/508.html

新手跳坑系列《八》MAC版微信WEB开发者工具无法显示二维码

http://www.moquu.com/v/509.html

新手跳坑系列《九》:post请求

http://www.moquu.com/v/92.html

新手跳坑系列《十》修改配置域名后,不在以下合法域名列表内

http://www.moquu.com/v/91.html


新手跳坑指南《十一》require 和hidden不生效,@import无效

http://www.moquu.com/v/90.html

新手跳坑指南《十二》事件绑定调用多次

http://www.moquu.com/v/89.html

新手跳坑指南《十三》手机中浏览时显示空白页

http://www.moquu.com/v/88.html

新手跳坑指南《十四》真机预览限制大小1024K

http://www.moquu.com/v/87.html


新手跳坑指南《十五》view标签设置背景图片手机无法预览

http://www.moquu.com/v/86.html

新手跳坑系列《十六》没有配置路由,input,空格回车,中文

http://www.moquu.com/v/1576.html

新手跳坑系列《十七》Page route 错误

http://www.moquu.com/v/1577.html

新手跳坑指南《十八》wx.showToast消息显示框手机预览失败

http://www.moquu.com/v/1574.html

新人跳坑系列《十九》swiper无法保持宽高比

http://www.moquu.com/v/1572.html

新人跳坑系列《二十》文本溢出

http://www.moquu.com/v/1571.html


更多新手跳坑指南

http://www.moquu.com/t-1-1.html



七、小程序图书干货



1、免费在线的小程序培训课程大全

http://www.moquu.com/v/1636.html

2、微信小程序设计规范PDF版

http://www.moquu.com/v/1635.html

3、node及js类书籍分享(130本)

http://www.moquu.com/v/1634.html

4、微信小程序框架脑图全解,一眼看清框架构造,学习必备

http://www.moquu.com/v/1633.html

5、微信小程序开发手册PDF

http://www.moquu.com/v/1626.html


6、小程序自定义组件实战

http://www.moquu.com/v/1632.html

7、野狗与微信小程序

http://www.moquu.com/v/1631.html

8、小程序入门指南

http://www.moquu.com/v/1630.html

9、从HTML5到微信小程序

http://www.moquu.com/v/1629.html

10、oschina源创会大会分享PPT下载

http://www.moquu.com/v/1628.html


11、微信小程序官方设计指南及建议PDF版

http://www.moquu.com/v/1627.html

12、微信小程序设计控件库源文件

http://www.moquu.com/v/303.html



八、小程序必备插件



1、一个微信小程序模版程序框架

http://www.moquu.com/v/1647.html

2、微信小程序经典APP按钮指示器框架

http://www.moquu.com/v/1646.html

3、微信小程序模块化开发框架labrador

http://www.moquu.com/v/1645.html

4、野狗SDK(微信微信小程序版)

http://www.moquu.com/v/1644.html

5、一个为微信小程序开发准备的基础骨架

http://www.moquu.com/v/1643.html


6、处理微信小程序会话

http://www.moquu.com/v/1642.html

7、微信小程序云端增强 SDK

http://www.moquu.com/v/1641.html

8、微信小程序集成redux,提供快捷的开发环境

http://www.moquu.com/v/1640.html

9、一个开放的、运行微信小程序的Web MINA框架

http://www.moquu.com/v/1639.html

10、微信小程序Canvas增强组件

http://www.moquu.com/v/1638.html


11、微信小程序-简易框架

http://www.moquu.com/v/1637.html

12、可视化小程序UI设计工具layout

http://www.moquu.com/v/673.html

13、微信小程序后台内容管理程序laravelPCMS

http://www.moquu.com/v/447.html

14、小程序脚手架及html编译工具

http://www.moquu.com/v/446.html




11
收藏