Skip to content

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Latest commit

 

History

3 Commits

Folders and files

Repository files navigation

☀️ Application Météo React

Une application web simple et élégante, développée avec React et Tailwind CSS, qui permet aux utilisateurs de consulter la météo actuelle pour n'importe quelle ville dans le monde.

🌤️ Aperçu Visuel

🚀 Fonctionnalités

  • 🔎 Recherche par ville : Entrez le nom d'une ville pour obtenir ses données météorologiques.
  • ⏱️ Données en temps réel : Température actuelle, description du temps, températures minimales/maximales, et vitesse du vent.
  • 🌈 Icônes dynamiques : L'icône météo change automatiquement selon les conditions actuelles.
  • 📱 Design responsive : Interface adaptée à tous les écrans (mobile, tablette, bureau).
  • ⚠️ Gestion des erreurs : Messages clairs en cas d’erreur réseau ou de ville introuvable.

🛠️ Technologies Utilisées

🎨 Frontend

  • React.js – Bibliothèque JavaScript pour créer des interfaces dynamiques.
  • Tailwind CSS – Framework CSS utility-first pour un design rapide et réactif.
  • Axios – Pour effectuer les requêtes HTTP vers l’API météo.

🌐 API

  • Open-Meteo API – Fournit les données météo et géographiques en temps réel.

⚙️ Installation et Démarrage

Suivez ces étapes pour exécuter le projet localement 👇

1️⃣ Cloner le dépôt

git clone https://github.com/zakariaghrib/react-app-meteo
2️⃣ Accéder au dossier du projet
bash
Copier le code
cd react-app-meteo
3️⃣ Installer les dépendances
bash
Copier le code
npm install
4️⃣ Lancer le serveur de développement
bash
Copier le code
npm start
L’application sera accessible sur 👉 http://localhost:3000

📂 Structure du Projet
php
Copier le code
react-app-meteo/
├── public/
│   ├── index.html
│   └── ...
├── src/
│   ├── App.jsx          # Composant principal
│   ├── index.js         # Point d’entrée de l’application
│   ├── assets/          # Dossier pour les images et icônes
│   └── styles/          # Fichiers CSS personnalisés
├── package.json
└── README.md
💡 Pour un projet plus évolutif, vous pouvez séparer les composants (ex : SearchBar.jsx, WeatherCard.jsx) et les appels API dans un dossier services/.

🧩 Améliorations Futures
📍 Détection automatique de la localisation via GPS.

🎨 Thèmes jour/nuit selon l’heure locale.

🌍 Choix de la langue et des unités (°C/°F).

💾 Sauvegarde des dernières recherches dans le localStorage.

📜 Licence
Ce projet est distribué sous la licence MIT.
Vous êtes libre de le modifier et de le partager tant que la licence est conservée.

👨‍💻 Auteur
Développé avec ❤️ par [GHRIB ZAKARIA]
👉 https://github.com/zakariaghrib

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages