https://github.com/valentinmadiot/components-navigation_ui
Collection de 9 composants React de navigation : barres supérieure, inférieure et latérale. Designs modernes, responsive, code modulaire et réutilisable pour vos interfaces web.
https://github.com/valentinmadiot/components-navigation_ui
css frontend hooks html javascript mobile-navbar navbar navigation-component react react-component react-router responsive responsive-design sidebar topbar ui-components ux-ui vercel vite web-design
Last synced: 3 months ago
JSON representation
Collection de 9 composants React de navigation : barres supérieure, inférieure et latérale. Designs modernes, responsive, code modulaire et réutilisable pour vos interfaces web.
- Host: GitHub
- URL: https://github.com/valentinmadiot/components-navigation_ui
- Owner: ValentinMadiot
- Created: 2025-06-09T19:24:58.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-06-26T11:28:22.000Z (12 months ago)
- Last Synced: 2025-07-12T08:40:48.866Z (12 months ago)
- Topics: css, frontend, hooks, html, javascript, mobile-navbar, navbar, navigation-component, react, react-component, react-router, responsive, responsive-design, sidebar, topbar, ui-components, ux-ui, vercel, vite, web-design
- Language: CSS
- Homepage: https://components-navigation.vercel.app
- Size: 630 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
##
📌 Sommaire
🎨 [**Introduction**](#introduction)
🛠️ [**Technologies**](#technologies)
🎯 [**Fonctionnalités**](#fonctionnalités)
🚀 [**Installation**](#installation)
Ce projet React propose 9 barres de navigation modernes réparties en 3 catégories :
- Barre du Haut : Menu principal en haut de page
- Barre Latérale : Menu latéral fixe ou déroulant
- Barre du Bas : Navigation positionnée en bas pour mobile
Chaque composant est conçu pour être responsive, modulaire et facilement intégrable dans vos projets web (dashboard, app mobile, SaaS...).
- React 18 + Vite
- React Router DOM + React Icons
- CSS natif modulaire (1 fichier par composant)
- Hooks React : `useState`, `useEffect`, `useRef`
- Convention BEM : `navX__element`
- Déploiement sur [**Vercel**](https://components-navigation.vercel.app/)
- 9 composants de navigation répartis par type
- Design responsive (mobile & desktop)
- Menus déroulants, sous-menus, toggles dynamiques
- Transitions CSS fluides & comportement actif intelligent
- Comportements dynamiques (menus actifs, fermeture auto, etc.)
- Routage intégré avec bouton de retour
- Composants prêts à l’emploi pour tout type de layout
### ✅ 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-navigation_ui
cd components-navigation_ui
```
### ▶️ Lancer le projet
#### Frontend
```bash
npm install
npm run dev
```
Frontend disponible sur : `http://localhost:5173`