https://github.com/valentinmadiot/components-modern_ui
Composants UI React modernes et animés : cartes de tarification, profils, onglets, FAQ, chargement, texte animé, audio visuel, recherche, bouton flottant. Interface fluide, claire et responsive.
https://github.com/valentinmadiot/components-modern_ui
animated-components audio-visualizer css css-animations design faq floating-button frontend loading-screen range-slider react react-components responsive-ui scroll-to-top tabs ui ui-components user-interface vercel web-design
Last synced: 6 months ago
JSON representation
Composants UI React modernes et animés : cartes de tarification, profils, onglets, FAQ, chargement, texte animé, audio visuel, recherche, bouton flottant. Interface fluide, claire et responsive.
- Host: GitHub
- URL: https://github.com/valentinmadiot/components-modern_ui
- Owner: ValentinMadiot
- Created: 2025-06-03T08:12:21.000Z (7 months ago)
- Default Branch: master
- Last Pushed: 2025-06-26T11:24:21.000Z (7 months ago)
- Last Synced: 2025-06-26T11:43:35.822Z (7 months ago)
- Topics: animated-components, audio-visualizer, css, css-animations, design, faq, floating-button, frontend, loading-screen, range-slider, react, react-components, responsive-ui, scroll-to-top, tabs, ui, ui-components, user-interface, vercel, web-design
- Language: CSS
- Homepage: https://components-modern.vercel.app
- Size: 8.02 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
🎨 Composants UI Modernes
##
📌 Sommaire
🎨 [**Introduction**](#introduction)
🛠️ [**Technologies**](#technologies)
🎯 [**Fonctionnalités**](#fonctionnalités)
🚀 [**Installation**](#installation)
Ce projet regroupe une série de composants UI animés sous React, destinés à enrichir visuellement n’importe quelle application web.
Chaque composant est autonome, stylisé avec soin et pensé pour être modulaire, responsive et réutilisable facilement.
La collection comprend notamment :
- Un effet de texte
- Une section de carte de tarification
- Des cartes de profils esthétiques
- Un système d’onglets (Tabs)
- Une page de chargement animée
- Un menu déroulant animé
- Une barre de recherche animée
- Un décompte dynamique
- Un curseur de sélection animé
- Un bouton flottant avec menu radial
- Un bouton de retour en haut de page
- Un affichage graphique au rythme de la musique
- React 18 avec `create-react-app`
- CSS natif modulaire (1 fichier par composant)
- Hooks React : `useState`, `useEffect`, `useRef`
- Framer Motion pour les animations de menu ou reveal
- Remix Icons & React Icons
- Responsive Design
- Déployé avec [**Vercel**](https://components-modern.vercel.app)
- UI soignée avec animations fluides
- Composants full responsive
- Composants autonomes et réutilisables
- Animations CSS + JS + Framer Motion
- Visualisation de l’audio avec ``
- Prêts à l’emploi pour tout projet React
### ✅ Prérequis
- [Git](https://git-scm.com/) — Système de gestion de versions
- [Node.js](https://nodejs.org/fr) — Exécuteur local de scripts JavaScript
- [npm](https://www.npmjs.com/) — Gestionnaire de paquets JavaScript
- [Google Chrome](https://www.google.com/) — Navigateur moderne
- [Visual Studio Code](https://code.visualstudio.com/) — Éditeur de code
### 📥 Cloner le projet
```bash
git clone https://github.com/ValentinMadiot/components-modern_ui
cd components-modern_ui
```
### ▶️ Lancer le projet
#### Frontend
```bash
npm install
npm start
```
Frontend disponible sur : `http://localhost:3000`