diff --git a/NOTE.md b/NOTE.md new file mode 100644 index 0000000..639491c --- /dev/null +++ b/NOTE.md @@ -0,0 +1,6 @@ +## 核心技术拆解(TODO) + +- 手机端抓包 +- 首页无限滚动 +- me页面滚动逻辑 +- 通话进入和挂起动画 \ No newline at end of file diff --git a/README-en-US.md b/README-en-US.md new file mode 100644 index 0000000..95ffeb1 --- /dev/null +++ b/README-en-US.md @@ -0,0 +1,75 @@ +### English | [简体中文](README.md) + +## Preview Demo + +### Notice:Please use Chrome phone mode to access the PC side + +### Notice:Preview your phone with Android Via browser. When other browsers detect a video on the page, they force the video to be in full screen and display the control button. As a result, both css and js are invalid + +[Online Demo](https://ttentau.github.io/ttentau/dy/) + +## Introduction + +**Douyin** is a mobile short video project imitating Tiktok,It is based on [vue 3](https://v3.cn.vuejs.org/), +[vite 2](https://cn.vitejs.dev/) +implementation。 +The latest Vue family bucket technology stack is used, and the background data is built through [mock-js](http://mockjs.com). I believe that no matter what level of engineer you are, this project can help you. + +## Function point + + Page | Progress +--------------|--------- + Home | 50% + -- Music | ☑ + -- 抖音音乐榜 | ☑ + -- Search | 50% + -- Live | 50% + Friend | 0% + Message | ☑ + -- Chat | ☑ + -- 各种通知 | ☑ + Me | 90% + -- 求更新 | ☑ + -- 关注和粉丝 | ☑ + -- 编辑资料 | ☑ + -- Add friend | ☑ + -- My music | ☑ + -- Shop | 0 + -- 收藏视频\音乐 | ☑ + -- 右侧菜单子页面 | 10% + -- Setting | ☑ + -- -- 具体设置页面 | 0% + Sign in\Sign up | ☑ + +## How to start + +```bash +# Clone the project to local +git clone https://github.com/zyronon/douyin.git + +# Enter the project directory +cd douyin + +# Install dependencies +npm install + +# Start the service +npm run serve + +# Visit +Chrome browser access http://localhost:8080 +Chrome switches to mobile mode by pressing F12 to bring up the console, then Ctrl+Shift+M + +``` + +## Contribution + +Feel free to contribute by opening issues with any questions, bug reports or feature requests. + +## Get in touch + +You can reach us at zyronon@163.com + +## License + +[MIT](LICENSE) diff --git a/README.md b/README.md index 566b657..9ed9389 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,12 @@ -
+### 简体中文 | [English](README-en-US.md) -简体中文 | [English](https://github.com/zyronon/douyin/vue3-vite/README.en.md) +## 预览 -# 此代码仅供学习,请勿用于商业用途 +### 注:电脑端请用Chrome手机模式访问 +### 注:手机请用安卓Via浏览器预览。其他浏览器检测到页面内有视频会强制将视频全屏,并显示控制按钮,导致css和js都失效 + +[在线预览DEMO](https://ttentau.github.io/ttentau/dy/) ## 简介 @@ -25,47 +14,31 @@ [vite 2](https://cn.vitejs.dev/) 实现。使用了最新的Vue全家桶技术栈,后台数据通过[mock-js](http://mockjs.com)搭建。相信不管你是处于哪个段位的工程师,本项目都能帮助到你。 -## 核心技术拆解(TODO) - -- 手机端抓包 -- 首页无限滚动 -- me页面滚动逻辑 -- 通话进入和挂起动画 - -欢迎提Bug,如有新的需求和想法,欢迎 issue 和 pr - -## 预览 -### 电脑端请用Chrome手机模式访问 -### 手机请安卓Via浏览器预览。其他浏览器检测到页面内有视频会强制将视频全屏,并显示控制按钮,导致css和js都失效;后面可能考虑用app套个壳,至少在手机上能正常显示 -[在线预览地址1](http://ttentau.top/dy/) -[在线预览地址2](http://ttentau.top/dy/) - - ## 功能点 -页面|进度 ----|--- -首页|50% --- 音乐|☑ --- 抖音音乐榜|☑ --- 搜索|50% --- 直播|50% -朋友|0% -消息|☑ --- 聊天|☑ --- 各种通知|☑ -我|90% --- 求更新|☑ --- 关注和粉丝|☑ --- 编辑资料|☑ --- 添加朋友|☑ --- 我的音乐|☑ --- 抖音商城|0 --- 收藏视频\音乐|☑ --- 右侧菜单子页面|10% --- 设置|☑ --- -- 具体设置页面|0% -登录\注册|☑ + 页面 | 进度 +--------------|--------- + 首页 | 50% + -- 音乐 | ☑ + -- 抖音音乐榜 | ☑ + -- 搜索 | 50% + -- 直播 | 50% + 朋友 | 0% + 消息 | ☑ + -- 聊天 | ☑ + -- 各种通知 | ☑ + 我 | 90% + -- 求更新 | ☑ + -- 关注和粉丝 | ☑ + -- 编辑资料 | ☑ + -- 添加朋友 | ☑ + -- 我的音乐 | ☑ + -- 抖音商城 | 0 + -- 收藏视频\音乐 | ☑ + -- 右侧菜单子页面 | 10% + -- 设置 | ☑ + -- -- 具体设置页面 | 0% + 登录\注册 | ☑ ## 运行 @@ -90,15 +63,12 @@ Chrome切换成移动端模式快捷键,先按F12调出控制台,再按Ctrl+ ## 问题反馈 -移步Issues,欢迎提出问题和建议。 +如果有任何问题、错误报告或功能请求,请随时提出Issues。 + +## 联系我 + +您可以联系我的邮箱 zyronon@163.com ## MIT许可协议 -[MIT](LICENSE) - -## 声明 - -本项目仅做技术交流和学习,请勿用于商业目的! - -Copyright (c) 2021 zyronon - +[MIT](LICENSE)