Description

Aplikasi ini adalah sebuah aplikasi cuaca yang dibangun menggunakan React Native. Tujuan dari aplikasi ini adalah untuk memberikan informasi cuaca saat ini serta prediksi cuaca untuk 7 hari ke depan kepada pengguna. Aplikasi ini menggabungkan teknologi React dan React Native untuk membuat antarmuka pengguna yang responsif dan mudah digunakan. Pengguna dapat memasukkan nama kota yang ingin mereka ketahui cuacanya, dan kemudian aplikasi akan mengambil data cuaca dari OpenWeatherMap API menggunakan kunci API yang disediakan (API_KEY).

Setelah mengambil data cuaca dari API, aplikasi akan menampilkan informasi cuaca saat ini, seperti ikon cuaca yang menggambarkan kondisi saat ini, suhu dalam satuan Celsius, dan deskripsi singkat tentang cuaca. Selain itu, aplikasi juga menampilkan prediksi cuaca untuk 7 hari ke depan dalam bentuk daftar horizontal yang dapat di-scroll. Untuk meningkatkan pengalaman pengguna, aplikasi ini juga menyediakan pilihan bahasa antara Bahasa Inggris dan Bahasa Indonesia. Pengguna dapat dengan mudah mengubah bahasa yang digunakan oleh aplikasi dengan mengubah nilai variabel weatherLanguage dalam kode sumber.

Tampilan aplikasi didesain dengan menggunakan komponen-komponen dari React Native, seperti View, Text, TextInput, TouchableOpacity, dan ScrollView. Selain itu, aplikasi ini juga menggunakan komponen Icon dari paket react-native-vector-icons/FontAwesome5 untuk menampilkan ikon cuaca yang sesuai berdasarkan kode ikon cuaca yang diterima dari API. Seluruh tampilan aplikasi ini diatur menggunakan StyleSheet, yang mendefinisikan gaya-gaya yang akan digunakan oleh komponen-komponen tersebut. Dalam stylesheet, warna, ukuran teks, dan tata letak komponen ditentukan untuk memberikan tampilan yang menarik dan mudah dibaca.

Dalam penggunaan sehari-hari, pengguna dapat dengan mudah memasukkan nama kota yang ingin mereka ketahui cuacanya, menekan tombol "Search", dan kemudian aplikasi akan menampilkan informasi cuaca yang diperoleh dari API. Pengguna juga dapat melihat prediksi cuaca untuk 7 hari ke depan dengan menggeser tampilan horizontal yang tersedia. Secara keseluruhan, aplikasi ini menyediakan pengguna dengan informasi cuaca yang mudah diakses dan dapat berguna dalam perencanaan kegiatan sehari-hari atau perjalanan.

Aplikasi ini adalah sebuah aplikasi cuaca yang dibangun menggunakan React Native. Aplikasi ini menggunakan data cuaca dari OpenWeatherMap API untuk menampilkan informasi cuaca saat ini dan prediksi cuaca untuk 7 hari ke depan.

Aplikasi ini memiliki fitur berikut:

1. Mengambil data cuaca dari API OpenWeatherMap menggunakan kunci API (API_KEY) yang disediakan.
2. Menggunakan useEffect untuk memanggil fungsi fetchWeatherData saat komponen App dimuat dan saat city berubah.
3. Fungsi fetchWeatherData melakukan permintaan HTTP menggunakan fetch() untuk mendapatkan data cuaca dari API berdasarkan kota yang dimasukkan.
4. Jika data cuaca berhasil diperoleh, maka data tersebut disimpan dalam state weatherData menggunakan useState.
5. Jika data cuaca belum tersedia, maka tampilan "Loading..." ditampilkan.
6. Aplikasi ini menyediakan dukungan untuk dua bahasa: Inggris (en) dan Bahasa Indonesia (id). Pengguna dapat mengganti bahasa dengan mengubah nilai weatherLanguage.
7. Tampilan aplikasi menggunakan komponen-komponen dari React Native seperti View, Text, TextInput, TouchableOpacity, dan ScrollView.
8. Aplikasi ini juga menggunakan komponen Icon dari paket react-native-vector-icons/FontAwesome5 untuk menampilkan ikon cuaca yang sesuai berdasarkan kode ikon cuaca yang diterima dari API.
9. Aplikasi ini memiliki tampilan latar belakang gambar yang diatur menggunakan ImageBackground.
10. Aplikasi ini menampilkan informasi cuaca saat ini seperti ikon cuaca, suhu, kondisi cuaca, dan deskripsi cuaca.
11. Aplikasi juga menampilkan prediksi cuaca untuk 7 hari ke depan dalam bentuk scrollable horizontal view.

Seluruh tampilan aplikasi ini ditentukan oleh stylesheet yang menggunakan StyleSheet.create untuk mendefinisikan gaya-gaya yang akan digunakan oleh komponen-komponen tersebut.

Penggunaan Aplikasi:

1. Pengguna dapat memasukkan nama kota dalam TextInput.
2. Setelah memasukkan nama kota, pengguna dapat menekan tombol Search untuk mencari informasi cuaca.
3. Aplikasi akan memuat data cuaca dari API dan menampilkan informasi cuaca saat ini serta prediksi cuaca untuk 7 hari ke depan.
4. Jika tidak ada data cuaca yang tersedia, pesan "Tidak ada cuaca yang ditampilkan" akan ditampilkan.

Source Code :

Tampilan hasil Aplikasi :

Awal :

Hasil pencarian :