From a08900bfd84ad1df537c1a75c97ab7e64b2e3097 Mon Sep 17 00:00:00 2001 From: zyronon Date: Tue, 7 May 2024 10:21:23 +0800 Subject: [PATCH] docs: update README.md --- README.de.md | 128 --------------------------------------------- README.en.md | 128 --------------------------------------------- README.es.md | 128 --------------------------------------------- README.fr.md | 129 ---------------------------------------------- README.ja.md | 128 --------------------------------------------- docs/README.de.md | 5 +- docs/README.en.md | 7 +-- docs/README.es.md | 19 +++---- docs/README.fr.md | 10 ++-- docs/README.ja.md | 17 +++--- docs/README2.md | 52 ------------------- 11 files changed, 32 insertions(+), 719 deletions(-) delete mode 100644 README.de.md delete mode 100644 README.en.md delete mode 100644 README.es.md delete mode 100644 README.fr.md delete mode 100644 README.ja.md delete mode 100644 docs/README2.md diff --git a/README.de.md b/README.de.md deleted file mode 100644 index 422db4b0..00000000 --- a/README.de.md +++ /dev/null @@ -1,128 +0,0 @@ -

- Douyin-Vue -

- -

- English | Spanish | German | -French | 简体中文 | 日本語 -

- -

- License - - -

- -`douyin-vue` 是一个模仿 `抖音|TikTok`mobiles Kurzvideoprojekt.`Vue`„Best Practices“ auf der mobilen Seite, vergleichbar mit Native`App`Seidiges und geschmeidiges Erlebnis. Habe das Neueste verwendet`Vue`Technologie-Stack, basierend auf[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)erreichen. Die Daten werden lokal im Projekt gespeichert[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)Die Bibliothek fängt die API ab und gibt lokale JSON-Daten zurück, um echte Backend-Anfragen zu simulieren. - -
- - - - - -
- -## Online-Zugang - -[//]: # "Gitee Pages: [https://zyronon.gitee.io/douyin/](https://zyronon.gitee.io/douyin/)(中国地区推荐访问这个地址) " - -[//]: # "注意:Gitee Pages现在无法更新,代码不是最新的。如果你能翻墙推荐访问下面地址 " - -Github-Seiten: - -[//]: # "Gitee pages: [https://dy.ttentau.top/](https://dy.ttentau.top/) (中国地区推荐访问这个地址) " - -[//]: # "Github pages: [https://zyronon.github.io/douyin/](https://zyronon.github.io/douyin/) " - -[//]: # "Netlify: [https://douyins.netlify.app/](https://douyins.netlify.app/)" - -[//]: # "Vercel: [https://douyins.vercel.app](https://douyins.vercel.app)" - -[//]: # "Android Apk: https://github.com/zyronon/douyin/releases" - -[//]: # "**注意**:`PC` 必须将浏览器切到手机模式,先按 `F12` 调出控制台,再按 `Ctrl+Shift+M`才能正常预览" - -[//]: # "**注意**:手机请用 [Via 浏览器](https://viayoo.com/zh-cn/) 或 Chrome 浏览器预览。其它浏览器可能会强制将视频全屏,导致无法正常显示" - -## Verknüpfung - -\[Imitation Douyin-Serie] 1:[200 Codezeilen zur Implementierung einer Karussellkomponente ähnlich Swiper.js](https://juejin.cn/post/7360512664317018146) -\[Imitation Douyin-Serie] 2:[Verwirklichen Sie den „unendlich gleitenden Video“-Effekt auf Douyin](https://juejin.cn/post/7361614921519054883) -\[Imitation Douyin-Serie] Drei:[Einführung in die Verwendung des Vue-Routings und das Hinzufügen von Übergangsanimationen](https://juejin.cn/post/7362528152777130025) -\[Imitation Douyin-Serie] Vier:[Bedingtes Routen-Caching von Vue, genau wie bei herkömmlichen Nachrichtenseiten](https://juejin.cn/post/7365334891473240101) -\[Imitation Douyin-Serie] Vier:[Github-Aktionen stellen Seiten bereit, synchronisieren mit Gitee, übersetzen README, packen Docker-Image](https://juejin.cn/post/7365757742381957161) - -## laufen - -Hinweis: Dieses Projekt ist nur für Studien- und Forschungszwecke geeignet, nicht für die kommerzielle Nutzung - -### Schnelle Bereitstellung in Vercel - -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/zyronon/douyin) - -### Auf Docker bereitstellen - -```bash -# pull Docker image -docker pull ghcr.io/zyronon/douyin-vue:latest - -# start container, nginx reverse proxy custom port, for example: docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -``` - -### lokale Entwicklung - -**Hinweis: Der Git-Befehl muss geklont werden, damit er ausgeführt werden kann. Das Herunterladen des ZIP-Pakets ist nicht möglich. Wenn die Klongeschwindigkeit zu langsam ist, wird empfohlen, die Gitee-Adresse zu verwenden** - -```bash -git clone https://gitee.com/zyronon/douyin.git (中国使用) - https://github.com/zyronon/douyin.git -cd douyin -npm install -npm run dev -``` - -Öffnen Sie Ihren Browser und besuchen Sie: - -**Hinweis: Sie müssen den Browser in den Mobilmodus schalten, indem Sie zuerst drücken`F12`Um die Konsole aufzurufen, drücken Sie`Ctrl+Shift+M`um eine normale Vorschau anzuzeigen** - -## Datenquellen - -Das Video stammt von folgenden Douyin-Prominenten - -- `我是香秀 🐂🍺`: -- `杨老虎 🐯(磕穿下巴掉牙版)`: -- `条子`: -- `达莎 Digi`: -- `小橙子`: -- `南恬`: -- `小霸宠牛排 🥩`: -- `奶茶妹 ◕🌱`: -- `我才是岚岚`: -- `周憬艺 ziran`: -- `刘思瑶 nice`: -- `彭十六 elf`: -- `李子柒`: - -Bild aus den öffentlichen Notizen von Xiaohongshu - -Bei den oben genannten Inhalten handelt es sich um alle öffentlichen Informationen im Internet - -## Funktionen und Vorschläge - -Das Projekt befindet sich derzeit in einem frühen Entwicklungsstadium und es werden kontinuierlich neue Funktionen hinzugefügt. Wenn Sie Funktionen oder Vorschläge für die Software haben, können Sie sich gerne an uns wenden.`Issues`aufgewachsen in -Wenn Ihnen die Designideen dieser Software auch gefallen, reichen Sie sie bitte ein`PR`, Vielen Dank für deine Unterstützung! - -## kontaktiere mich - -Sie können meine E-Mail kontaktierenzyronon@163.com - -> Teilen Sie meine anderen Open-Source-Projekte: -> -> _[**Wort eingeben**- Software zum Auswendiglernen von Vokabeln, die im Internet verwendet werden kann](https://github.com/zyronon/typing-word)_ -> _[**Webskripte**- Einige nützliche Grease Monkey-Skripte ~](https://github.com/zyronon/web-scripts)_ - -## Vereinbarung - -[GPL](LICENSE) diff --git a/README.en.md b/README.en.md deleted file mode 100644 index 8af26adf..00000000 --- a/README.en.md +++ /dev/null @@ -1,128 +0,0 @@ -

