Skip to content
/ douyin Public
forked from zyronon/douyin

Vue3 + Pinia 仿抖音,Vue 在移动端的最佳实践 . Imitate TikTok ,Vue Best practices on Mobile

License

Notifications You must be signed in to change notification settings

G-Will/douyin

This branch is 34 commits behind zyronon/douyin:master.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

a08900b · May 7, 2024
May 3, 2024
Apr 4, 2024
May 7, 2024
Apr 19, 2024
Apr 20, 2024
Apr 30, 2024
May 7, 2024
May 1, 2024
Apr 5, 2024
Apr 5, 2024
Apr 2, 2024
Apr 20, 2024
May 1, 2024
Apr 5, 2024
Apr 30, 2024
May 7, 2024
Apr 5, 2024
Apr 26, 2024
Apr 5, 2024
Apr 3, 2024
May 1, 2024
May 1, 2024
Apr 26, 2024
Apr 5, 2024
Apr 5, 2024
Apr 3, 2024
May 7, 2024

Repository files navigation

Douyin-Vue

English | Spanish | German | French | 简体中文 | 日本語

License

douyin-vue 是一个模仿 抖音|TikTok 的移动端短视频项目。Vue 在移动端的"最佳实践",媲美原生 App 丝滑流畅的使用体验。使用了最新的 Vue 技术栈,基于 Vue3Vite5Pinia实现。数据保存在项目本地,通过 axios-mock-adapter 库拦截Api 并返回本地json数据,模拟真实后端请求

在线访问

Github Pages: https://dy.ttentau.top/

链接

【模仿抖音系列】一:200行代码实现类似Swiper.js的轮播组件
【模仿抖音系列】二:实现抖音 “视频无限滑动“效果
【模仿抖音系列】三:Vue 路由使用介绍以及添加转场动画
【模仿抖音系列】四:Vue 有条件路由缓存,就像传统新闻网站一样
【模仿抖音系列】四:Github Actions 部署 Pages、同步到 Gitee、翻译 README 、 打包 docker 镜像

运行

注意:本项目仅适用于学习和研究,不得用于商业使用

快速部署至 Vercel

Deploy with Vercel

部署到 Docker

# pull Docker image
docker pull ghcr.io/zyronon/douyin-vue:latest

# start container, nginx reverse proxy custom port, for example: docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest
docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest

本地开发

注意:必须 git 命令 clone 下来才能运行,下载 zip 包是无法运行的。如果 clone 速度太慢,推荐使用 gitee 地址

git clone https://gitee.com/zyronon/douyin.git (中国使用)
          https://github.com/zyronon/douyin.git 
cd douyin
npm install
npm run dev

打开浏览器并访问: http://127.0.0.1:3000

注意:需要将浏览器切至手机模式,先按 F12 调出控制台,再按 Ctrl+Shift+M 才能正常预览

数据来源

视频来源于以下抖音网红

图片来自于小红书公开笔记

以上内容均是互联网公开信息

功能与建议

目前项目处于开发初期,新功能正在持续添加中,如果你对软件有任何功能与建议,欢迎在 Issues 中提出 如果你也喜欢本软件的设计思想,欢迎提交 PR,非常感谢你对我们的支持!

联系我

您可以联系我的邮箱 [email protected]

分享我其他开源项目:

**Typing Word ** - 可在网页上使用的背单词软件~
**Web Scripts ** - 一些好用的油猴脚本~

许可协议

GPL

About

Vue3 + Pinia 仿抖音,Vue 在移动端的最佳实践 . Imitate TikTok ,Vue Best practices on Mobile

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 82.2%
  • JavaScript 10.0%
  • TypeScript 5.2%
  • Less 2.1%
  • CSS 0.3%
  • HTML 0.1%
  • Other 0.1%