4节课带你光速入门小程序!

说说背景

我去年做过两个小程序,目前累计有近万用户。

最近,项目中接触的前端工作也比较多,想着不如借此机会,把小程序开发也总结总结,结合实践,弄个入门课程分享出来。

正好之前也有小伙伴和我聊过想学学小程序开发,今天我就把这坑填上。

花了几天功夫,我弄了这套光速入门的小程序课程。

只有四节课,但基本涵盖了小程序云开发的全部流程和基本功能点,并附带了小程序代码片段和详细讲解。

代码片段是小程序的代码分享功能,可以直接导入小程序开发工具中运行

学的快的同学,应该一天内开发并上架一款同样的小程序没有任何问题。

下边来简单聊下这次课程。

微信小程序是什么

腾讯官方说:

小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验。

  • 快速的加载

  • 更强大的能力

  • 原生的体验

  • 易用且安全的微信数据开放

  • 高效和简单的开发

我来划个重点:

小程序就是依靠微信这颗大树,开发简单还能实现原生般体验。

当然还有云开发这一杀手锏,省去服务器配置及后端开发的各种繁琐!!!

为什么要光速入门

首先声明,这里光速入门不是噱头,4 节课全跟下来,开发并上架一款基础的小程序没有任何问题,这个我还是有信心的。

然后回到问题:

我一直认为进入新的领域,最好的方式是先快速上手,了解全貌。至于细节部分以后可以慢慢深入。

不然,对于刚接触小程序开发的新手,如果直接一头扎到开发文档中,很容易迷失在海量的信息中,分不清方向,也不利于长期坚持下来。

而且快速了解一个基本概念,并开发一款可以上架的小程序,将是建立学习信心最有效的一种方式。

里程碑式的进步,要比长征式的进步更加持续鼓舞人心不是么?

有什么要求

有一点点前端功底就好!

针对云开发版小程序,真的就只需要一点点前端功底,就是html+css+js 这么简单!而且没有好多地方有微信api支持,少去一些web开发兼容等繁琐。

没有基础也不怕,想学的话,这三样,几个小时就能混个脸熟,后边遇到问题再去查就好了,贴几个网址给小白前端入门用:

  • html 基础[1]

  • css 基础[2]

  • javescript 基础[3]

  • 学习 css 布局[4]

进入正题

废话不多说,我们这期课程开发的目标如下的小程序:【换个头像】

4节课带你光速入门小程序!
长按识别小程序

就是节日里常会疯传改头像的一类小程序。

别小看这个简单的小程序,通过它,我们基本可以了解小程序开发及上线的全套流程。

在里边我也会谈一些小程序开发需要注意的东西和如何避免图片处理踩坑。

课程安排如下:

难度按本课程内容分布安排

  • 基础构建 (难度:★★)

    • 准备工作

    • 目录结构

    • 代码构成

    • 页面搭建

  • 基本功能实现 (难度:★★★)

    • 绘制头像

    • 图片处理的注意点

    • 保存头像

  • 扩展功能 (难度:★★★)

    • 选择图片

    • 裁剪图片

    • 回传图片地址

    • 细节优化

  • 云开发(难度:★★★★)

    • 准备工作

    • 配置管理

    • 图片安全审查

    • 提交代码审核

课程内容的目的就只有一个:帮你快速上道儿!

感兴趣就跟着【课程推文】试试吧!

---

 

参考资料

[1]

html 基础: https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/HTML_basics

[2]

css 基础: https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/CSS_basics

[3]

javescript 基础: https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/JavaScript_basics

[4]

学习 css 布局: http://zh.learnlayout.com/position.html