飞豹客 · 课能看,资料也能带走
飞豹客软考考证 会员免费

uni-app 制作抖音短视频多端APP 视频教程

如果你在找一门能真正把「做一个短视频类 App」从头走一遍的教程,这套 uni-app 课程值得先花几分钟判断一下是否适合自己。它不是那种讲完语法就结束的课,主线很明确:用 uni-app 写一套代码,打包成能跑在多个端的应用,功能形态对标抖音这类短视频产品。 它解决的是什么工作场景 实际工作中,会

单课价¥29.90新品 上架
会员价 会员免费开通会员后本篇可直接下载套餐详情
11 人关注 更新于 2026-09-15 永久有效
发货

网盘链接 · 支付成功后自动发货

保障

永久有效 · 链接失效免费补发

客服

每日 9:00-21:00 在线客服 联系客服

会员可免费下载本篇月会员可免费领取。

开通会员 ›
购买本课销量 0 · 永久有效
会员价 · 单课标价 ¥29.90

会员 · 按档位

永久免费可领
年免费可领
月免费可领

游客按标价购买,不享受上表折扣。

支付成功后自动发放网盘链接,链接失效可找客服免费补

正版保障 极速发货 售后无忧

如果你在找一门能真正把「做一个短视频类 App」从头走一遍的教程,这套 uni-app 课程值得先花几分钟判断一下是否适合自己。它不是那种讲完语法就结束的课,主线很明确:用 uni-app 写一套代码,打包成能跑在多个端的应用,功能形态对标抖音这类短视频产品。

它解决的是什么工作场景

实际工作中,会遇到这样一类需求:公司想快速做一个内容类 App,预算和人力都不足以分别养 iOS、Android 两个原生团队,于是选跨端方案。uni-app 就是这类场景里被用得比较多的选择——基于 Vue 语法,一套代码可以编译到 App、小程序、H5。这门课围绕的正是这个流程:从项目搭建、页面结构,到视频流列表、播放交互,再到数据从哪来、怎么存。

换句话说,它训练的是「一个人能独立把跨端短视频应用的骨架搭起来」这件事,而不是零散地教你几个 API。对想接私活、想在现有前端岗位上多一项交付能力的人来说,这个场景是真实存在的。

学完能独立做什么

按课程的组织方式,走完之后你应该能独立完成一个可运行的短视频 Demo:首页信息流、视频播放与切换、基础的用户交互,以及后端数据的读取与写入。课程里带到了 MySQL 相关的数据处理,意味着不只是做纯前端页面,还会碰到数据怎么存、怎么取这一层。

这一点比较关键。很多人学跨端只学到「会写页面」,一旦要接真实数据就卡住。这门课把数据这块纳进来,虽然深度有限,但足够让你理解一个完整应用的数据链路是怎么串起来的。做完之后拿它当作品集里的一个项目,是说得过去的。

资料适合什么基础

需要提前说明:这套教程对零基础并不算友好。它默认你已经知道 Vue 的基本写法,理解组件、生命周期、简单的前端工程化概念。如果你连 Vue 都没碰过,直接上手会很吃力,建议先把 Vue 基础补一遍再回来。

适合的人群大致是两类:一是已经会前端、想补上跨端和移动端项目经验的人;二是学过 Vue 但没做过完整项目、需要一个实战把知识串起来的人。如果你完全不写代码,只是想了解短视频产品怎么做,这门课的信息密度会让你觉得性价比不高。

怎么用这份资料

  • 按顺序走,不要跳。跨端项目的坑大多出现在环境配置和打包环节,跳着学容易在后面卡死。
  • 每完成两到三节,自己动手把当节代码重敲一遍,别只看。看会和写会是两回事。
  • 配套的章节笔记用于课后复盘,尤其适合面试前快速过一遍关键流程。
  • 学完后别停在照抄,试着改一改:换个列表布局、加一个功能,能改说明真懂了。

最后提醒一句:这类跨端教程的价值在于帮你跨过「从会语法到能交付」的那道坎,但跨端本身有它的边界,性能要求极高的场景仍然会用原生。把它当作一项能落地的实用技能来学,预期会比较稳。


image.webp 下载附件   保存到相册 2021-5-31 14:32 上传

课程推荐

