0基础快速开发口袋网盘小程序

1
课程PPT
1
课程源码
  • 1
    关注“腾讯产业互联网学堂”公众号加群互动有好礼相送
  • 2
    向学习君回复口令 “5”
  • 3
    获得课程福利包
腾讯产业互联网学堂微信公众号
“腾讯产业互联网学堂”微信公众号

讲师简介

云开发 TCB 团队

为微信小程序开发者提供云到端的一站式解决方案,帮助开发者统一构建和管理资源,能有效降低技术门槛、减少研发成本、提升开发效率,协助开发者快速搭建稳定高质量的微信小程序应用

简介

云开发校园技术工坊活动之技术实操培训,面向参与活动的各个高校团队中的技术Mentor与开发爱好者。

课程讲义

口袋网盘小程序使用的是小程序的云开发,云开发自带免费的云存储、云数据库,开始时不需要涉及服务器的搭建及运维,也不需要进行域名注册与备案,只需要通过一些简单的API就能实现一个完整项目的业务逻辑,免费而且无需后端,开发成本非常低,因此这个小程序从创建到发布都是免费的,非常适合新手。

本期腾讯产业互联网学堂大咖分享邀请云开发 TCB 团队,将会演示如何使用小程序云开发快速开发网盘小程序,在实战环节会带领大家搭建一个可以将手机相册里的照片(或拍照的照片)和微信聊天会话里的文件(比如Excel、PPT、PDF、音频、视频等文件)上传到云开发的存储里,并可以进行分享的网盘。

本次分享内容:

1、为什么要学云开发

2、网盘小程序演示

3、功能的实现与代码解读

4、功能的拓展(课后思考)

为什么要学云开发

在当前的时代,如果想要去做一个自己的产品你可选的语言有很多,如果做的是pc端的应用,那可以用c++、Java,如果想做一个网站应用,那Java、php、JavaScript都是可以选择的。但是,如果想要做一个真正的产品,那么学这些基础语言,然后再去研究,效果可能并不是那么好,因为它们的学习曲线过于陡峭,对于你来说,你的目的是去做好一个完整的项目去实现自己想要达到的目标,那么基于这样的考虑,可能对于你来说一个最好的选择是云开发,云开发一是整个开发的流程是非常快速,你可以快速完成一个应用开发,另一个是云开发的产品本身有一个基础的免费额度,这个免费额度已经足以让你去开发完成一个复杂的,并且可以分享出去的一个完整项目,而不是简简单单的只能跑在自己电脑上的一个demo。

在进行互联网的应用开发的时候,会遇到一些最基础的问题。如服务器需要有计算的能力,因为业务是复杂的,一定会涉及到基础的计算,那这些计算就可以将其放在一个地方去运算,在云开发中就将它称为云函数。那么除了一些基础的计算外,还会涉及到数据的存储问题。在做应用时,一般来说会有两个类型的数据存储。一个是结构化数据,例如,你是一个人,你的名字、身份证号、身高体重是以一个人为基础的,所以,它是有结构化的数据,是可以被索引、被查询的。那非结构化数据,就如图片,图片是无法被查询的,必须一个一个看。在做一个互联网应用时,会经常遇到这两种类型的数据,那么这时就对其分别提供存储。对于前面的结构化的数据,云开发提供了云数据库进行存储。而对于非结构化数据,云开发则提供了对应的云存储。除此之外,对于大家来说,如果想要更好的服务用户,那么就要考虑用户可能并不是你所在的城市的,是全国甚至全世界的一个项目。那在这种情况下,服务器如何更好的去服务用户就会成为个问题,因为毕竟物理距离是很长的,那么访问速度一定会受限制。那这时就可以借助云计算技术,比如说内容分发网络CDN来实现我们访问的加速,在云开发中,内容分发网络CDN也是预先配置好的,不需要自己配置。

小程序云开发能够帮助大家一站式的完成一个小程序应用的开发,它是一站式的后台云服务可以完成你全栈开发的梦想。

云开发的特点有:

  • 免运维,小程序云开发的运维是交给腾讯的员工来负责,由专业的人士来负责专业的事情,对于大家来说,只需要去思考要做的东西是什么,以及如何去做,不再需要考虑买服务器、解析域名、域名备案等等一系列事情,也不再需要考虑当用户流量剧增如何升级服务器的配置、提升性能等,这些都不再是问题,你都可以直接交给云开发来处理。
  • 简单易用,云开发相比于传统的开发模式来说,是更加简单的,因为云开发是由腾讯云和微信团队联合开发的,所以它会有一些和传统开发模式所不同的地方,比如云开发是可以免鉴权地去调用微信的开放能力,以及一些腾讯云的高级能力,可以帮助你以更简单的方式完成应用开发。
  • 与web管理平台无缝对接,云开发不仅仅是在小程序当中为大家提供服务,实际在应用开发中,我们也会发现不光要开发一个小程序,可能还需要一个管理后台,那么这时你就会发现小程序云开发,为大家提供了除外部平台以外的一些内容,你可以在自己的服务器上,搭一个管理后台,可以去做一些其他的东西,然后以使用云开发来实现。

