Gak Cuma Data "Palsu": Ngintip API Publik dengan Data Nyata!

Udah seru kan "main-main" sama JSONPlaceholder? Kamu jadi punya gambaran gimana cara ngirim berbagai jenis request dan liat responsenya. Tapi, JSONPlaceholder itu kan datanya "palsu" alias cuma buat sampel.

Sekarang, gimana kalau kita coba ngintip API publik yang beneran nyediain data nyata yang bisa kita pake buat aplikasi keren? Kita bakal liat dua contoh: API buat dapetin info cuaca dan API buat dapetin gambar acak.

Ini bakal nunjukin betapa beragamnya data yang bisa disediain lewat API, dan seringkali, kita butuh "kunci" khusus buat ngaksesnya.

1. API Cuaca: Nanyain Kabar Langit ke Internet

Siapa sih yang gak pernah ngecek ramalan cuaca? Nah, banyak banget layanan cuaca yang nyediain API biar aplikasi lain bisa nampilin data cuaca mereka.

Salah satu yang populer dan punya versi gratis buat developer adalah OpenWeatherMap API (openweathermap.org/api).

• Apa yang Bisa Didapetin?

  • Cuaca saat ini di kota tertentu (suhu, kelembapan, kecepatan angin, deskripsi cuaca kayak "cerah", "berawan", "hujan").
  • Ramalan cuaca buat beberapa hari ke depan.
  • Data historis cuaca (biasanya fitur berbayar).
  • Dan banyak lagi!

• Butuh "Kunci Masuk" (API Key):

  • Sebagian besar API publik yang nyediain data bagus (kayak OpenWeatherMap) biasanya minta kamu buat daftar dulu dan ngedapetin API Key (Kunci API).
  • API Key ini kayak "tiket masuk" atau "kode identifikasi" unik buat kamu. Tujuannya biar si penyedia API bisa:
    • Ngontrol siapa aja yang make API mereka.
    • Ngelacak seberapa sering kamu make API-nya (karena versi gratis biasanya ada batasan jumlah request per hari/menit).
    • Ngeblokir akses kalau ada penyalahgunaan.
  • Cara dapet API Key OpenWeatherMap:
    1. Buka openweathermap.org.
    2. Daftar akun baru (biasanya gratis).
    3. Setelah login, cari bagian "API keys" di dashboard akunmu. Kamu bakal dikasih satu atau lebih API Key. Simpen baik-baik API Key ini JANGAN DI-SHARE PUBLIK YA!

• Contoh Request (GET) ke OpenWeatherMap API (Buat Cuaca Saat Ini):

  • URL Endpoint Dasar: https://api.openweathermap.org/data/2.5/weather

  • Parameter Query yang Dibutuhin:

    • q={nama_kota}: Nama kota yang mau dicek cuacanya (misal, Jakarta, London).
    • appid={API_KEY_KAMU}: Nah, ini tempat kamu masukin API Key yang udah kamu dapet.
    • (Opsional) units=metric: Biar suhunya dalam Celcius.
    • (Opsional) lang={kode_bahasa}: Buat deskripsi cuaca dalam bahasa tertentu (misal, id buat Indonesia).

  • Contoh URL Lengkap (GANTI NAMA_KOTA dan API_KEY_KAMU!): https://api.openweathermap.org/data/2.5/weather?q=Jakarta&units=metric&lang=id&appid=API_KEY_KAMU_TARUH_SINI

  • Cara Nyobain:

    1. Ganti API_KEY_KAMU_TARUH_SINI dengan API Key OpenWeatherMap-mu.
    2. Kamu bisa langsung copy-paste URL lengkap itu ke address bar browser dan tekan Enter. Browser bakal ngirim GET request.
    3. Atau, lebih enak pake Postman:
       • Method: GET
       • URL: Masukin URL lengkap di atas.
       • Klik "Send".

• Contoh Response JSON (Disederhanakan):

  {
      "coord": { "lon": 106.8272, "lat": -6.1754 },
      "weather": [
          {
              "id": 803,
              "main": "Clouds",
              "description": "awan terpecah", // Ini kalau pake lang=id
              "icon": "04d"
          }
      ],
      "base": "stations",
      "main": {
          "temp": 28.5, // Suhu dalam Celcius (karena units=metric)
          "feels_like": 30.1,
          "temp_min": 27.9,
          "temp_max": 29.1,
          "pressure": 1010,
          "humidity": 75
      },
      "visibility": 10000,
      "wind": { "speed": 1.54, "deg": 100 },
      "clouds": { "all": 75 },
      "dt": 1678886400, // Timestamp
      "sys": {
          "type": 1, "id": 9327, "country": "ID",
          "sunrise": 1678834800, "sunset": 1678879200
      },
      "timezone": 25200,
      "id": 1642911,
      "name": "Jakarta", // Nama kota
      "cod": 200 // Status code (sukses)
  }

  Dari JSON ini, kamu bisa ngambil info suhu (main.temp), deskripsi cuaca (weather[0].description), nama kota (name), dll. buat ditampilin di aplikasimu.

