本文根据 钟鑫「2019 腾讯云 TECHO 开发者大会」分享的《基于云开发模式下的多端电商应用》讲稿整理而成。
自我介绍
大家好,我叫钟鑫,来自京东凹凸实验室,是 Taro 框架的的核心开发成员,同时也曾负责京东购物小程序首页与搜索的开发。
今天我要讲的是 基于云开发模式下的多端电商应用
我有一个朋友跟我说,他在创业公司,他们往往会开辟不同的项目,做不同端的发布,非常的繁琐,希望在低成本,尽量轻便的模式,去做一个项目的市场试水迭代。
那现在这个时候会出现什么问题呢?
零开始,多平台
零开始是什么?
在创业型的公司中,没有在大公司内的一些成熟体系让你直接接入。而是需要自己一步一步的去慢慢完善。在搭建一个完整的应用时,后台部署与运维都是一个让人脑壳痛的问题。
还有就是前端与后端开发直接的“摩擦”。 现在基本上都是一个前后端分离的开发模式,毕竟术业有专攻。
但同时也导致了一些问题。
前后端的一些职责划分, 沟通方式,以及接口的联调。 往往有一些临界的位置,前端可以做,后端也能做。这时候就很容易出现一些摩擦,然后沟通的时间就需要增多。 接口的联调这点我相信在座的应该都有体会,抛开环境复杂因素来说,就仅看数据与展示是否正常,异常临界点处理等等的问题,就需要一些时间。 你可能会说看接口文档,但并不是每一个开发都能做到把文档做到细致,更多的情况下是在沟通。
说完「零开始」,我们来看看「多平台」
如今的前端,仅仅开发的平台就包括 H5 ,各大小程序,比如:微信小程序、百度小程序、支付宝、QQ小程序、快应用等等。 除此之外,有的还会要求需要一点原生开发的知识,去开发 App。
这么多平台的开发,研发成本就上去了,同时不同的平台,代码也不一样,如果有新版本迭代,那每个地方都需要进行改动,维护起来比较困难。
那问题来了,我们如何去专注于业务本身,以及更加有效地维护各平台的代码?
一开始我说,一些创业型公司是希望在低成本,尽量轻便的模式,去做一个项目的市场试水迭代。
何为低成本
部署与运维,监控与告警,我们可以交由云开发去处理。
云开发为开发者提供完整的原生云端支持和微信服务支持,弱化后端和运维概念,无需搭建服务器,使用平台提供的 API 进行核心业务开发,即可实现快速上线和迭代,同时这一能力,同开发者已经使用的云服务相互兼容,并不互斥。
如图所示,云开发更加的高效,只需要专注于业务的开发,而传统的开发除去业务,还有其他的事情需要处理,开发的效率就降低了。
云开发也提供了一定免费额度让我们使用,对比我们传统云主机的部署,减少了人力物力的投入。
除此之外还可以借助云开发的生态与底层资源的专业支持。
我们来对比一下传统开发模式和云开发模式:
在传统模式下,买好服务器配置环境这一步,就需要耗费一定时间,而云开发直接创建一个函数即可。
重要的是,云开发,可以使用 JavaScript 书写。
在这样的情况下,一个前端工程师,也可以变成一个 "全栈工程师"。
何为轻模式?
现在流行构建跨端应用,跨端应用就是希望用一套代码,通过某种方式,去适配到不同端都可以运行的代码。 如:H5、小程序、原生app 等等。
市面上现在很多的多端开发框架,如 Taro, Omi, uni-app, mpvue, wepy。
针对团队偏 React 技术栈的来说,用 Taro 是合适不过的了。
Taro 是什么? Taro 是多端统一开发框架
- 语法风格
- 多端运行
- 组件化
- *cript
- 开发体验
- 现代化的开发流程
那现在小程序以及 H5 已经成为一个项目的 "标配",怎样利用云开发与 Taro 进行一个多端项目开发呢?
以 「京喜」 为例 ( Tips: 京喜为京东旗下社交电商平台,点击 微信 - 发现 - 购物,即刻体验「京喜」~)
目前「京喜」是利用 Taro 开发,生成了 微信小程序端,H5 端,RN 端。这里要说明下, 图中的数据,是利用本地的云开发进行的 mock 数据,正式环境中不是。
要用云开发,首先我们需要创建一下,进入微信开发者工具,我们开通一下,就可以拥有。
云开发的控制台如图所示,可以显示你当前的免费资源额度用量,数据存储信息,以及你的相关后端业务逻辑的云函数。
现在的云开发,也提供了多端环境。
如图所示,只需要引入相关的SDK,即可以拥有云开发的多端能力。
使用 Taro 创建项目,也很简单。
全局安装一下 cli 工具,使用 taro init 。
npm i @tarojs/cli -g
taro init myApp
复制代码
就可以初始化一个 Taro 项目。接下来就是愉快的编写代码啦。
我们在项目全局的 app.js
入口文件,初始化云开发,只需要调用 Taro.cloud.init
,传入云开发的环境ID 即可。 剩下的就是熟悉的 React 语法开发,如图所示。 之后我们需要任何调用的云开发的地方,就可以直接调用相关云函数了。
以上,借助云开发提供的一站式的开发服务,Taro 框架赋予的多端开发特性。我们可以非常迅速的开发出完善的多端应用。
One More Thing
后,One More Thing.
下一代的跨端解决方案
在 Taro 开源的一年多以来,一直保持超高的迭代速度,Taro 的整体架构设计没有发生太大变化,这让 Taro 在这个时刻在变化的时代稍显佛系,且对于一个时刻想要突破自己的技术团队来说,常规性质的维护工作,显然无法安抚我们躁动的心,所以我们决定启动一系列的颠覆式重构设计
下一代的 Taro,除了支持你用 React 语法去进行开发,也将支持 Vue ,Angular 以及其他你想用的框架。
敬请期待,谢谢大家。
欢迎关注凹凸实验室博客:aotu.io
或者关注凹凸实验室公众号(AOTULabs),不定时推送文章: