用Vue仿了一個類似抖音的App

Java陈序员發表於2024-04-03

大家好,我是 Java陳序員

今天,給大家介紹一個基於 Vue3 實現的高仿抖音開源專案。

關注微信公眾號:【Java陳序員】,獲取開源專案分享、AI副業分享、超200本經典計算機電子書籍等。

專案介紹

douyin —— 一個基於 Vue、Vite 實現,模仿抖音的移動端短影片專案。

這個專案的作者原本是用來學習 Vue 練手的,經過不斷的最佳化更新,目前已經達到官方 App 的 80% 了。真乃我輩楷模!

專案地址:

https://github.com/zyronon/douyin

線上訪問:

https://dy.ttentau.top/home

如果是 PC 瀏覽器瀏覽訪問,請用手機模式。先按 F12 調出控制檯,再按 Ctrl + Shift + M 切換到手機模式。

專案截圖

PS:大家都知道影片中的網紅是誰嘛?

本地部署

環境準備: 該專案是基於 Vue 開發的,需要 Node 環境來執行。

1、安裝 NodeJS,參考官方文件

2、安裝 pnpm 包管理工具

npm install -g pnpm

3、拉取專案程式碼

git clone https://github.com/zyronon/douyin.git

4、進入專案根目錄並安裝依賴

cd douyin
pnpm install

5、啟動專案

pnpm run dev

6、瀏覽器訪問

http://localhost:3000

最後

推薦的開源專案已經收錄到 GitHub 專案,歡迎 Star

https://github.com/chenyl8848/great-open-source-project

或者訪問網站,進行線上瀏覽:

https://chencoding.top:8090/#/

大家的點贊、收藏和評論都是對作者的支援,如文章對你有幫助還請點贊轉發支援下,謝謝!

相關文章