- Douyin-Vue -

- -

- English | Spanish | German | -French | 简体中文 | 日本語 -

- -

- License - - -

- -`douyin-vue`is a parody`抖音|TikTok`mobile short video project.`Vue`"Best practices" on the mobile side, comparable to native`App`Silky and smooth experience. Used the latest`Vue`technology stack, based on[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)accomplish. The data is saved locally in the project through[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)The library intercepts the API and returns local json data to simulate real backend requests. - -
- - - - - -
- -## Online access - -[//]: # "Gitee Pages: [https://zyronon.gitee.io/douyin/](https://zyronon.gitee.io/douyin/)(中国地区推荐访问这个地址) " - -[//]: # "注意:Gitee Pages现在无法更新,代码不是最新的。如果你能翻墙推荐访问下面地址 " - -Github Pages: - -[//]: # "Gitee pages: [https://dy.ttentau.top/](https://dy.ttentau.top/) (中国地区推荐访问这个地址) " - -[//]: # "Github pages: [https://zyronon.github.io/douyin/](https://zyronon.github.io/douyin/) " - -[//]: # "Netlify: [https://douyins.netlify.app/](https://douyins.netlify.app/)" - -[//]: # "Vercel: [https://douyins.vercel.app](https://douyins.vercel.app)" - -[//]: # "Android Apk: https://github.com/zyronon/douyin/releases" - -[//]: # "**注意**:`PC` 必须将浏览器切到手机模式,先按 `F12` 调出控制台,再按 `Ctrl+Shift+M`才能正常预览" - -[//]: # "**注意**:手机请用 [Via 浏览器](https://viayoo.com/zh-cn/) 或 Chrome 浏览器预览。其它浏览器可能会强制将视频全屏,导致无法正常显示" - -## Link - -\[Imitation Douyin Series] 1:[200 lines of code to implement a carousel component similar to Swiper.js](https://juejin.cn/post/7360512664317018146) -\[Imitation Douyin Series] 2:[Realize the "infinite sliding video" effect on Douyin](https://juejin.cn/post/7361614921519054883) -\[Imitation Douyin Series] Three:[Introduction to using Vue routing and adding transition animations](https://juejin.cn/post/7362528152777130025) -\[Imitation Douyin Series] Four:[Vue conditional route caching, just like traditional news sites](https://juejin.cn/post/7365334891473240101) -\[Imitation Douyin Series] Four:[Github Actions deploy Pages, synchronize to Gitee, translate README, package docker image](https://juejin.cn/post/7365757742381957161) - -## run - -Note: This project is only suitable for study and research, not for commercial use - -### Quickly deploy to Vercel - -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/zyronon/douyin) - -### Deploy to Docker - -```bash -# pull Docker image -docker pull ghcr.io/zyronon/douyin-vue:latest - -# start container, nginx reverse proxy custom port, for example: docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -``` - -### local development - -**Note: The git command must be cloned to run. Downloading the zip package cannot run. If the clone speed is too slow, it is recommended to use the gitee address** - -```bash -git clone https://gitee.com/zyronon/douyin.git (中国使用) - https://github.com/zyronon/douyin.git -cd douyin -npm install -npm run dev -``` - -Open your browser and visit: - -**注意:需要将浏览器切至手机模式,先按 `F12`To bring up the console, press`Ctrl+Shift+M`to preview normally** - -## Data Sources - -The video comes from the following Douyin celebrities - -- `我是香秀 🐂🍺`: -- `杨老虎 🐯(磕穿下巴掉牙版)`: -- `条子`: -- `达莎 Digi`: -- `小橙子`: -- `南恬`: -- `小霸宠牛排 🥩`: -- `奶茶妹 ◕🌱`: -- `我才是岚岚`: -- `周憬艺 ziran`: -- `刘思瑶 nice`: -- `彭十六 elf`: -- `李子柒`: - -Picture from Xiaohongshu public notes - -The above content is all public information on the Internet - -## Features and suggestions - -The project is currently in the early stages of development, and new features are being added continuously. If you have any features or suggestions for the software, please feel free to contact us.`Issues`raised in -If you also like the design ideas of this software, please submit it`PR`, thank you very much for your support! - -## contact me - -You can contact my emailzyronon@163.com - -> Share my other open source projects: -> -> _[**Typing Word**- Vocabulary memorization software that can be used on the web~](https://github.com/zyronon/typing-word)_ -> _[**Web Scripts**- Some useful Grease Monkey scripts~](https://github.com/zyronon/web-scripts)_ - -## agreement - -[GPL](LICENSE) diff --git a/README.es.md b/README.es.md deleted file mode 100644 index 2411710d..00000000 --- a/README.es.md +++ /dev/null @@ -1,128 +0,0 @@ -

