{"id":22830798,"url":"https://github.com/clementmadiot/youtube-clone_react","last_synced_at":"2026-05-04T12:34:32.771Z","repository":{"id":249628252,"uuid":"832020527","full_name":"ClementMadiot/YouTube-clone_react","owner":"ClementMadiot","description":"Ce projet est un clone de YouTube reproduisant certaines de ses fonctionnalités clés. Développé avec React, TailwindCSS et MUI, il s'appuie sur RapidAPI et l'API YouTube v3 pour l'intégration des données. Il propose une barre de recherche fonctionnelle, un feed dynamique affichant les dernières vidéos, ainsi que des pages de chaînes présentant le n","archived":false,"fork":false,"pushed_at":"2025-01-31T20:06:31.000Z","size":1352,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-31T01:41:27.385Z","etag":null,"topics":["axios","mui-material","rapidapi","react","react-player","tailwindcss"],"latest_commit_sha":null,"homepage":"https://myyoutube-cm.netlify.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ClementMadiot.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-07-22T07:38:26.000Z","updated_at":"2025-02-26T11:20:15.000Z","dependencies_parsed_at":"2024-08-03T08:26:23.207Z","dependency_job_id":"7ac0de90-f181-459e-a8b2-8d4f5bc15e1f","html_url":"https://github.com/ClementMadiot/YouTube-clone_react","commit_stats":null,"previous_names":["clementmadiot/youtube-clone_react"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ClementMadiot/YouTube-clone_react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClementMadiot%2FYouTube-clone_react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClementMadiot%2FYouTube-clone_react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClementMadiot%2FYouTube-clone_react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClementMadiot%2FYouTube-clone_react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ClementMadiot","download_url":"https://codeload.github.com/ClementMadiot/YouTube-clone_react/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClementMadiot%2FYouTube-clone_react/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259400277,"owners_count":22851782,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["axios","mui-material","rapidapi","react","react-player","tailwindcss"],"created_at":"2024-12-12T20:14:52.586Z","updated_at":"2026-05-04T12:34:27.750Z","avatar_url":"https://github.com/ClementMadiot.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://myyoutube-cm.netlify.app/\" target=\"_blanck\"\u003e\u003cimg src=\"./src/assets/youtube-screen.png\" alt=\"Modern Youtube\"\u003e\u003c/a\u003e\n\u003cdiv align=\"center\"\u003e\n \u003cimg src=\"https://img.shields.io/badge/-React_JS-black?style=for-the-badge\u0026logoColor=white\u0026logo=react\u0026color=61DAFB\" alt=\"react.js\" /\u003e\n    \u003cimg src=\"https://img.shields.io/badge/-Vite-black?style=for-the-badge\u0026logoColor=white\u0026logo=vite\u0026color=646CFF\" alt=\"vite\" /\u003e\n    \u003cimg src=\"https://img.shields.io/badge/-Tailwind_CSS-black?style=for-the-badge\u0026logoColor=white\u0026logo=tailwindcss\u0026color=06B6D4\" alt=\"tailwindcss\" /\u003e\n\u003c/div\u003e\n  \u003ch3 align=\"center\"\u003eModern Youtube\u003c/h3\u003e\n\u003c/div\u003e\n\n## \u003cbr /\u003e 📋 \u003ca name=\"table\"\u003eSummary\u003c/a\u003e\n\n\n- ✨ [Introduction](#introduction)\n- 🛠 [Technology Used](#tech-stack)\n- 🚀 [Launch App](#launch-app)\n- 🎨 [Styling](#style)\n\n## \u003cbr /\u003e \u003ca name=\"introduction\"\u003e✨ Introduction\u003c/a\u003e\n\n[ENG] : This project is a YouTube clone, designed to replicate some of the popular platform's features. It was built using React, TailwindCSS and Material UI (MUI).\n\nData integration was achieved through RapidAPI and the YouTube v3 API\n\nThe site features a fully functional search bar, a dynamic feed displaying the latest videos, and channel pages showing subscriber counts and video collections.\n\n[FR] : Ce projet est un clone de YouTube, conçu pour répliquer certaines fonctionnalités de la célèbre plateforme. Il a été développé en utilisant React, TailwindCSS et Materialet UI (MUI).\n\nL'intégration des données a été réalisée grâce à RapidAPI et l'API YouTube v3\n\nLe site propose une barre de recherche fonctionnelle, un feed dynamique présentant les dernières vidéos, ainsi que des pages de chaînes affichant le nombre d'abonnés et les vidéos associées.\n\n## \u003cbr /\u003e \u003ca name=\"tech-stack\"\u003e🛠 Technology Used\u003c/a\u003e\n\n- [react-router-dom](https://www.npmjs.com/package/react-router-dom)\n  The react-router-dom package contains bindings for using React Router in web applications. Please see the Getting Started guide for more information on how to get started with React Router.\n\n- [react-player](https://www.npmjs.com/package/react-player)\nA React component for playing a variety of URLs, including file paths, YouTube, Facebook, Twitch, SoundCloud, Streamable, Vimeo, Wistia, Mixcloud, DailyMotion and Kaltura.\n\n- [RAPID_API](https://docs.rapidapi.com/docs/navigating-this-documentation)\nPlatform that provides access to thousands of APIs through a single unified platform. Allows developers to discover, connect, and manage APIs in one place, simplifying the process of integrating third-party APIs into applications.\n\n- [axios](https://www.npmjs.com/package/axios)\npopular JavaScript library used to make HTTP requests from the browser or Node.js, allows to send asynchronous HTTP requests to REST endpoints and perform CRUD operations\n\n- [mui/material](https://www.npmjs.com/package/@mui/material)\nMaterial UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.\n\n- [mui/icons-material](https://mui.com/material-ui/material-icons/)\n@mui/icons-material includes the 2,100+ official Material Icons converted to SvgIcon components. It depends on @mui/material, which requires Emotion packages.\n\n- [TailwindCSS](https://tailwindcss.com/docs/installation)\nCSS is a valuable tool for developers who want to build modern, responsive, and visually appealing websites without sacrificing development speed.\n\n## \u003cbr /\u003e \u003ca name=\"launch-app\"\u003e🚀 Launch App\u003c/a\u003e\n\n\u003cbr/\u003e**Cloning the Repository**\n\n```bash\ngit clone {git remote URL}\n```\n\n\u003cbr/\u003e**installation**\n\n\u003e After cloning the repository, run the command `npm install` to install the project's dependencies.\n\n\u003e Once the dependencies are installed, start the project with the command `npm run dev`.\n\n## \u003cbr /\u003e \u003ca name=\"style\"\u003e🎨 Styling\u003c/a\u003e\n\nGlobal styling are defined using @mui/material and TailwindCSS in the tailwind.config.js file.\n\n```\ntheme: {\n    extend: {\n      colors: {\n        primary: \"#0F0F0F\",\n        borderRight: \"#3d3d3d\",\n        red: \"#FC1503\",\n        cardContent: \"#1e1e1e\",\n        gray: \"#a0a0a0\",\n        lightBlack: 'hsl(0,0%,7%)'\n      },\n      screens: {\n        vsm: \"425px\",\n        xs: \"900px\",\n      },\n    },\n  },\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclementmadiot%2Fyoutube-clone_react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fclementmadiot%2Fyoutube-clone_react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclementmadiot%2Fyoutube-clone_react/lists"}