Home

Membuat aplikasi ramalan cuaca progressive web app (PWA) melalui gen.AI DeepSeek. Di sini akan digunakan API OpenWeatherMap. Untuk memperoleh API Key-nya silahkan kunjungi https://openweathermap.org/api

Prompt:

Buat aplikasi ramalan cuaca progressive web app (PWA) dengan:
- Geolocation untuk deteksi lokasi otomatis
- Penyimpanan lokal untuk kota favorit
- Tema gelap/terang
- Unit konversi (Celsius/Fahrenheit)
- Animasi ikon cuaca dengan CSS
- Responsif untuk mobile dan desktop
- Integrasi dengan API OpenWeatherMap
Sertakan kode lengkap HTML, CSS, dan JavaScript

Hasil eksekusi dari prompt di atas akan menghasilkan beberapa script, yaitu:
1. index.html
2. styles.css
3. app.js
4. sw.js
5. manifest.json

Petunjuk Penggunaan

1. Setup API Key: Aplikasi menggunakan API key OpenWeatherMap gratis. Untuk kode produksi, ganti API key di file app.js dengan milik Anda sendiri (dapatkan dari OpenWeatherMap).

2. Menjalankan Aplikasi:

   • Simpan semua file dalam folder yang sama

   • Buka index.html di browser modern

   • Untuk pengujian PWA, gunakan server lokal (Live Server di VS Code)

3. Fitur yang Tersedia:

   • Deteksi lokasi otomatis

   • Pencarian kota manual

   • Daftar kota favorit dengan penyimpanan lokal

   • Toggle tema gelap/terang

   • Konversi satuan suhu Celsius/Fahrenheit

   • Animasi ikon cuaca berdasarkan kondisi

   • Responsif untuk mobile dan desktop

   • Install sebagai aplikasi (PWA)

4. Instal sebagai Aplikasi:

   • Di browser mobile/desktop, cari opsi "Install App" atau "Add to Home Screen"

   • Klik tombol "Install Aplikasi" di footer

Aplikasi ini siap digunakan dan memiliki semua fitur yang diminta dengan implementasi lengkap dari PWA, termasuk service worker untuk fungsionalitas offline.

Hasil: https://parewa.my.id/cuaca