微信小程序入门教程+案例demo

尊重原创,转载请注明出处:原文查看惊喜更多 http://blog.csdn.net/qq137722697


首先摆在好姿态,——微信小程序开发也就那么回事。你只需要一点点css(真的只要一点点)的基础就可以了。

认清微信小程序开发

其实,我觉得小程序就是将微信官方提供20+个基础组件(目前有26个)进行排列组合,然后加上一些css样式,对用户的操作进行反馈(调微信官方提供的60+个api)。26个基础组件+60个开放api=半天就搞定了吧?(认真跟着下面的教程走半天足够了)

怎么学?

1、开发工具你得有吧?

这里是最新版下载链接(传送门)—>微信web开发者工具最新版下载地址

目前微信小程序开发工具已经不需要破解都可以了,你只要使用手机端微信扫一扫登录开发工具,在创建应用的时候选择为无APPID就可以开发了。

2、开发文档得有吧?

很多人可能觉得看视频要习惯点(CSDN学院的微信小程序实战视频),但是本人建议学新东西不要看视频,入门最好的方式就是看官方文档(还有什么谁比官方自己更懂自己的东西呢!),下面是官网地址:

微信小程序官方文档(传送门)

当然这里推荐看W3CSchool整理的文档,思路相对比较清晰。(再来个传送门)

3、基础会了,再来点实战

学完一样东西,最好的方式就是将这个东西付诸于实践,下面进入实战《微信小程序之百思不得其姐(简版)》,如果你能全程跟着做出来,那么你就已经入门成功了。

先看效果图

说明这个项目的IDEA是借鉴了这位大哥的,感谢这位大哥

再来看看项目截图

具体的代码这里我不就贴了,我把整个项目打包直接下下来就可以用(点我下载DEMO)。

我使用到的图标都是从阿里巴巴的iconfont下载的(之前不知道的简直就是非常大的福利哦,你用了就知道)。

4、项目还不够?

如果你觉得上面的实战还不够激发你的潜能,那么下面给出几个我在学习过程中找的IDEA,希望对你有帮助。

1)、计算器
https://github.com/dunizb/wxapp-sCalc

2)、豆瓣图书
http://www.jianshu.com/p/c35084200470

3)、移动商城
https://github.com/liuxuanqiang/wechat-weapp-mall

4)、天气
http://swiftcafe.io/2016/10/03/wx-weather-app/

5)、空气质量查询
http://blog.csdn.net/yulianlin/article/details/52692066

6)、github客户端
https://blog.zhengxiaowai.cc/post/weapp-demo.html

7)、知乎日报
http://www.apkbus.com/forum.php?mod=viewthread&tid=268626&extra=page%3D1%26filter%3Dsortid%26sortid%3D12


最后

感谢上面提到demo的作者们,共同进步……

微信小程序入门教程+案例demo相关推荐

  1. 微信小程序入门教程---列表渲染多层嵌套循环及wx:key的使用(双层for循环)

    前言 入门教程之列表渲染多层嵌套循环,目前官方的文档里,主要是一维数组列表渲染的案例,还是比较简单单一,给刚入门的童鞋还是无从入手的感觉. <view wx:for="{{items} ...

  2. 从零开始的微信小程序入门教程(一)

    从零开始的微信小程序入门教程(一) 之前说要和同事一起开发个微信小程序项目,现在也在界面设计,功能定位等需求上开始实施了.所以在还未正式写项目前,打算在空闲时间学习下小程序.本意是在学习过程中结合实践 ...

  3. 从零开始的微信小程序入门教程

    之前说要和同事一起开发个微信小程序项目,现在也在界面设计,功能定位等需求上开始实施了.所以在还未正式写项目前,打算在空闲时间学习下小程序.本意是在学习过程中结合实践整理出一个较为入门且不是很厚的教程, ...

  4. 微信小程序入门教程 --(保姆级)

    一.小程序注册 1.首先,到小程序官网注册自己的小程序账号,以下附有地址和教程: 小程序官网 进入这个地址之后,会看到这样的页面,点击立即注册按钮 2.在接下来的页面,选择小程序 3.然后根据提示完成 ...

  5. 开发微信小程序入门教程,含破解工具

    2016年09月21日晚 微信发不了微信"小程序"的内测版,一时间整个互联网都炸了锅.个大新闻.论坛都在讨论这个事情. 作为互联网的一猿,我们怎能不紧跟时代的脚步.于是第二天上午也 ...

  6. 微信小程序入门教程学习笔记

    写在前面: 作为一个刚刚入坑微信小程序的小白,以下是我在学习中的笔记,因为我真的太健忘了... 文章中可能会有错误,但是我会不断的修正的. 谢谢浏览,如有错误烦请指正 (≧∀≦)ゞ 微信官方的小程序开 ...

  7. 微信小程序入门教程之三:脚本编程

    这个系列教程的前两篇,介绍了小程序的项目结构和页面样式. 今天,接着往下讲,教大家为小程序加入 JavaScript 脚本,做出动态效果,以及如何跟用户互动.学会了脚本,就能做出复杂的页面了. 本篇的 ...

  8. 微信小程序入门教程及实例

    原文地址:https://mp.weixin.qq.com/s?__biz=MzAwNjI5MTYyMw==&mid=2651493295&idx=1&sn=4dc4c5701 ...

  9. 微信小程序入门教程之四:API 使用

    目录 一.WXML 渲染语法 二.客户端数据储存 三.远程数据请求 四.组件 五.获取用户个人信息 六.多页面的跳转 七.wx.navigateTo() 本篇就介绍怎么使用 API. 所有示例的完整代 ...

最新文章

  1. 优雅的缓存解决方案--设置过期时间
  2. 六大重点工程构筑兰州大数据产业
  3. Java的知识点28——文件编码、IO流的实例
  4. 阿里RocketMQ是怎样孵化成Apache顶级项目的?
  5. 利用string 字符串拷贝
  6. c语言程序设计 猜数字,C语言程序设计(猜数字游戏)报告.doc
  7. python 百度文库_百度文库文档下载地址解析python版【摸索不易,还请支持】
  8. 主机电子游戏攻略资源分享
  9. Linux系统u盘win7没驱动程序,u盘安装win7找不到设备驱动程序,教您解决u盘安装win7找不到设备驱动程序...
  10. php导出word样式控制,php导出word文档样式以及word文档分页
  11. win7计算机锁频图片怎么设置,win7锁屏壁纸怎么换_win7更换锁屏壁纸的操作方法...
  12. 神经网络与傅立叶变换到底有没有关系?
  13. 11.0、C语言数据结构——栈
  14. Modelsim添加altera仿真库
  15. 模仿Airbnb的悬浮搜索框动画
  16. WebRTC技术实现视频及语音聊天
  17. 穷不是中年危机的理由
  18. 客服人员如何摆脱工作上的负面情绪
  19. PLATO-2: Towards Building an Open-Domain Chatbot via Curriculum Learning
  20. GoldenDict词典下载安装

热门文章

  1. verilog的免费编译器
  2. iPhone 13屏幕卡死黑屏、无法关机?如何解决
  3. 阿木社区的SLAM无人机硬件配置
  4. 电脑桌面快捷方式更换图片
  5. 本周运气大爆发~希望不会把自己的好运都用光了……
  6. 脚手架vue-cli系列二:vue-cli的工程模板与构建工具
  7. mysql将多行结果合并
  8. 让自己分享的网址在QQ中更有逼格
  9. 解决 oracle 错误ORA-01033
  10. 超分辨率(CVPR2020) ~《Video Super-resolution with Temporal Group Attention》