douyin/README.md
2024-04-02 13:56:34 +08:00

80 lines
3.7 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<h1 align="center">
Douyin
</h1>
<p align="center">
<a href="README.md">简体中文</a> | <a href="README-en-US.md">English</a>
</p>
`douyin` 是一个模仿抖音的移动端短视频项目,它基于 [`Vue`](https://cn.vuejs.org/)、[`Vite`](https://cn.vitejs.dev/) 实现。使用了最新的 `Vue` 全家桶技术栈,接口数据通过 [`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter) 模拟
## 在线访问
Vercel [http://dy.ttentau.top](http://dy.ttentau.top) (国内推荐访问这个)
Netlify[https://douyins.netlify.app](https://douyins.netlify.app) (需要翻墙)
**注意**`PC` 浏览器请用手机模式访问。先按 `F12` 调出控制台,再按 `Ctrl+Shift+M` 切换到手机模式
**注意**:手机请用 [Via 浏览器](https://viayoo.com/zh-cn/) 或者 Chrome 浏览器预览。其它浏览器会强制将视频全屏,导致样式失效
## 效果截图
<div>
<img width="150px" src='./public/docs/1.gif' />
<img width="150px" src='./public/docs/2.gif' />
<img width="150px" src='./public/docs/3.gif' />
<img width="150px" src='./public/docs/4.gif' />
<img width="150px" src='./public/docs/5.gif' />
<img width="150px" src='./public/docs/img-1.jpg' />
<img width="150px" src='./public/docs/img-2.jpg' />
<img width="150px" src='./public/docs/img-3.jpg' />
<img width="150px" src='./public/docs/img-4.jpg' />
<img width="150px" src='./public/docs/img-5.jpg' />
</div>
## 相关帖子
- 掘金https://juejin.cn/post/7352813352051687458
- V2EXhttps://www.v2ex.com/t/1028678#reply116
## 项目所展示的网红
- 我是香秀 🐂🍺: [https://v.douyin.com/iYRAPA2L/](https://v.douyin.com/iYRAPA2L/)
- 杨老虎 🐯(磕穿下巴掉牙版): [https://v.douyin.com/iYRA56de/](https://v.douyin.com/iYRA56de/)
- 条子: [https://v.douyin.com/iYRAaqjr/](https://v.douyin.com/iYRAaqjr/)
- 达莎 Digi[https://v.douyin.com/iYRA6rwT/](https://v.douyin.com/iYRA6rwT/)
- 小橙子: [https://v.douyin.com/iYRAnudw/](https://v.douyin.com/iYRAnudw/)
- 南恬: [https://v.douyin.com/iYRAbKm3/](https://v.douyin.com/iYRAbKm3/)
- 小霸宠牛排 🥩:[https://v.douyin.com/iYRSosVB/](https://v.douyin.com/iYRSosVB/)
- 奶茶妹 ◕🌱: [https://v.douyin.com/iYRACKhP/](https://v.douyin.com/iYRACKhP/)
- 我才是岚岚: [https://v.douyin.com/iYRAQM1C/](https://v.douyin.com/iYRAQM1C/)
- 周憬艺 ziran [https://v.douyin.com/iYRAQs4h/](https://v.douyin.com/iYRAQs4h/)
- 刘思瑶 nice [https://v.douyin.com/iYRAaERn/](https://v.douyin.com/iYRAaERn/)
- 彭十六 elf [https://v.douyin.com/iYRAHrVG/](https://v.douyin.com/iYRAHrVG/)
- 李子柒:[https://v.douyin.com/iYRA5B88/](https://v.douyin.com/iYRA5B88/)
## 运行项目
本项目是基于 `Vue` 开发的,需要 `node` 环境来运行。
1. 安装 `NodeJS`,参考[官方文档](https://nodejs.org/en/download)
2. 安装 `pnpm` 包管理工具,运行 `npm install -g pnpm` 来安装
3. 使用 `git clone https://github.com/zyronon/douyin.git` 下载项目到本地
4. 进入项目目录`cd douyin`,在项目根目录下,运行`pnpm install`来下载依赖。
5. 执行`pnpm dev`来启动项目,项目默认地址为[`http://localhost:3000`](http://localhost:3000)
6. 在浏览器中打开[`http://localhost:3000`](http://localhost:3000) 来访问项目。 `Chrome` 切换成手机模式快捷键,先按 `F12` 调出控制台,再按 `Ctrl+Shift+M`(设备仿真模拟)
## 功能与建议
目前项目处于开发初期,新功能正在持续添加中,如果你对软件有任何功能与建议,欢迎在 `Issues` 中提出
如果你也喜欢本软件的设计思想,欢迎提交 `PR`,非常感谢你对我们的支持!
## 联系我
您可以联系我的邮箱 <a href="mailto:zyronon@163.com">zyronon@163.com</a>
## 许可协议
[MIT](LICENSE)