- Douyin-Vue -

- -

- English | Spanish | German | -French | 简体中文 | 日本語 -

- -

- License - - -

- -`douyin-vue`es una parodia`抖音|TikTok` 的移动端短视频项目。`Vue`"Mejores prácticas" en el lado móvil, comparables a las nativas`App`Experiencia sedosa y suave. Usado lo último`Vue`pila de tecnología, basada en[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)lograr. Los datos se guardan localmente en el proyecto a través de[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)La biblioteca intercepta la API y devuelve datos json locales para simular solicitudes de backend reales. - -
- - - - - -
- -## Acceso en linea - -[//]: # "Gitee Pages: [https://zyronon.gitee.io/douyin/](https://zyronon.gitee.io/douyin/)(中国地区推荐访问这个地址) " - -[//]: # "注意:Gitee Pages现在无法更新,代码不是最新的。如果你能翻墙推荐访问下面地址 " - -Páginas de Github: - -[//]: # "Gitee pages: [https://dy.ttentau.top/](https://dy.ttentau.top/) (中国地区推荐访问这个地址) " - -[//]: # "Github pages: [https://zyronon.github.io/douyin/](https://zyronon.github.io/douyin/) " - -[//]: # "Netlify: [https://douyins.netlify.app/](https://douyins.netlify.app/)" - -[//]: # "Vercel: [https://douyins.vercel.app](https://douyins.vercel.app)" - -[//]: # "Android Apk: https://github.com/zyronon/douyin/releases" - -[//]: # "**注意**:`PC` 必须将浏览器切到手机模式,先按 `F12` 调出控制台,再按 `Ctrl+Shift+M`才能正常预览" - -[//]: # "**注意**:手机请用 [Via 浏览器](https://viayoo.com/zh-cn/) 或 Chrome 浏览器预览。其它浏览器可能会强制将视频全屏,导致无法正常显示" - -## Enlace - -\[Serie Imitación Douyin] 1:[200 líneas de código para implementar un componente carrusel similar a Swiper.js](https://juejin.cn/post/7360512664317018146) -\[Serie Imitación Douyin] 2:[Realice el efecto de "vídeo deslizante infinito" en Douyin](https://juejin.cn/post/7361614921519054883) -\[Serie Imitación Douyin] Tres:[Introducción al uso del enrutamiento de Vue y la adición de animaciones de transición](https://juejin.cn/post/7362528152777130025) -\[Serie Imitación Douyin] Cuatro:[Almacenamiento en caché de rutas condicionales de Vue, al igual que los sitios de noticias tradicionales](https://juejin.cn/post/7365334891473240101) -\[Serie Imitación Douyin] Cuatro:[Github Actions implementa páginas, sincroniza con Gitee, traduce README, empaqueta la imagen de la ventana acoplable](https://juejin.cn/post/7365757742381957161) - -## correr - -注意:本项目仅适用于学习和研究,不得用于商业使用 - -### Implemente rápidamente en Vercel - -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/zyronon/douyin) - -### Implementar en Docker - -```bash -# pull Docker image -docker pull ghcr.io/zyronon/douyin-vue:latest - -# start container, nginx reverse proxy custom port, for example: docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -``` - -### desarrollo local - -**Nota: El comando git debe clonarse para ejecutarse. No se puede ejecutar la descarga del paquete zip. Si la velocidad de clonación es demasiado lenta, se recomienda utilizar la dirección del albergue** - -```bash -git clone https://gitee.com/zyronon/douyin.git (中国使用) - https://github.com/zyronon/douyin.git -cd douyin -npm install -npm run dev -``` - -Abra su navegador y visite: - -**Nota: Debe cambiar el navegador al modo móvil, primero presione`F12`Para abrir la consola, presione`Ctrl+Shift+M`para obtener una vista previa normalmente** - -## Fuentes de datos - -El video proviene de las siguientes celebridades de Douyin. - -- `我是香秀 🐂🍺`: -- `杨老虎 🐯(磕穿下巴掉牙版)`: -- `条子`: -- `达莎 Digi`: -- `小橙子`: -- `南恬`: -- `小霸宠牛排 🥩`: -- `奶茶妹 ◕🌱`: -- `我才是岚岚`: -- `周憬艺 ziran`: -- `刘思瑶 nice`: -- `彭十六 elf`: -- `李子柒`: - -Imagen de las notas públicas de Xiaohongshu. - -El contenido anterior es toda información pública en Internet. - -## Funciones y sugerencias - -El proyecto se encuentra actualmente en las primeras etapas de desarrollo y continuamente se agregan nuevas funciones. Si tiene alguna característica o sugerencia para el software, no dude en contactarnos.`Issues`criado en -Si también le gustan las ideas de diseño de este software, envíelas.`PR`, ¡Muchas gracias por tu apoyo! - -## contáctame - -Puedes contactar a mi correozyronon@163.com - -> Comparta mis otros proyectos de código abierto: -> -> _[**Escribir palabra**- Software de memorización de vocabulario que se puede utilizar en la web ~](https://github.com/zyronon/typing-word)_ -> _[**Guiones web**- Algunos scripts útiles de Grease Monkey~](https://github.com/zyronon/web-scripts)_ - -## 许可协议 - -[GPL](LICENSE) diff --git a/README.fr.md b/README.fr.md deleted file mode 100644 index d4c4fe3e..00000000 --- a/README.fr.md +++ /dev/null @@ -1,129 +0,0 @@ -

