前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >1天搞出一个教育类App!我是怎么办到的

1天搞出一个教育类App!我是怎么办到的

原创
作者头像
海岛船长加西亚
修改2023-11-28 14:39:09
2490
修改2023-11-28 14:39:09
举报
文章被收录于专栏:用户8927754的专栏

最近项目组接了一个开发教育类APP的需求,经典要求:多快好省(功能样样有、项目要得急、还得低成本)手动🐶。组长开始让调研一下给个方案,结果我啃哧啃哧1天就搞出来了,目前运行良好。在此记录一下开发过程,也跟各位做个分享。

简单说一下背景:我司服务的甲方是一家备考学习平台,主要为成人教育提供考前辅导、在线课程直播、在线刷题等应用。在做APP之前,在XX优课的小程序也是由我们团队开发的,用的是微信原生开发。伴随着业务的发展,重度用户有对 App 的使用诉求,企业也要沉淀客户。于是就有了开发APP 的需求。

  • 开发需求:开发一个APP
  • 核心功能包含:课程录播、课程直播、在线刷题、资讯
  • 前端技术栈:WXML ;FinClip

由于客户需求已经由小程序实现过一次,在没有新增需求的情况下,我选择了用小程序转APP的方式来实现。小程序转APP的原理实际上是将小程序离线包内置到FinClip 生成的Android/IOS工程中,并且FinClip 支持线上直接打包成APK或IPA。其中生成的Android/IOS工程默认集成了FinClip 小程序容器SDK,并且默认在手机端打开APP应用时会默认打开API。

简单来说,其实是通过FinClip 生成一个APP应用的“壳”,在这个“壳”里面打开已上架的小程序,所以小程序转APP之前,我们需要有一个已在管理后台上架的小程序。

一、准备工作

下载并安装FinClip Studio。

二、新增小程序

登录FinClip 后台,在小程序管理->我的小程序新增一个小程序。

比如新增了一个小程序叫newapp3,那么名称写newapp3,分类、标签、简介写其他即可。

三、新增合作应用

应用管理->新增合作应用。

给这个应用增加一个Bundle ID。

在newapp3一栏点击关联小程序,找到刚刚新建的newapp3,新增关联。

四、创建工程

回到桌面,在下载一栏,新增一个空文件夹,命名它为newapp3。打开FinClip Studio开发工具,项目目录选择刚刚创建的newapp3文件夹,APP ID选择newapp3,然后点击完成。

直接使用IDE打开小程序项目并选择后台对应的APP ID即可。

五、将小程序提交到云端

1、上传

2、审核

回到FinClip 后台,在小程序管理->我的小程序找到newapp3->详情->审核版本→新增审核。

勾选刚刚上传的首次发布版本,点下一步->下一步->提交。

此时,该版本会进入审核的队列。

3、同意审核

我们回到小程序管理->小程序上架审核->详情一栏,点击同意即可同意此次审核。

4、上架

在小程序管理->我的小程序找到newapp3->详情->审核版本->版本上架->确认上架。

此时,小程序的代码就成功提交到云端了。

六、进行APP相关配置

1、本地编译

若你有一定的开发基础,可以选择本地编译,相关配置项需要自行配置,可参考:本地工程文件配置

点击IDE的菜单栏生成APP->下一步->本地编译->下一步→选择相应APP ID->下一步->确认配置APP信息->下一步->导出目录->完成->等待导出。

生成成功就可以在目录下找到啦!!

2、云打包

此时你需要先进行生成APP相关配置。点击IDE的菜单栏生成APP->生成APP配置。

(1)基础配置

填写应用名称/应用 App 版本号/应用 build 版本号。

(2)图标配置

提供简单模式和定制模式。

(3)启动闪屏配置

打开 App 时的加载的图片,上传 iOS 与 Android 平台中相应尺寸的图片即可。

(4)URL Scheme配置

不同 App 间唤起的标识信息,可供您基于推送等渠道打开 App。

(5)权限配置

分为用户隐私协议配置(勾选后会在首次打开 App 时显示隐私配置,相应的配置需要去「管理后台-小程序详情-隐私设置」进行配置)与权限配置(当需要将 App 上架至应用商店时,需要先行配置其中的使用权限)。

相关描述根据需要填写即可。

(6)第三方SDK配置

通过配置第三方SDK可以使 App 获取一些扩展能力,比如高德地图/微信登录等。

需要获取相关配置信息并填写,第三方SDK配置详细步骤及其相关信息获取可以参考:第三方 SDK 参数配置

最后,点击保存即可。当然,有些配置是非必要的,可以根据个人情况按需填写。

七、准备证书

由于证书与 BundleID 之间是一一对应关系,因此需要上传所需的证书。

IOS生成证书

Android生成证书

Android生成证书(推介)

八、生成APP

点击IDE的菜单栏生成APP。

点击下一步->云打包->下一步->选择相应APP ID->下一步->确认配置APP信息->下一步->选择APP所属平台(IOS/Android)->下一步->填写证书信息及上传证书->下一步->任务提交成功。

点击查看编译任务列表->查看云打包进展->成功后点击下载安装包并安装运行即可。

到这里,就是我们生成APP的所有步骤了,你学会了吗?多说一句,教育类应用的用户普遍关注多媒体播放的体验,如音视频播放是否流畅、操作是否便捷。从运行效果来看小程序构建的App交互体验非常优秀,稳定性也非常不错。由于我司属于外包,在此无法展示项目,想看运行效果的可私我。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、准备工作
  • 二、新增小程序
  • 三、新增合作应用
  • 四、创建工程
  • 五、将小程序提交到云端
  • 六、进行APP相关配置
    • (1)基础配置
      • (2)图标配置
        • (3)启动闪屏配置
          • (4)URL Scheme配置
            • (5)权限配置
              • (6)第三方SDK配置
              • 七、准备证书
              • 八、生成APP
              相关产品与服务
              云开发 CloudBase
              云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
              领券
              问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档