小程序云开发学习的优势:

  • 零基础可学。小程序云发走的还是小程序的技术栈,相对来说不如所谓的现代的这样的一些前端开发体系、后台开发体系复杂,是以简化的一个方案,学起来很简单。
  • 扩展能力强,云开发不同于很多云,它提供了一个云函数,在云函数当中,其实就是一个标准的node.JS环境,你可以在这个环境当中去安装各种各样依赖包,只要node.JS有,都可以去安装来提供不同的功能。 开发快速,体现在云开发和小程序所使用的技术栈是一致的,可以提高开发效率。例如我们青岛很多的团队,他们后台往往是用Java、python、php来写的,还有另外一个人来写前端,因为写前端用的JavaScript,这就会导致一个团队至少是两个人来开发。只要是两个人,那就会存在一定的沟通成本,从而导致开发速度下降。但是在云开发当中使用的全是JavaScript,你可以一个人去搞定所有的事情,这样就可以以更快的速度完成产品的迭代和应用开发。
  • 易于分享,小程序是我们近两年来看到的一个新的产品形态,在过去,我们使用的是H5和app,但会发现H5的问题在于体验不够好,app虽然体验很好,但让用户下载的成本非常高,很难说很轻松地让用户去接受新的应用。而小程序就是其中的一个中间点。一方面它的功能很强,另一方面它又没那么大,可以在微信当中直接打开,可以很轻松地在你的微信群微信聊天当中去分享小程序。如果想分享到朋友圈,也可以通过生成海报来完成。

如果你想去做一个app客户端,想去实现一些东西,那么其实更推荐你从先做小程序开始,你学了云开发小程序,可以先做一个小程序版本,然后如果你的业务足够大,有足够多的价值去开发一个原生的app,你再去开发一个原生客户端。

如果你想学前端开发,那你也可以从小程序云开发开始,因为现在的前端的开发体系一方面是我们所熟悉的,像HTML、JavaScript、css这些,另外一方面就是node.js在其中占据了很多的力量。在小程序会开发当中,你会把这些东西都学到,小程序开发部分你会学到JavaScript、css和html的一些基础知识,而在云开发当中,你就会了解到node.js相关的一些信息,能够帮助你去掌握整个前端开发体系中所用到的技术工具。

如果你想学编程,并没有那么大的理想,只是说想做一点东西来满足自己的需求,那么小程序云开发是更适合你的。因为小程序它使用起来更简单制作起来成本也不高,学起来很简单,同时云开发提供了足够的免费额度可以帮助你的产品快速上线,上线以后获得第一批用户你不再需要去维护你的服务器,你只需要去考虑如何把产品去制作出来就可以了。

所以小程序云开发是我们推荐大家学习掌握的。

网盘小程序演示

可以看到,在这个应用中,其实用到了很多不同的能力,比如说使用的界面,非常像微信的官方的界面,那么这是因为我们在写代码的时候使用了微信官方所提供的这样的一个WeUI组件以及其对应的扩展能力。其次,看到在小程序当中实现了照片的选择,以及文件的选择,还将生成的一个链接复制到了剪贴板中,这些都是调用了小程序的相关api。还实现使用云存储来存储文件,使用云数据库存储数据记录,那么这样就完成了我们想要的网盘的功能。

功能的实现与代码解读

具体看一看代码是怎么实现的。在正式学代码之前,先要学如何去看代码。首先需要了解生命周期,看代码时候,要先了解代码它的生命周期是什么,并且跟着生命周期的节奏去一点点去看代码是什么样的。除了生命周期以外,在界面当中涉及到不同的按钮,我们也可以通过这个按钮来去追查逻辑是如何实现的,比如说点击按钮,会触发什么样的事件,点击目录,会触发什么事件,那么根据这些也可以学到一些代码。在进行使用的时候,要注意多使用console.log来去将我们的信息打印出来,这样可以看到不同时间段我们的数据是如何变化的,可以更加有效地帮助你去理解业务逻辑。

功能的拓展(课后思考)

看一看这个小程序的功能拓展,在功能拓展时,注意小程序虽然现在已经开发完了版本,但并不意味着就这样结束了,实际上,功能可能有非常多不完善的地方,比如目前并不能在小程序当中去删除上传的文件,也没有去限定上传文件的大小,没有限定哪些人可以上传,也可以去做类似于微信朋友圈的一个展示的效果,目前上传什么都是文件图标,而不是图片展示图片的图标,文件展示文件图标,也没有加入专属水印等等功能,这些功能实际上对于大家来说都可以去动手尝试一试的。

那么除了所提出来这些可以去迭代开发增加的功能外,也可以从自身的角度去考虑说我们这样的一个产品,如何才能变得更好。这个网盘也还可以再加一些什么功能,其实你都可以在群中提出,或者在我们的GitHub上开issue提出,来告诉我们还有什么功能其实是可以去做的。

当然如果你有足够的能力说这个功能我也可以做,可以去为你贡献。那更好,大家可以来参与到我们项目当中的贡献,来提升自己能力并且,你可以想一想你的名字,会挂在腾讯官方的项目下,到时候也可以作为实习,包括你工作申请时的这样的一些证据。

实战源码:github.com/TCBWorkshop/clouddisk

全部评论
讲师/助教

评论

直播日历