用Vue仿了一个类似抖音的App

news2024/10/6 6:52:25

大家好,我是 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/#/

大家的点赞、收藏和评论都是对作者的支持,如文章对你有帮助还请点赞转发支持下,谢谢!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1566563.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

解决uCharts图表在微信小程序层级过高问题

uniapp微信小程图表层级过高问题? 项目中涉及 uCharts图表,在 App/H5端均正常使用,微信小程序 存在层级问题! 文章目录 uniapp微信小程图表层级过高问题?效果图遇到问题解决方案 啰嗦一下~,自己的粗心 在实…

Firefox 关键词高亮插件的简单实现

目录 1、配置 manifest.json 文件 2、编写侧边栏结构 3、查找关键词并高亮的方法 3-1) 如果直接使用 innerHTML 进行替换 4、清除关键词高亮 5、页面脚本代码 6、参考 1、配置 manifest.json 文件 {"manifest_version": 2,"name": &quo…

HDLbits 刷题 --Always nolatches

学习: Your circuit has one 16-bit input, and four outputs. Build this circuit that recognizes these four scancodes and asserts the correct output. To avoid creating latches, all outputs must be assigned a value in all possible conditions (See also always…

内存管理是如何影响系统的性能的

大家好,今天给大家介绍内存管理是如何影响系统的性能的,文章末尾附有分享大家一个资料包,差不多150多G。里面学习内容、面经、项目都比较新也比较全!可进群免费领取。 内存管理对系统性能的影响至关重要,主要体现在以下…

课程设计项目3.2:基于振动信号分析的电机轴承故障检测

01.课程设计内容 02.代码效果图 获取代码请关注MATLAB科研小白的个人公众号(即文章下方二维码),并回复:MATLAB课程设计本公众号致力于解决找代码难,写代码怵。各位有什么急需的代码,欢迎后台留言~不定时更新…

Js之运算符与表达式——②

运算符:也叫操作符,是一种符号。通过运算符可以对一个或多个值进行运算,并获取运算结果。 表达式:由数字、运算符、变量的组合(组成的式子)。 表达式最终都会有一个运算结果,我们将这个结果称…

【cache】卡常

来源于《国家集训队2024论文集》中的《论现代硬件上的常数优化》 个人总结: 不要开二的次幂作为维度的数组,否则常数会变大【存疑】。总是保证内存访问连续性更高。比如 st表,把log维放在第二维,会导致内存访问距离最大为N*LOG。…

权限提升技术:攻防实战与技巧

本次活动赠书1本,包邮到家。参与方式:点赞收藏文章即可。获奖者将以私信方式告知。 网络安全已经成为当今社会非常重要的话题,尤其是近几年来,我们目睹了越来越多的网络攻击事件,例如公民个人信息泄露,企业…

Vulnhub:MY FILE SERVER: 1

目录 信息收集 1、arp 2、nmap 3、whatweb WEB web信息收集 dirmap FTP匿名登录 enum4linux smbclient showmount FTP登录 ssh-kegen ssh登录 提权 系统信息收集 脏牛提权 get root 信息收集 1、arp ┌──(root㉿ru)-[~/kali/vulnhub] └─# arp-scan -l I…

信息咨询模块

信息资讯 资讯文章专题、互动评论、自定义多级分类,打造本地新闻圈 简介 本项目旨在打造一个本地新闻资讯平台,为用户提供以下功能: 资讯文章:提供本地新闻、生活、娱乐等各类资讯文章。专题:针对重要事件或热门话…

E4438C安捷伦E4438C信号发生器

181/2461/8938产品概述: Agilent / HP E4438C ESG 矢量信号发生器结合了出色的 RF 性能和复杂的基带生成功能,可在高达 6 GHz 的基带、IF 和 RF 频率上提供经过校准的测试信号。Agilent / HP E4438C ESG 矢量信号发生器提供具有任意波形和实时 I/Q 功能…

波士顿房价预测案例(python scikit-learn)---多元线性回归(多角度实验分析)

波士顿房价预测案例(python scikit-learn)—多元线性回归(多角度实验分析) 这次实验,我们主要从以下几个方面介绍: 一、相关框架介绍 二、数据集介绍 三、实验结果-优化算法对比实验,数据标准化对比实验&#xff0…

输入url到页面显示过程的优化

浏览器架构 线程:操作系统能够进行运算调度的最小单位。 进程:操作系统最核心的就是进程,他是操作系统进行资源分配和调度的基本单位。 一个进程就是一个程序的运行实例。启动一个程序的时候,操作系统会为该程序创建一块内存&a…

​AI大模型:产品经理的新助手,还是捣蛋鬼?

在科技飞速发展的今天,AI大模型成为了许多行业的“新宠儿”。它们不仅在语音识别、图像处理等方面表现出色,甚至还能写代码、写新闻,甚至写需求文档。这让许多产品经理心动不已,心想:有了AI大模型的帮助,岂…

完全没想到docker启动败在了这里!

转载说明:如果您喜欢这篇文章并打算转载它,请私信作者取得授权。感谢您喜爱本文,请文明转载,谢谢。 故事背景 前几天帮同事部署一个环境,用他写的安装脚本部署,其中一台服务器就需要安装docker&#xff0c…

Day43 动态规划 part05

Day43 动态规划 part05 1049.最后一块石头的重量II 我的思路: 提示说和划分两个和相等的子集差不多,猛然想到,这道题不就是划分子集,用sum - 和最大*2 代码就是划分和相同的子集的变形 解答: class Solution {public int last…

jsp实现增删改查——(三)用Echarts图表统计学生信息

学生信息CRUD——Echarts显示生活费 目录结构 创建一个js文件夹,将echarts.min.js放到里面。 功能实现 与之前我们写的jsp文件(含有html代码、Java代码)不同的是,实现Echarts对生活费的显示,需要调用echarts.min.js…

MySQL事务以及并发访问隔离级别

MySQL事务以及并发问题 事务1.什么是事务2.MySQL如何开启事务3.事务提交方式4.事务原理5.事务的四大特性(ACID) 事务并发问题1.并发引起的三个问题2.事务隔离级别 事务 在 MySQL 中,事务支持是在引擎层实现的。MySQL 是一个支持多引擎的系统&…

关于搭建电商独立站跨境电商接入主流电商平台API商品接口对于商品功能模块的巨大应用

功能设计 首先我们来看下mall项目中商品功能的设计,主要包括商品管理、添加\编辑商品、商品分类、商品类型、品牌管理等功能,这里的功能同时涉及前台商城和后台管理系统。 商品管理【接入主流电商平台商品API接口丰富自建商城商品】 在mall项目的后台管…

微信批量群发软件有哪款比较好用的?

微信有自带的群发助手,只能群发200个好友,比较有局限性。 我是做销售的,对于群发的需求特别大,我自己平时经常用WeB微信批量群发软件有哪款比较好用的?WeB,它满足了我的群发需求,用起来特别方便…