Une application web développée avec React, TypeScript, Tailwind CSS et DaisyUI permettant d'explorer et visionner des vidéos d'archives classées par année.
Ainsi que du contenue en direct de la F 1.
Cette plateforme propose une navigation simple, responsive et rapide entre les différents contenus vidéos, avec un lecteur intégré.
Conçue pour offrir une expérience utilisateur fluide, même avec un grand nombre de vidéos, cette application permet de visualiser les contenus directement dans l'interface sans quitter la page.
-
🎞️ Affichage des vidéos
Chaque vidéo est listée dynamiquement et associée à une année spécifique. Les titres sont automatiquement formatés pour un rendu propre et lisible. -
🖥️ Lecteur intégré
Un système de prévisualisation permet de lancer une vidéo dans un lecteur intégré (iframe), sans redirection. -
🔁 Navigation fluide
Utilisation dereact-router-dompour basculer entre la page principale (accueil) et le lecteur vidéo sans rechargement complet de la page. -
📱 Design responsive
L'application est optimisée pour tous types d’écrans (mobile, tablette, desktop) grâce à Tailwind CSS et à des composants UI réactifs.
-
⚛️ React (Vite)
Framework JS moderne pour la création d’interfaces utilisateur performantes. -
🧠 TypeScript
Améliore la robustesse du code avec un typage statique clair et structuré. -
💨 Tailwind CSS
Framework CSS utilitaire pour concevoir des interfaces rapides et sur mesure. -
🎨 DaisyUI
Ajoute une bibliothèque de composants stylisés et adaptables à Tailwind. -
🌐 React Router DOM
Gestion des routes SPA pour une navigation instantanée entre les vues. -
🔁 Hooks React (useState, useLocation, useNavigate)
Pour la gestion des états, de la navigation et du passage de données entre composants.
Ce projet a pour but de centraliser et visualiser facilement une collection de vidéos, en proposant une interface minimaliste, moderne et intuitive.
Il est évolutif et suivra l'évolution en temps réel des évenements.