Hava Durumu API Entegrasyonu: Web Siteniz İçin Gerçek Zamanlı Hava Durumu Bilgisi

Gerçek zamanlı hava durumu verilerini web sitenize eklemek için en iyi API entegrasyon yöntemlerini keşfedin. PHP, Node.js ve JavaScript (Fetch API) ile OpenWeatherMap kullanarak hava durumu bilgilerini nasıl çekeceğinizi öğrenin.

Hava Durumu API Entegrasyonu: Web Siteniz İçin Gerçek Zamanlı Hava Durumu Bilgisi

Hava Durumu API Entegrasyonu: Web Siteniz İçin Gerçek Zamanlı Hava Durumu Bilgisi

AcilHost.Net / İstanbul

Web sitelerinde gerçek zamanlı hava durumu bilgisi sunmak, kullanıcı deneyimini artıran önemli bir özelliktir. API tabanlı hava durumu servisleri sayesinde, belirli bir şehir veya konum için güncel hava durumu verilerini göstermek mümkündür. Bu makalede, PHP, JavaScript (Node.js) ve Fetch API kullanarak OpenWeatherMap API ile hava durumu verilerini nasıl çekeceğinizi adım adım anlatıyoruz.

Hava Durumu API Nedir?

Hava durumu API’leri, belirli bir bölge için sıcaklık, nem, rüzgar hızı ve hava koşullarını gerçek zamanlı olarak sunan servislerdir. OpenWeatherMap gibi popüler API sağlayıcıları, ücretsiz ve ücretli planlar sunarak hava tahminlerine erişim sağlar.

PHP ile Hava Durumu API Entegrasyonu

PHP kullanarak OpenWeatherMap API’den hava durumu verilerini almak oldukça basittir. Aşağıdaki kod, belirtilen şehir için hava durumu verilerini çeker ve ekrana yazdırır.

Kod Açıklaması:
  • file_get_contents() fonksiyonu, API’ye istek göndererek JSON formatında veri alır.
  • json_decode() ile gelen veri işlenir.
  • Sıcaklık, hava durumu ve rüzgar bilgisi ekrana yazdırılır.

Node.js ile Hava Durumu API Kullanımı

Node.js ile API’ye istek göndererek hava durumu verilerini almak için Axios kütüphanesini kullanabilirsiniz.

Adımlar:

  1. Axios kütüphanesini yükleyin:
    sh
    npm install axios
  2. Aşağıdaki kodu weather.js dosyasına kaydedin ve çalıştırın:
javascript
const axios = require("axios"); const API_KEY = "SENİN_API_ANAHTARIN"; const city = "Istanbul"; const apiUrl = `https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${API_KEY}&units=metric&lang=tr`; axios.get(apiUrl) .then(response => { const data = response.data; console.log(`Şehir: ${data.name}`); console.log(`Sıcaklık: ${data.main.temp}°C`); console.log(`Hava Durumu: ${data.weather[0].description}`); console.log(`Rüzgar Hızı: ${data.wind.speed} m/s`); }) .catch(error => { console.error("API'den veri alınamadı:", error); });

Çalıştırmak için:
Terminalde şu komutu kullanabilirsiniz:

sh
node weather.js

HTML & JavaScript (Fetch API) ile Hava Durumu Bilgisi

Web sitenize hava durumu bilgisi eklemek için Fetch API ile kullanıcıdan şehir bilgisi alabilir ve hava durumunu dinamik olarak gösterebilirsiniz.

html
html> <html lang="tr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Hava Durumu</title> </head> <body> <h2>Hava Durumu Bilgisi</h2> <input type="text" id="city" placeholder="Şehir girin"> <button onclick="getWeather()">Hava Durumunu Göster</button> <div id="weatherResult"></div> <script> function getWeather() { const city = document.getElementById("city").value; const apiKey = "SENİN_API_ANAHTARIN"; const apiUrl = `https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${apiKey}&units=metric&lang=tr`; fetch(apiUrl) .then(response => response.json()) .then(data => { document.getElementById("weatherResult").innerHTML = `

Şehir: ${data.name}

Sıcaklık: ${data.main.temp}°C

Hava Durumu: ${data.weather[0].description}

Rüzgar Hızı: ${data.wind.speed} m/s `; }) .catch(error => { document.getElementById("weatherResult").innerHTML = "

Hava durumu bilgisi alınamadı. "; }); } </script> </body> </html>

Kod Açıklaması:

  • Kullanıcıdan şehir ismi alınıp OpenWeatherMap API’ye istek yapılır.
  • fetch() fonksiyonu ile API’den JSON veri çekilir.
  • Hava durumu bilgisi HTML sayfasında gösterilir.

Sonuç ve Öneriler

  • PHP ile back-end tarafında hava durumu bilgisini almak isteyenler için basit bir çözüm sunuluyor.
  • Node.js (JavaScript) kullanarak, API isteklerini asenkron olarak işleyebilirsiniz.
  • Fetch API ile hava durumu bilgisini doğrudan bir web sayfasında gösterebilirsiniz.

Web sitenize hava durumu verilerini entegre etmek için yukarıdaki yöntemlerden herhangi birini kullanabilirsiniz. API hizmetleri genellikle ücretsiz bir kullanım kotası sunsa da, ticari projeler için ücretli planlara göz atmak faydalı olabilir.


www.acilhost.net