102 lines
2.4 KiB
Markdown
102 lines
2.4 KiB
Markdown
<p align="center">
|
||
<img src="https://badgen.net/github/stars/ttentau/douyin" alt="Star">
|
||
<a href="https://github.com/vuejs/vue">
|
||
<img src="https://img.shields.io/badge/Vue-3-brightgreen.svg" alt="Vue">
|
||
</a>
|
||
<a href="https://cn.vitejs.dev">
|
||
<img src="https://img.shields.io/badge/vite-2-brightgreen.svg" alt="Vant-ui">
|
||
</a>
|
||
<a href="http://mockjs.com">
|
||
<img src="https://img.shields.io/badge/mockjs-brightgreen.svg" alt="easymock">
|
||
</a>
|
||
<a href="https://github.com/Geek-James/ddBuy/blob/master/LICENSE">
|
||
<img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="license">
|
||
</a>
|
||
</p>
|
||
|
||
简体中文 | [English](https://github.com/ttentau/douyin/vue3-vite/README.en.md)
|
||
|
||
# 此代码仅供学习，请勿用于商业用途
|
||
|
||
## 简介
|
||
|
||
**douyin** 是一个模仿抖音的移动端短视频项目，它基于 [vue 3](https://v3.cn.vuejs.org/),
|
||
[vite 2](https://cn.vitejs.dev/)
|
||
实现。使用了最新的Vue全家桶技术栈，后台数据通过[mock-js](http://mockjs.com)搭建。相信不管你是处于哪个段位的攻城狮，本项目都能帮助到你。
|
||
|
||
## 核心技术拆解
|
||
|
||
- 手机端抓包
|
||
- 首页无限滚动
|
||
- me页面滚动逻辑
|
||
- 通话进入和挂起动画
|
||
|
||
欢迎提Bug,如有新的需求和想法，欢迎 issue 和 pr
|
||
|
||
## 预览图
|
||
|
||
[在线预览地址1](放个gitee的地址，快得多)
|
||
[在线预览地址2](http://douyin.ttentau.top)
|
||
|
||
## 功能点
|
||
|
||
页面|进度
|
||
---|---
|
||
首页|50%
|
||
-- 音乐|☑
|
||
-- 抖音音乐榜|☑
|
||
-- 搜索|50%
|
||
-- 直播|50%
|
||
朋友|0%
|
||
消息|☑
|
||
-- 聊天|☑
|
||
-- 各种通知|☑
|
||
我|90%
|
||
-- 求更新|☑
|
||
-- 关注和粉丝|☑
|
||
-- 编辑资料|☑
|
||
-- 添加朋友|☑
|
||
-- 我的音乐|☑
|
||
-- 抖音商城|0
|
||
-- 收藏视频\音乐|☑
|
||
-- 右侧菜单子页面|10%
|
||
-- 设置|☑
|
||
-- -- 具体设置页面|0%
|
||
登录\注册|☑
|
||
|
||
## 运行
|
||
|
||
```bash
|
||
# 克隆项目到本地
|
||
git clone https://github.com/ttentau/douyin.git
|
||
|
||
# 进入项目目录
|
||
cd douyin
|
||
|
||
# 安装依赖
|
||
npm install
|
||
|
||
# 启动服务
|
||
npm run serve
|
||
|
||
# 访问
|
||
Chrome浏览器访问 http://localhost:8080
|
||
Chrome切换成移动端模式快捷键，先按F12调出控制台，再按Ctrl+Shift+M
|
||
|
||
```
|
||
|
||
## 问题反馈
|
||
|
||
移步Issues，欢迎提出问题和建议。
|
||
|
||
## MIT许可协议
|
||
|
||
[MIT](https://github.com/ttentau/douyin/blob/vue3-vite/LICENSE)
|
||
|
||
## 声明
|
||
|
||
本项目仅做技术交流和学习，请勿用于商业目的！
|
||
|
||
Copyright (c) 2021 ttentau
|
||
|