这门课的名字听着挺大:用 uni-app 做一个抖音那样的短视频 App。但先说清楚它不是什么——它不是把你变成抖音,也不是三五天能"精通"的东西。如果你时间碎、只能每天挤半小时到一小时,那这篇导读就是帮你决定:先看哪几讲、哪几块可以缓一缓、遇到卡住的地方怎么办。
为什么偏偏是 uni-app
抖音这类 App 的核心体验是竖滑视频流、上下切换、评论弹层、个人主页。真要做成原生安卓或 iOS,你得分别学两套语言,对自学者来说门槛压在起跑线上。uni-app 的好处是写一套 Vue 代码,能编译到小程序、H5、App 多个端,你能很快在浏览器里看到自己写的东西跑起来。这种"改一行、刷新就能看到"的反馈,是慢速学习里最要紧的燃料。
但它也有代价:跨端框架在播放器、手势、性能这些地方会露出局限。这门课会带你把一个像样的短视频 App 搭出来,你得接受它是个"能跑通的练习作品",而不是商用品。想清这一点,学起来心里就不会拧巴。
先建立三个底子,再动手
别急着打开第一讲就敲代码。这门课会反复用到三样东西,缺一样都会卡:
- Vue 的基本写法——数据怎么绑定到页面、组件怎么拆、事件怎么传。不懂这个,看视频流那几讲会像看天书。
- 前端工程化的常识——项目怎么组织目录、依赖怎么装、接口请求怎么封装。这是从"写单页"到"写项目"的分水岭。
- 数据从哪来——课程里涉及数据库和接口部分。你至少要理解"前端请求 → 服务端返回 JSON → 页面渲染"这条链路,哪怕暂时不深究后端实现。
这三样的顺序别颠倒。Vue 没过关就去抠播放器组件,多半是浪费时间。如果你完全没有 Vue 基础,建议先花一两周补最小够用版:能写列表、能做点击跳转、能看懂生命周期,就够了。
这门课的节奏怎么走
按课程本身的组织往下走就行,但心里要有个轻重。前面讲环境搭建、项目结构、基础页面的部分,务必一讲一讲老实敲,不要跳——这些是后面所有内容的地基。到了视频流、评论、个人主页这类综合实战章节,可以允许自己"先跑通再理解":先让代码在模拟器或浏览器里动起来,看效果,再回头读每段为什么这么写。
每完成两三讲,停下来做一件小事:用自己的话把这几讲做了什么记下来,三五行就够。不是为了交作业,是为了几天后回来能快速接上。碎片化学习最大的敌人不是难,是遗忘和断线。
哪些能先放一放
数据库、后端接口、部署上线这些偏工程的部分,如果你是冲着"前端做出个 App"来的,第一遍可以看得浅一点,知道它在整个流程里处于什么位置就行。等你的页面能跑起来、确实需要真实数据了,再回来细看,那时候理解成本会低很多。另外纯讲解概念、没有动手环节的章节,也可以快进,遇到具体项目里再回查。
卡住的时候
一定会卡住。环境装不上、编译报错、组件不生效,这些是自学的日常,不是你笨。给两个笨办法:一是把报错原文抄下来去搜,二是把改动回退到上一个能跑的状态,一小步一小步改。项目最后的成品不必和课程一模一样,你哪怕只把自己的个人主页和一条视频流做顺,就已经攒下了能写进作品集的东西。
慢就慢吧。这门课真正的价值不是让你几天做完一个抖音,而是让你亲手走一遍"从一个空项目到能滑动的视频 App"的全过程。走完这一遍,你对前端项目的理解会和之前不一样。
锐亚教育 uni-app创建抖音短视频APP
课程推荐
《锐亚教育 uni-app创建抖音短视频APP》锐亚教育 uni-app创建抖音短视频APP【技能收获】学完可掌握: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