- Douyin-Vue -

- -

- English | Spanish | German | -French | 简体中文 | 日本語 -

- -

- License - - -

- -`douyin-vue`est une parodie`抖音|TikTok`projet de courte vidéo mobile.`Vue`Des « bonnes pratiques » côté mobile, comparables au natif`App`Expérience soyeuse et douce. Utilisé le dernier`Vue`pile technologique, basée sur[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)accomplir. Les données sont enregistrées localement dans le projet via[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)La bibliothèque intercepte l'API et renvoie des données json locales pour simuler de véritables requêtes backend. - -
- - - - - -
- -## Accès en ligne - -[//]: # "Gitee Pages: [https://zyronon.gitee.io/douyin/](https://zyronon.gitee.io/douyin/)(中国地区推荐访问这个地址) " - -[//]: # "注意:Gitee Pages现在无法更新,代码不是最新的。如果你能翻墙推荐访问下面地址 " - -Pages GitHub : - -[//]: # "Gitee pages: [https://dy.ttentau.top/](https://dy.ttentau.top/) (中国地区推荐访问这个地址) " - -[//]: # "Github pages: [https://zyronon.github.io/douyin/](https://zyronon.github.io/douyin/) " - -[//]: # "Netlify: [https://douyins.netlify.app/](https://douyins.netlify.app/)" - -[//]: # "Vercel: [https://douyins.vercel.app](https://douyins.vercel.app)" - -[//]: # "Android Apk: https://github.com/zyronon/douyin/releases" - -[//]: # "**注意**:`PC` 必须将浏览器切到手机模式,先按 `F12` 调出控制台,再按 `Ctrl+Shift+M`才能正常预览" - -[//]: # "**注意**:手机请用 [Via 浏览器](https://viayoo.com/zh-cn/) 或 Chrome 浏览器预览。其它浏览器可能会强制将视频全屏,导致无法正常显示" - -## Lien - -\[Série Imitation Douyin] 1 :[200 lignes de code pour implémenter un composant carrousel similaire à Swiper.js](https://juejin.cn/post/7360512664317018146) -\[Série Imitation Douyin] 2 :[Réaliser l'effet "vidéo coulissante infinie" sur Douyin](https://juejin.cn/post/7361614921519054883) -\[Série Imitation Douyin] Trois :[Introduction à l'utilisation du routage Vue et à l'ajout d'animations de transition](https://juejin.cn/post/7362528152777130025) -\[Série Imitation Douyin] Quatre :[Mise en cache des routes conditionnelles Vue, tout comme les sites d'information traditionnels](https://juejin.cn/post/7365334891473240101) -\[Série Imitation Douyin] Quatre :[Les actions Github déploient des pages, synchronisent avec Gitee, traduisent README, emballent l'image Docker](https://juejin.cn/post/7365757742381957161) - -## courir - -Remarque : ce projet convient uniquement à l'étude et à la recherche, et non à un usage commercial. - -### Déployez rapidement sur Vercel - -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/zyronon/douyin) - -### Déployer sur Docker - -```bash -# pull Docker image -docker pull ghcr.io/zyronon/douyin-vue:latest - -# start container, nginx reverse proxy custom port, for example: docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -``` - -### développement local - -**Remarque : La commande git doit être clonée pour s'exécuter. Le téléchargement du package zip ne peut pas s'exécuter. Si la vitesse de clonage est trop lente, il est recommandé d'utiliser l'adresse du gîte** - -```bash -git clone https://gitee.com/zyronon/douyin.git (中国使用) - https://github.com/zyronon/douyin.git -cd douyin -npm install -npm run dev -``` - -Ouvrez votre navigateur et visitez : - -**Remarque : Vous devez passer le navigateur en mode mobile, appuyez d'abord sur`F12`Pour afficher la console, appuyez sur`Ctrl+Shift+M`pour prévisualiser normalement** - -## Les sources de données - -La vidéo provient des célébrités Douyin suivantes - -- `我是香秀 🐂🍺`: -- `杨老虎 🐯(磕穿下巴掉牙版)`: -- `条子`: -- `达莎 Digi`: -- `小橙子`: -- `南恬`: -- `小霸宠牛排 🥩`: -- `奶茶妹 ◕🌱`: -- `我才是岚岚`: -- `周憬艺 ziran`: -- `刘思瑶 nice`: -- `彭十六 elf`: -- `李子柒`: - -Photo tirée des notes publiques de Xiaohongshu - -Le contenu ci-dessus est toute l'information publique sur Internet - -## Fonctionnalités et suggestions - -Le projet en est actuellement aux premiers stades de développement et de nouvelles fonctionnalités sont ajoutées continuellement. Si vous avez des fonctionnalités ou des suggestions pour le logiciel, n'hésitez pas à nous contacter.`Issues`élevé dans -Si vous aimez également les idées de conception de ce logiciel, veuillez le soumettre`PR`, Merci beaucoup pour votre soutient! - -## Contactez moi - -Vous pouvez contacter mon emailzyronon@163.com - -> Partagez mes autres projets open source : -> -> _[**Typing Word -> **- Logiciel de mémorisation de vocabulaire utilisable sur le web~](https://github.com/zyronon/typing-word)_ -> _[**Scripts Web**- Quelques scripts Grease Monkey utiles ~](https://github.com/zyronon/web-scripts)_ - -## accord - -[GPL](LICENSE) diff --git a/README.ja.md b/README.ja.md deleted file mode 100644 index f9c3f32d..00000000 --- a/README.ja.md +++ /dev/null @@ -1,128 +0,0 @@ -

- Douyin-Vue -

- -

