You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Zyronon
d178f9fb90
|
3 years ago | |
|---|---|---|
| public | 4 years ago | |
| src | 3 years ago | |
| .gitignore | 4 years ago | |
| LICENSE | 3 years ago | |
| README.md | 3 years ago | |
| index.html | 4 years ago | |
| package-lock.json | 3 years ago | |
| package.json | 3 years ago | |
| pnpm-lock.yaml | 3 years ago | |
| vite.config.js | 3 years ago | |
README.md
简体中文 | English
此代码仅供学习，请勿用于商业用途
简介
douyin 是一个模仿抖音的移动端短视频项目，它基于 vue 3, vite 2 实现。使用了最新的Vue全家桶技术栈，后台数据通过mock-js搭建。相信不管你是处于哪个段位的工程师，本项目都能帮助到你。
核心技术拆解（TODO）
- 手机端抓包
- 首页无限滚动
- me页面滚动逻辑
- 通话进入和挂起动画
欢迎提Bug,如有新的需求和想法，欢迎 issue 和 pr
预览
电脑端请用Chrome手机模式访问
手机请安卓Via浏览器预览。其他浏览器检测到页面内有视频会强制将视频全屏，并显示控制按钮，导致css和js都失效；后面可能考虑用app套个壳，至少在手机上能正常显示
功能点
| 页面 | 进度 |
|---|---|
| 首页 | 50% |
| -- 音乐 | ☑ |
| -- 抖音音乐榜 | ☑ |
| -- 搜索 | 50% |
| -- 直播 | 50% |
| 朋友 | 0% |
| 消息 | ☑ |
| -- 聊天 | ☑ |
| -- 各种通知 | ☑ |
| 我 | 90% |
| -- 求更新 | ☑ |
| -- 关注和粉丝 | ☑ |
| -- 编辑资料 | ☑ |
| -- 添加朋友 | ☑ |
| -- 我的音乐 | ☑ |
| -- 抖音商城 | 0 |
| -- 收藏视频\音乐 | ☑ |
| -- 右侧菜单子页面 | 10% |
| -- 设置 | ☑ |
| -- -- 具体设置页面 | 0% |
| 登录\注册 | ☑ |
运行
# 克隆项目到本地
git clone https://github.com/zyronon/douyin.git
# 进入项目目录
cd douyin
# 安装依赖
npm install
# 启动服务
npm run serve
# 访问
Chrome浏览器访问 http://localhost:8080
Chrome切换成移动端模式快捷键，先按F12调出控制台，再按Ctrl+Shift+M
问题反馈
移步Issues，欢迎提出问题和建议。
MIT许可协议
声明
本项目仅做技术交流和学习，请勿用于商业目的！
Copyright (c) 2021 zyronon