2. API Gambar Acak: Nambahin Visual Tanpa Pusing Nyari

Kadang kita butuh gambar buat placeholder, atau sekadar mau nampilin gambar acak yang keren. Ada beberapa API yang nyediain ini.

a. Lorem Picsum (picsum.photos) - Super Simpel!

Ini API yang gampang banget dipake buat dapet gambar placeholder acak dengan ukuran tertentu.

• Gak Perlu API Key! Langsung pake aja.

• Cara Pake: URL-nya langsung nunjuk ke gambarnya.

  • https://picsum.photos/width/height : Dapet gambar acak dengan lebar width dan tinggi height.
    • Contoh: https://picsum.photos/200/300 (gambar acak ukuran 200x300 px).
  • https://picsum.photos/id/{image_id}/width/height: Dapet gambar spesifik berdasarkan ID-nya.
  • https://picsum.photos/seed/{seed_kata_acak}/width/height: Dapet gambar yang sama setiap kali pake seed yang sama.
  • Banyak opsi lain (grayscale, blur) yang bisa diliat di dokumentasinya.

  Coba di Browser atau Tag <img> HTML:

  1. Ketik https://picsum.photos/400/300 di address bar browser. Kamu bakal liat gambar acak. Refresh halamannya, gambarnya bakal ganti!
  2. Kamu juga bisa langsung pake di tag <img> HTML:

     <img src="https://picsum.photos/300/200" alt="Gambar Acak dari Picsum">

b. Unsplash API (unsplash.com/developers) - Kualitas Tinggi, Butuh API Key

Unsplash itu platform foto berkualitas tinggi yang gratis. Mereka juga punya API yang powerful, tapi butuh daftar dan API Key (Access Key).

• Apa yang Bisa Didapetin?
  • Foto acak.
  • Nyari foto berdasarkan kata kunci.
  • Data detail foto (deskripsi, fotografer, link download).
• Cara Pake (Gambaran Umum setelah dapet API Key):
  • Requestnya pake method GET.
  • API Key-nya biasanya dimasukin di Header Request sebagai Authorization: Client-ID YOUR_ACCESS_KEY.
  • Contoh Endpoint (ngambil foto acak): https://api.unsplash.com/photos/random
  • Contoh Request (pake cURL di terminal, atau setting di Postman):

    # GANTI YOUR_ACCESS_KEY dengan Access Key Unsplash-mu
    curl -H "Authorization: Client-ID YOUR_ACCESS_KEY" https://api.unsplash.com/photos/random

  • Response JSON-nya bakal ngasih banyak info soal foto itu, termasuk URL ke berbagai ukuran gambarnya (raw, full, regular, small, thumb).

    // Contoh response JSON Unsplash (sangat disederhanakan)
    {
      "id": "...",
      "description": "A beautiful landscape.",
      "urls": {
        "raw": "https://images.unsplash.com/...",
        "full": "https://images.unsplash.com/...",
        "regular": "https://images.unsplash.com/...", // Ini yang sering dipake
        "small": "https://images.unsplash.com/...",
        "thumb": "https://images.unsplash.com/..."
      },
      "user": {
        "name": "Photographer Name",
        "links": {
          "html": "https://unsplash.com/@photographer"
        }
      }
      // ... dan banyak data lain
    }

    Kamu bisa ambil urls.regular buat ditampilin di tag <img>.

Penting buat selalu baca dokumentasi API yang mau kamu pake, karena tiap API punya aturan main (endpoint, parameter, cara autentikasi) yang beda-beda.

Dengan ngeliat contoh-contoh API publik ini, semoga kamu jadi makin kebayang betapa luasnya kemungkinan yang bisa dibuka sama API. Dari data cuaca, gambar, berita, sampe data penerbangan, banyak banget informasi yang bisa kita akses dan integrasiin ke aplikasi web kita.

Kuncinya adalah nemuin API yang pas, baca dokumentasinya baik-baik, dan (kalau perlu) dapetin API Key-nya. Setelah itu, kamu bisa mulai "ngobrol" sama API itu pake tools kayak Postman, atau nanti langsung pake JavaScript!