- English | Spanish | German | -French | 简体中文 | 日本語 -

- -

- License - - -

- -`douyin-vue`パロディです`抖音|TikTok`モバイルショートビデオプロジェクト。`Vue`ネイティブと同等のモバイル側の「ベスト プラクティス」`App`シルキーで滑らかな使い心地。最新のものを使用しました`Vue`テクノロジースタック、に基づく[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)成し遂げる。データはプロジェクト内でローカルに保存されます。[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)ライブラリは API をインターセプトし、ローカルの JSON データを返して、実際のバックエンド リクエストをシミュレートします。 - -
- - - - - -
- -## オンラインアクセス - -[//]: # "Gitee Pages: [https://zyronon.gitee.io/douyin/](https://zyronon.gitee.io/douyin/)(中国地区推荐访问这个地址) " - -[//]: # "注意:Gitee Pages现在无法更新,代码不是最新的。如果你能翻墙推荐访问下面地址 " - -Github ページ:[hっtps://dy。ってんたう。とp/](https://dy.ttentau.top/) - -[//]: # "Gitee pages: [https://dy.ttentau.top/](https://dy.ttentau.top/) (中国地区推荐访问这个地址) " - -[//]: # "Github pages: [https://zyronon.github.io/douyin/](https://zyronon.github.io/douyin/) " - -[//]: # "Netlify: [https://douyins.netlify.app/](https://douyins.netlify.app/)" - -[//]: # "Vercel: [https://douyins.vercel.app](https://douyins.vercel.app)" - -[//]: # "Android Apk: https://github.com/zyronon/douyin/releases" - -[//]: # "**注意**:`PC` 必须将浏览器切到手机模式,先按 `F12` 调出控制台,再按 `Ctrl+Shift+M`才能正常预览" - -[//]: # "**注意**:手机请用 [Via 浏览器](https://viayoo.com/zh-cn/) 或 Chrome 浏览器预览。其它浏览器可能会强制将视频全屏,导致无法正常显示" - -## リンク - -【模倣同音シリーズ】 1:[Swiper.js に似たカルーセル コンポーネントを実装するための 200 行のコード](https://juejin.cn/post/7360512664317018146) -【模倣同音シリーズ】2:[Douyinで「無限スライドビデオ」効果を実現](https://juejin.cn/post/7361614921519054883) -【模倣同音シリーズ】その3:[Vue ルーティングの使用とトランジション アニメーションの追加の概要](https://juejin.cn/post/7362528152777130025) -【模倣同音シリーズ】 4:[従来のニュースサイトと同様に、Vue の条件付きルート キャッシュ](https://juejin.cn/post/7365334891473240101) -【模倣同音シリーズ】 4:[Github Actions ページのデプロイ、Gitee への同期、README の翻訳、Docker イメージのパッケージ化](https://juejin.cn/post/7365757742381957161) - -## 走る - -注: このプロジェクトは研究と研究のみに適しており、商業利用には適していません。 - -### Vercel への迅速な導入 - -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/zyronon/douyin) - -### Dockerへのデプロイ - -```bash -# pull Docker image -docker pull ghcr.io/zyronon/douyin-vue:latest - -# start container, nginx reverse proxy custom port, for example: docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -docker run -d -p 80:80 ghcr.io/zyronon/douyin-vue:latest -``` - -### 地域開発 - -**注: git コマンドを実行するには、クローンを作成する必要があります。zip パッケージのダウンロードは実行できません。クローン速度が遅すぎる場合は、gitee アドレスを使用することをお勧めします。** - -```bash -git clone https://gitee.com/zyronon/douyin.git (中国使用) - https://github.com/zyronon/douyin.git -cd douyin -npm install -npm run dev -``` - -ブラウザを開いて、以下にアクセスしてください。[hっtp://127。0。0。1:3000](http://127.0.0.1:3000) - -**注: ブラウザをモバイル モードに切り替える必要があります。最初に を押します。`F12`コンソールを表示するには、 を押します。`Ctrl+Shift+M`通常にプレビューする** - -## データソース - -このビデオは以下のDouyinの有名人からのものです - -- `我是香秀 🐂🍺`:[hっtps://v。どうyいん。こm/いYらぱ2L/](https://v.douyin.com/iYRAPA2L/) -- `杨老虎 🐯(磕穿下巴掉牙版)`:[hっtps://v。どうyいん。こm/いYら56で/](https://v.douyin.com/iYRA56de/) -- `条子`:[hっtps://v。どうyいん。こm/いYらあqjr/](https://v.douyin.com/iYRAaqjr/) -- `达莎 Digi`:[hっtps://v。どうyいん。こm/いYら6rwT/](https://v.douyin.com/iYRA6rwT/) -- `小橙子`:[hっtps://v。どうyいん。こm/いYらぬdw/](https://v.douyin.com/iYRAnudw/) -- `南恬`:[hっtps://v。どうyいん。こm/いYらbKm3/](https://v.douyin.com/iYRAbKm3/) -- `小霸宠牛排 🥩`:[hっtps://v。どうyいん。こm/いYRそsVB/](https://v.douyin.com/iYRSosVB/) -- `奶茶妹 ◕🌱`:[hっtps://v。どうyいん。こm/いYらCKhP/](https://v.douyin.com/iYRACKhP/) -- `我才是岚岚`:[hっtps://v。どうyいん。こm/いYらQM1C/](https://v.douyin.com/iYRAQM1C/) -- `周憬艺 ziran`:[hっtps://v。どうyいん。こm/いYらQs4h/](https://v.douyin.com/iYRAQs4h/) -- `刘思瑶 nice`:[hっtps://v。どうyいん。こm/いYらあえRん/](https://v.douyin.com/iYRAaERn/) -- `彭十六 elf`:[hっtps://v。どうyいん。こm/いYらHrVG/](https://v.douyin.com/iYRAHrVG/) -- `李子柒`:[hっtps://v。どうyいん。こm/いYら5B88/](https://v.douyin.com/iYRA5B88/) - -小紅書公文書からの写真 - -上記内容は全てインターネット上の公開情報です - -## 特徴と提案 - -プロジェクトは現在開発の初期段階にあり、新しい機能が継続的に追加されています。ソフトウェアに関する機能や提案がありましたら、お気軽にお問い合わせください。`Issues`で育ちました -このソフトウェアのデザインアイデアも気に入っていただけましたら、ぜひ送信してください`PR`、 ご支援ありがとうございました! - -## 私に連絡して - -私のメールアドレスにご連絡いただけますzyろのん@163。こm - -> 私の他のオープンソース プロジェクトを共有してください: -> -> _[**単語を入力する**~Web上で使える単語暗記ソフト~](https://github.com/zyronon/typing-word)_ -> _[**ウェブスクリプト** - 一些好用的油猴脚本~](https://github.com/zyronon/web-scripts)_ - -## 合意 - -[GPL](LICENSE) diff --git a/docs/README.de.md b/docs/README.de.md index b6497516..eefd89fe 100644 --- a/docs/README.de.md +++ b/docs/README.de.md @@ -13,7 +13,7 @@

