欢迎进入vue技术实战篇

Posted 2021-05-07 enjsky.G

vue.js项目实战运用篇之抖音视频APP-持续更新中

• 前序（发表文章的初衷）
• • 项目仓库
  • 项目介绍
  • 技术介绍
  • • 前端部分
    • 后端部分
  • 项目目录
  • 异常问题汇总（持续更新）
  • Git项目管理汇总（持续更新）
  • 结语

前序（发表文章的初衷）

发表此文章的初衷，在于以更全面的知识的巩固及知识的实际运用。在此之前，所遇知识技术交流文章大多都过于片面，只是局部内容的叙述，对于刚接触又对vue感兴趣的小伙伴们来说，这将带来很多困扰。现利用空余时间，进行vue相关知识及应用进行整理。本文章主要是对vue项目从无到有大奖项目进行细致讲解及基础知识的运用，并结合后端数据处理一同展开本次项目。在开发中对技术的不断学习及错误纠正的过程。欢迎小伙伴们加入一起学习。

项目仓库

项目采用Git进行管理，最终项目将会发布到GitHub中，感兴趣的小伙伴们可以一起学习，共同完善本项目。
项目地址：GitHub

项目介绍

此项目分为两部分，第一部分为前端功能的实现及展示；第二部分为后端，主要进行数据处理及返回。
前端部分采用vue.js作为本次项目的技术栈，使用 .Net Core 框架作为后端部分的框架。将以vue脚手架搭建环境、架构设计、数据处理、代码编写、编译打包五个阶段进行本次项目的开发，进而了解前端、后端开发的全过程。本项目将致力于提高代码编写的质量及规范性。欢迎小伙伴们一起来了解项目开发的全过程，提升代码编写质量。

技术介绍

前端部分

1. vue 2.x：构建基础页面的MVVM框架
2. vue-router： 路由管理
3. vuex：状态管理库，做全局数据状态共享
4. vant：vue移动端UI组件库
5. axios：处理网络请求
6. webpack：项目打包
7. Eslint：代码规范检测工具

后端部分

1. .Net Core： 项目基础框架
2. Orm：数据库处理框架
3. WebApi：数据返回接口

项目目录

1. 项目环境搭建
2. 项目基础架构搭建
3. 底部导航栏组件功能
4. 顶部导航栏组件功能
5. 视频播放列表组件功能
6. 首页视频详情功能
7. 视频评论及分享功能
8. 视频播放功能（自动播放、播放、暂停）
9. 视频上滑下拉播放功能
10. 评论列表功能
11. 注册登录功能
12. 登录权限及验证码功能
13. 弹出框组件（自定义）
14. 用户信息页面功能
15. Header组件功能
16. 消息页面功能
17. 朋友页面功能
18. 发布获取手机相机权限功能
19. 项目总结

异常问题汇总（持续更新）

Git项目管理汇总（持续更新）

1. Git基础知识
2. 远程连接GitHub

结语

到此，本项目就初步介绍完成，将根据以上规划持续更新。已完成模块将会附上链接，点击目录链接即可学习参考相关内容。欢迎小伙伴们一同参与本次项目，如有疑问留言本人将同小伙伴们共同解决。

---

下一篇： 项目环境搭建