Ma première application Météo

async function searchWeather(term) {
    var response = await fetch(`https://api.weatherapi.com/v1/forecast.json?key=7d77b96c972b4d119a3151101212704&q=${term}&days=3`);
    if (response.ok && response.status !== 400) {
        let weatherData = await response.json();
        displayCurrent(weatherData.location, weatherData.current);
        displayForecast(weatherData.forecast.forecastday);
    }
}

document.getElementById('search').addEventListener('keyup', function (event) {
    searchWeather(event.target.value);
});

document.getElementById('searchBtn').addEventListener('click', function() {
    let searchTerm = document.getElementById('search').value;
    searchWeather(searchTerm);
});

fonction displayCurrent(emplacement, currentWeather) {
    si (météoactuelle) {
        let lastUpdatedDate = new Date(currentWeather.last_updated);
        laissez cardHTML = `
            <div>



<p>Cette fonction génère une carte affichant la température actuelle, les conditions météorologiques et des détails supplémentaires tels que la vitesse du vent et l'humidité. Il met à jour dynamiquement la page en insérant le HTML généré dans le DOM.</p>


<hr>

<ol>
<li>Affichage des prévisions sur 3 jours</li>
</ol>

<p>Ensuite, j'affiche les prévisions météo pour les trois prochains jours. Ceci est géré par la fonction displayForecast() :<br>
</p><pre class="brush:php;toolbar:false">fonction displayForecast(forecastData) {
    laissez prévisionHTML = '';
    pour (soit i = 1; i < ForecastData.length; i ) {
        prévisionHTML = `
            <div>



<p>Cette fonction parcourt les données de prévision et génère des cartes pour chacun des deux prochains jours, affichant les températures maximales et minimales, les conditions météorologiques et les icônes.</p>


<hr>

<p>Conclusion</p>

<p>Créer cette application météo a été un excellent exercice pour moi car j'ai appris à interagir avec les API, à traiter les données JSON et à mettre à jour dynamiquement une page Web. Le projet m'a aidé à consolider mes connaissances en JavaScript asynchrone, en manipulation DOM et en gestion d'événements.</p>

<p>Si vous débutez avec JavaScript et les API, cette application météo est un moyen simple mais puissant de mettre en pratique vos compétences. Vous pouvez étendre ce projet en ajoutant plus de fonctionnalités comme la gestion des erreurs, des prévisions plus détaillées ou même un mode sombre pour l'interface utilisateur.</p>


<hr>

<p>N'hésitez pas à essayer le code et à l'adapter à vos besoins. Faites-moi savoir si vous avez des questions ou des suggestions !</p>