《uni-app 制作抖音短视频多端APP 视频教程 价值198元》image.webp 下载附件   保存到相册 2021-5-31 14:32 上传【技能收获】学完可掌握:Vue / 前端工程化、MySQL / 数据库、短视频 / 自媒体运营。课程以实战为导向,覆盖从基础概念到完整项目落地的关键步骤,配套章节笔记便于课后复盘与面试前快速回顾。【学习建议】建议按目录顺序学习,先打基础再进入综合实战章节;每完成 2~3 节可结合笔记整理一份学习小结,最终尝试独立复现一套完整 Demo 写入个人作品集。【就业发展】可面向岗位:Linux 运维工程师、SRE、云计算工程师、DevOps 工程师。云原生与自动化运维仍是企业 IT 刚需方向,认证 + 实战项目组合能显著提升面试通过率,适合向中高级运维或架构岗进阶。 若你已有一定编程或运维基础,本课程可帮助你在现有技能栈上快速叠加热门方向能力,提升求职时的项目说服力与薪资谈判空间。

视频目录(151 节)

课程目录

*   课时2:1-0课程介绍.mp4

*   课时3:1-1创建一个uni-app项目.mp4

*   课时4:1-2目录结构介绍.mp4

*   课时5:1-3页面样式与布局.mp4

*   课时6:1-4配置文件pages.mp4

*   课时7:1-5uni-app的生命周期.mp4

*   课时8:2-1模板语法.mp4

*   课时9:2-2样式绑定.mp4

*   课时10:2-3事件绑定.mp4

*   课时11:2-4条件渲染.mp4

*   课时12:2-5列表渲染.mp4

*   课时13:2-6v-model的使用.mp4

*   课时14:2-7vue实例的生命周期.mp4

*   课时15:2-8计算属性,方法和监听.mp4

*   课时16:2-9父子组件传值.mp4

*   课时17:2-10组件参数校验.mp4

*   课时18:3-1uni-app基础组件讲解.mp4

*   课时19:3-2uni-APP表单组件讲解.mp4

*   课时20:3-3uni-app导航与页面传参.mp4

*   课时21:3-4媒体组件.mp4

*   课时22:4-1基础api讲解.mp4

*   课时23:4-2网络请求.mp4

*   课时24:4-3路由与页面跳转.mp4

*   课时25:4-4数据缓存.mp4

*   课时26:4-5媒体相关.mp4

*   课时27:4-6设备相关.mp4

*   课时28:4-7界面相关.mp4

*   课时29:4-8页面与窗体.mp4

*   课时30:4-9跨端兼容.mp4

*   课时31:4-10分享.mp4

*   课时32:4-11subNVue原生子窗体.mp4

*   课时33:5-1创建一个新的项目.mp4

*   课时34:5-2开发底部自定义tab栏.mp4

*   课时35:5-3uni-app中使用iconfont图标.mp4

*   课时36:5-4uni-app首页导航栏开发.mp4

*   课时37:5-5创建视频列表组件.mp4

*   课时38:5-6创建视频播放组件.mp4

*   课时39:5-7完善视频播放组件.mp4

*   课时40:5-8请求模拟的json数据.mp4

*   课时41:5-9完善json数据.mp4

*   课时42:5-10视频列表组件左侧信息栏开发.mp4

*   课时43:5-11视频列表组件右侧图标栏开发.mp4

*   课时44:5-12视频列表页面添加css动画.mp4

*   课时45:5-13视频列表页利用js添加特效.mp4

*   课时46:5-14添加滑动播放视频功能.mp4

*   课时47:5-15父组件调用子组件方法.mp4

*   课时48:5-16添加播放、暂停当前视频功能.mp4

*   课时49:5-17添加双击事件.mp4

*   课时50:5-18控制首个视频自动播放.mp4

*   课时51:5-19动态渲染视频信息.mp4

*   课时52:6-1创建城市页面.mp4

*   课时53:6-2完善城市页面布局.mp4

*   课时54:7-1创建城市选择页面.mp4

*   课时55:7-2城市列表组件开发.mp4

*   课时56:7-3热门城市部分开发.mp4

*   课时57:7-4切换城市页面城市列表部分开发.mp4

*   课时58:7-5切换城市页面字母表布局.mp4

*   课时59:7-6城市联动.mp4

*   课时60:7-7字母表滑动选择.mp4

*   课时61:7-8修改当前城市.mp4

*   课时62:8-1关注页面开发.mp4

*   课时63:8-2关注页面视频列表开发.mp4

*   课时64:8-3关注页面布局.mp4

*   课时65:8-4完善关注页面视频列表组件.mp4

*   课时66:8-5创建好友页面.mp4

*   课时67:8-6关注页面动态播放视频.mp4

*   课时68:8-7优化自动播放功能.mp4

*   课时69:9-1创建消息 页面.mp4

*   课时70:9-2消息页面布局.mp4

*   课时71:9-3利用列表渲染渲染消息页面.mp4

*   课时72:10-1创建个人页面.mp4

*   课时73:10-2开发个人信息组件.mp4

*   课时74:10-3个人信息组件布局.mp4

*   课时75:10-4完善个人页面信息部分.mp4

*   课时76:10-5创建个人页面视频列表组件.mp4

*   课时77:10-6实现切换视频列表功能.mp4

*   课时78:11-1创建编辑个人资料界面.mp4

*   课时79:11-2个人资料页面布局.mp4

*   课时80:11-3添加修改头像功能.mp4

*   课时81:11-4添加修改昵称功能.mp4

*   课时82:11-5完善修改昵称功能.mp4

*   课时83:11-6添加修改抖音号功能.mp4

*   课时84:11-7添加修改简介功能.mp4

*   课时85:11-8添加修改其他信息功能.mp4

*   课时86:12-0.解决一个学员发现的小bug.mp4

*   课时87:12-1创建视频播放界面.mp4

*   课时88:12-2创建用户界面.mp4

*   课时89:12-3创建评论界面.mp4

*   课时90:12-4评论界面布局.mp4

*   课时91:12-5项目发布上线.mp4

*   课时92:12-6app安卓打包.mp4

*   课时94:13-1介绍node.js.mp4

*   课时95:13-2环境搭建.mp4

*   课时96:13-3REPL环境基础指令.mp4

*   课时97:13-4node中的global.mp4

*   课时98:13-5模块化.mp4

*   课时99:13-6模块对象.mp4

*   课时100:13-7模块类型.mp4

*   课时101:13-8非路径加载机制.mp4

*   课时102:13-9核心模块.mp4

*   课时103:13-10Event模块.mp4

*   课时104:13-11Process模块.mp4

*   课时105:13-12Process标准输入输出流.mp4

*   课时106:13-13Buffer.mp4

*   课时107:13-14FileSystrm.mp4

*   课时108:13-15利用fs实现文件删除.mp4

*   课时109:13-16文件监听.mp4

*   课时110:13-17案例:自动构建项目工具.mp4

*   课时111:13-18npm的基本使用.mp4

*   课时112:13-19自定义模块发布.mp4

*   课时113:13-20使用node搭建服务器.mp4

*   课时114:13-21request对象.mp4

*   课时115:13-22response对象.mp4

*   课时116:13-23url模块.mp4

*   课时117:13-24使用fs模块读取页面内容.mp4

*   课时118:13-25querystring的使用.mp4

*   课时119:13-26网络传输协议-udp.mp4

*   课时120:13-27网络传输协议-tcp.mp4

*   课时121:13-28利用tcp实现文件传输.mp4

*   课时122:14-1koa框架介绍.mp4

*   课时123:14-2koa框架的api.mp4

*   课时124:14-3koa-static-cache.mp4

*   课时125:14-4koa-router.mp4

*   课时126:14-5koa-swig.mp4

*   课时127:14-6案例:todolist.mp4

*   课时128:14-8动态渲染.mp4

*   课时129:14-9利用静态文件添加样式(换肤功能).mp4

*   课时130:14-10表单提交数据.mp4

*   课时131:14-11修改与删除.mp4

*   课时132:14-12案例todolist客户端渲染数据库版.mp4

*   课时133:14-13接口.mp4

*   课时134:14-14添加css样式.mp4

*   课时135:14-15添加与删除.mp4

*   课时136:14-16数据持久化.mp4

*   课时137:14-17mysql数据库安装与使用.mp4

*   课时138:14-18数据库讲解.mp4

*   课时139:14-19MySQL2.mp4

*   课时140:14-20请求数据库中的数据).mp4

*   课时141:14-21sql语句占位符的使用.mp4

*   课时142:15-1搭建一个服务器.mp4

*   课时143:15-2创建一个数据库.mp4

*   课时144:12-0.解决一个学员发现的小bug.mp4

*   课时145:15-4编写video接口.mp4

*   课时146:15-5在数据库中添加一个表.mp4

*   课时147:15-6修改个人资料界面.mp4

*   课时148:15-8添加上传功能.mp4

*   课时149:15-9上传视频.mp4

*   课时150:16-1设置全局变量.mp4

*   课时151:16-2同步请求.mp4

*   课时152:16-3手机无法请求到服务器的解决办法.mp4

*   课时153:16-4本套课程开发工具的下载.mp4