-`douyin-vue`ist eine Parodie`抖音|TikTok`mobiles Kurzvideoprojekt.`Vue`„Best Practices“ auf der mobilen Seite, vergleichbar mit Native`App`Seidiges und geschmeidiges Erlebnis. Habe das Neueste verwendet`Vue`Technologie-Stack, basierend auf[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)erreichen. Die Daten werden lokal im Projekt gespeichert[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)Die Bibliothek fängt die API ab und gibt lokale JSON-Daten zurück, um echte Backend-Anfragen zu simulieren. +`douyin-vue` 是一个模仿 `抖音|TikTok`mobiles Kurzvideoprojekt.`Vue`„Best Practices“ auf der mobilen Seite, vergleichbar mit Native`App`Seidiges und geschmeidiges Erlebnis. Habe das Neueste verwendet`Vue`Technologie-Stack, basierend auf[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)erreichen. Die Daten werden lokal im Projekt gespeichert[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)Die Bibliothek fängt die API ab und gibt lokale JSON-Daten zurück, um echte Backend-Anfragen zu simulieren.
@@ -50,7 +50,8 @@ Github-Seiten: \[Imitation Douyin-Serie] 1:[200 Codezeilen zur Implementierung einer Karussellkomponente ähnlich Swiper.js](https://juejin.cn/post/7360512664317018146) \[Imitation Douyin-Serie] 2:[Verwirklichen Sie den „unendlich gleitenden Video“-Effekt auf Douyin](https://juejin.cn/post/7361614921519054883) \[Imitation Douyin-Serie] Drei:[Einführung in die Verwendung des Vue-Routings und das Hinzufügen von Übergangsanimationen](https://juejin.cn/post/7362528152777130025) -\[Imitation Douyin-Serie] Vier:[Bedingtes Routen-Caching von Vue, genau wie bei herkömmlichen Nachrichtenseiten](https://juejin.cn/post/7365334891473240101)\[Imitation Douyin-Serie] Vier:[Github-Aktionen stellen Seiten bereit, synchronisieren mit Gitee, übersetzen README, packen Docker-Image](https://juejin.cn/post/7365757742381957161) +\[Imitation Douyin-Serie] Vier:[Bedingtes Routen-Caching von Vue, genau wie bei herkömmlichen Nachrichtenseiten](https://juejin.cn/post/7365334891473240101) +\[Imitation Douyin-Serie] Vier:[Github-Aktionen stellen Seiten bereit, synchronisieren mit Gitee, übersetzen README, packen Docker-Image](https://juejin.cn/post/7365757742381957161) ## laufen diff --git a/docs/README.en.md b/docs/README.en.md index 76c1ee42..28aa1f4e 100644 --- a/docs/README.en.md +++ b/docs/README.en.md @@ -47,10 +47,11 @@ Github Pages: ## Link -\[Imitation Douyin Series] 1:[200行代码实现类似Swiper.js的轮播组件](https://juejin.cn/post/7360512664317018146) +\[Imitation Douyin Series] 1:[200 lines of code to implement a carousel component similar to Swiper.js](https://juejin.cn/post/7360512664317018146) \[Imitation Douyin Series] 2:[Realize the "infinite sliding video" effect on Douyin](https://juejin.cn/post/7361614921519054883) \[Imitation Douyin Series] Three:[Introduction to using Vue routing and adding transition animations](https://juejin.cn/post/7362528152777130025) -\[Imitation Douyin Series] Four:[Vue conditional route caching, just like traditional news sites](https://juejin.cn/post/7365334891473240101)\[Imitation Douyin Series] Four:[Github Actions deploy Pages, synchronize to Gitee, translate README, package docker image](https://juejin.cn/post/7365757742381957161) +\[Imitation Douyin Series] Four:[Vue conditional route caching, just like traditional news sites](https://juejin.cn/post/7365334891473240101) +\[Imitation Douyin Series] Four:[Github Actions deploy Pages, synchronize to Gitee, translate README, package docker image](https://juejin.cn/post/7365757742381957161) ## run @@ -84,7 +85,7 @@ npm run dev Open your browser and visit: -**Note: You need to switch the browser to mobile mode, first press`F12`To bring up the console, press`Ctrl+Shift+M`to preview normally** +**注意:需要将浏览器切至手机模式,先按 `F12`To bring up the console, press`Ctrl+Shift+M`to preview normally** ## Data Sources diff --git a/docs/README.es.md b/docs/README.es.md index 73594a1d..b6e823dc 100644 --- a/docs/README.es.md +++ b/docs/README.es.md @@ -13,14 +13,14 @@

-`douyin-vue`es una parodia`抖音|TikTok`Proyecto de vídeo corto móvil.`Vue`"Mejores prácticas" en el lado móvil, comparables a las nativas`App`Experiencia sedosa y suave. Usado lo último`Vue`pila de tecnología, basada en[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)lograr. Los datos se guardan localmente en el proyecto a través de[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)La biblioteca intercepta la API y devuelve datos json locales para simular solicitudes de backend reales. +`douyin-vue`es una parodia`抖音|TikTok` 的移动端短视频项目。`Vue`"Mejores prácticas" en el lado móvil, comparables a las nativas`App`Experiencia sedosa y suave. Usado lo último`Vue`pila de tecnología, basada en[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)lograr. Los datos se guardan localmente en el proyecto a través de[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)La biblioteca intercepta la API y devuelve datos json locales para simular solicitudes de backend reales.
- - - - - + + + + +
## Acceso en linea @@ -50,11 +50,12 @@ Páginas de Github: \[Serie Imitación Douyin] 1:[200 líneas de código para implementar un componente carrusel similar a Swiper.js](https://juejin.cn/post/7360512664317018146) \[Serie Imitación Douyin] 2:[Realice el efecto de "vídeo deslizante infinito" en Douyin](https://juejin.cn/post/7361614921519054883) \[Serie Imitación Douyin] Tres:[Introducción al uso del enrutamiento de Vue y la adición de animaciones de transición](https://juejin.cn/post/7362528152777130025) -\[Serie Imitación Douyin] Cuatro:[Almacenamiento en caché de rutas condicionales de Vue, al igual que los sitios de noticias tradicionales](https://juejin.cn/post/7365334891473240101)\[Serie Imitación Douyin] Cuatro:[Github Actions implementa páginas, sincroniza con Gitee, traduce README, empaqueta la imagen de la ventana acoplable](https://juejin.cn/post/7365757742381957161) +\[Serie Imitación Douyin] Cuatro:[Almacenamiento en caché de rutas condicionales de Vue, al igual que los sitios de noticias tradicionales](https://juejin.cn/post/7365334891473240101) +\[Serie Imitación Douyin] Cuatro:[Github Actions implementa páginas, sincroniza con Gitee, traduce README, empaqueta la imagen de la ventana acoplable](https://juejin.cn/post/7365757742381957161) ## correr -Nota: Este proyecto sólo es apto para estudio e investigación, no para uso comercial. +注意:本项目仅适用于学习和研究,不得用于商业使用 ### Implemente rápidamente en Vercel @@ -122,6 +123,6 @@ Puedes contactar a mi correozyronon@163.com > _[**Escribir palabra**- Software de memorización de vocabulario que se puede utilizar en la web ~](https://github.com/zyronon/typing-word)_ > _[**Guiones web**- Algunos scripts útiles de Grease Monkey~](https://github.com/zyronon/web-scripts)_ -## acuerdo +## 许可协议 [GPL](../LICENSE) diff --git a/docs/README.fr.md b/docs/README.fr.md index 45731f21..bae84195 100644 --- a/docs/README.fr.md +++ b/docs/README.fr.md @@ -4,7 +4,7 @@

English | Spanish | German | -French | 简体中文 | 日本語 +French | 简体中文 | 日本語

@@ -50,7 +50,8 @@ Pages GitHub : \[Série Imitation Douyin] 1 :[200 lignes de code pour implémenter un composant carrousel similaire à Swiper.js](https://juejin.cn/post/7360512664317018146) \[Série Imitation Douyin] 2 :[Réaliser l'effet "vidéo coulissante infinie" sur Douyin](https://juejin.cn/post/7361614921519054883) \[Série Imitation Douyin] Trois :[Introduction à l'utilisation du routage Vue et à l'ajout d'animations de transition](https://juejin.cn/post/7362528152777130025) -\[Série Imitation Douyin] Quatre :[Mise en cache des routes conditionnelles Vue, tout comme les sites d'information traditionnels](https://juejin.cn/post/7365334891473240101)\[Série Imitation Douyin] Quatre :[Les actions Github déploient des pages, synchronisent avec Gitee, traduisent README, emballent l'image Docker](https://juejin.cn/post/7365757742381957161) +\[Série Imitation Douyin] Quatre :[Mise en cache des routes conditionnelles Vue, tout comme les sites d'information traditionnels](https://juejin.cn/post/7365334891473240101) +\[Série Imitation Douyin] Quatre :[Les actions Github déploient des pages, synchronisent avec Gitee, traduisent README, emballent l'image Docker](https://juejin.cn/post/7365757742381957161) ## courir @@ -113,13 +114,14 @@ Le contenu ci-dessus est toute l'information publique sur Internet Le projet en est actuellement aux premiers stades de développement et de nouvelles fonctionnalités sont ajoutées continuellement. Si vous avez des fonctionnalités ou des suggestions pour le logiciel, n'hésitez pas à nous contacter.`Issues`élevé dans Si vous aimez également les idées de conception de ce logiciel, veuillez le soumettre`PR`, Merci beaucoup pour votre soutient! -## 联系我 +## Contactez moi Vous pouvez contacter mon emailzyronon@163.com > Partagez mes autres projets open source : > -> _[**Taper un mot**- Logiciel de mémorisation de vocabulaire utilisable sur le web~](https://github.com/zyronon/typing-word)_ +> _[**Typing Word +> **- Logiciel de mémorisation de vocabulaire utilisable sur le web~](https://github.com/zyronon/typing-word)_ > _[**Scripts Web**- Quelques scripts Grease Monkey utiles ~](https://github.com/zyronon/web-scripts)_ ## accord diff --git a/docs/README.ja.md b/docs/README.ja.md index aa168f41..1722a336 100644 --- a/docs/README.ja.md +++ b/docs/README.ja.md @@ -4,7 +4,7 @@

English | Spanish | German | -French | 简体中文 | 日本語 +French | 简体中文 | 日本語

@@ -16,11 +16,11 @@ `douyin-vue`パロディです`抖音|TikTok`モバイルショートビデオプロジェクト。`Vue`ネイティブと同等のモバイル側の「ベスト プラクティス」`App`シルキーで滑らかな使い心地。最新のものを使用しました`Vue`テクノロジースタック、に基づく[`Vue3`](https://cn.vuejs.org/)、[`Vite5`](https://cn.vitejs.dev/)、[`Pinia`](https://pinia.vuejs.org/)成し遂げる。データはプロジェクト内でローカルに保存されます。[`axios-mock-adapter`](https://github.com/ctimmerm/axios-mock-adapter)ライブラリは API をインターセプトし、ローカルの JSON データを返して、実際のバックエンド リクエストをシミュレートします。

- - - - - + + + + +
## オンラインアクセス @@ -50,7 +50,8 @@ Github ページ:[hっtps://dy。ってんたう。とp/]( 【模倣同音シリーズ】 1:[Swiper.js に似たカルーセル コンポーネントを実装するための 200 行のコード](https://juejin.cn/post/7360512664317018146) 【模倣同音シリーズ】2:[Douyinで「無限スライドビデオ」効果を実現](https://juejin.cn/post/7361614921519054883) 【模倣同音シリーズ】その3:[Vue ルーティングの使用とトランジション アニメーションの追加の概要](https://juejin.cn/post/7362528152777130025) -【模仿抖音系列】四:[従来のニュースサイトと同様に、Vue の条件付きルート キャッシュ](https://juejin.cn/post/7365334891473240101)【模倣同音シリーズ】 4:[Github Actions ページのデプロイ、Gitee への同期、README の翻訳、Docker イメージのパッケージ化](https://juejin.cn/post/7365757742381957161) +【模倣同音シリーズ】 4:[従来のニュースサイトと同様に、Vue の条件付きルート キャッシュ](https://juejin.cn/post/7365334891473240101) +【模倣同音シリーズ】 4:[Github Actions ページのデプロイ、Gitee への同期、README の翻訳、Docker イメージのパッケージ化](https://juejin.cn/post/7365757742381957161) ## 走る @@ -120,7 +121,7 @@ npm run dev > 私の他のオープンソース プロジェクトを共有してください: > > _[**単語を入力する**~Web上で使える単語暗記ソフト~](https://github.com/zyronon/typing-word)_ -> _[**ウェブスクリプト**- いくつかの便利な Grease Monkey スクリプト~](https://github.com/zyronon/web-scripts)_ +> _[**ウェブスクリプト** - 一些好用的油猴脚本~](https://github.com/zyronon/web-scripts)_ ## 合意 diff --git a/docs/README2.md b/docs/README2.md deleted file mode 100644 index 88ac7ed0..00000000 --- a/docs/README2.md +++ /dev/null @@ -1,52 +0,0 @@ ---- -theme: cyanosis -highlight: vs2015 ---- - -# 前言 - ---- - -这是我的 [**模仿抖音**](https://juejin.cn/column/7357362143396118528) 系列文章的第四篇:这篇我们将实现页面缓存,就像我们访问传统新闻网站一样 -> 第一篇:[200行代码实现类似Swiper.js的轮播组件](https://juejin.cn/post/7360512664317018146) -> 第二篇:[实现抖音 “视频无限滑动“效果](https://juejin.cn/post/7361614921519054883) -> 第三篇:[Vue 路由使用介绍以及添加转场动画](https://juejin.cn/post/7362528152777130025) - -# 最终效果 - -在线预览:[dy.ttentau.top/](https://dy.ttentau.top/) - -Github地址:[https://github.com/zyronon/douyin](https://github.com/zyronon/douyin) - -路由定义源码:[routes.ts](https://github.com/zyronon/douyin/blob/master/src/router/index.ts) - -# 实现 - -## 原理 - -KeepAlive -组件介绍:[https://cn.vuejs.org/guide/built-ins/keep-alive.html](https://cn.vuejs.org/guide/built-ins/keep-alive.html) - -我们知道 `Vue` 内置的 `` 组件可以缓存组件,只需要像下面这样写就可以缓存所有组件了 - -```vue - - - - - - -``` - -可是,这样写所有组件都会被缓存,这显然不是我们希望看到的效果。 - -我们想要的效果是什么?就像 `jQuery` 时代的网站(例如:[`www.v2ex.com`](https://www.v2ex.com) -)一样,点击一个链接,前进到下一页,浏览完成之后,返回上一页,当前页面被丢弃。再次访问的话需要重新加载 -> 吐槽:找了一圈国内的知名网站,点击链接全是单独打开一个标签页,根本没有在当前页跳转的了! -> -> 有喜欢逛 v2ex 的朋友可以试试我开发的这个油猴脚本:[V2Next](https://greasyfork.org/zh-CN/scripts/458024) -> ,有UI美化、楼中楼、回复上下文、高赞回复、简洁模式、发送图片和表情 emoji、base64 解码等功能,现在每天都1800个 v 友在使用! - -大多数情况下,用户进入一个页面,这个页面会请求数据。用户浏览完毕退出页面。如果再次进入,页面就像新开的一样,重新开始请求数据,这是符合用户预期的 -而不是像现在这样,不管重新进入多少次,页面都是一开始进入的样子,这时用户可能会怀疑自己是否断网了?我们总不能在每次页面都写 `onActivated` -和 `onDeactivated` 方法吧! \ No newline at end of file