Dalam tutorial kali ini kita akan membahas Async / Await dan Promise di JavaScript. Sebagaimana diketahui bahwa JavaScript adalah bahasa single-threaded, artinya ia mengeksekusi satu perintah dalam satu waktu. Namun dalam aplikasi modern, kita sering membutuhkan proses asinkron, seperti: Memuat data dari API, Menunggu respon server, Menjalankan animasi, atau menunda eksekusi fungsi tertentu. Untuk itulah… Read More »
Sebelumnya, kita sudah membuat aplikasi CRUD (Create, Read, Update, Delete) menggunakan JavaScript dan LocalStorage. Namun, LocalStorage hanya menyimpan data di browser pengguna, artinya tidak bisa dibagikan antar perangkat. Untuk mengatasinya dapat dilakukan dengan cara Sinkronisasi CRUD LocalStorage, yaitu kita akan menyinkronkan data LocalStorage ke server PHP & MySQL, sehingga: Data tetap tersimpan secara permanen di… Read More »
Biasanya, data CRUD disimpan di server database seperti MySQL. Namun, untuk latihan atau proyek kecil, kita bisa menyimpan data secara lokal di browser menggunakan LocalStorage. Untuk itu dalam tutorial kali ini kita akan bahas tentang CRUD JavaScript dengan LocalStorage (Data Permanen). Dengan LocalStorage: Data tetap tersimpan walau halaman direfresh. Tidak butuh koneksi internet atau server.… Read More »
Dalam tutorial sebelumnya sudah dijelaskan mengenai CRUD Fetch API dan CRUD Tanpa API di JavaScript. Dan dalam tutorial kali ini kita akan bahas tentang CRUD JavaScript dengan Pencarian, Sorting, dan Pagination. Karena setelah dapat membuat aplikasi CRUD dasar, tantangan berikutnya adalah mengelola banyak data agar pengguna bisa: Mencari data dengan cepat Mengurutkan berdasarkan kolom tertentu… Read More »
Pada tutorial sebelumnya sudah dibahas tentang LocalStorage dan CRUD Fetch API di JavaScript, sekarang akan kita bahas CRUD JavaScript Tanpa API dengan Form dan Table Dinamis. Dan yang perlu diketahui bahwa aplikasi CRUD (Create, Read, Update, Delete) tidak selalu membutuhkan server database. Kamu bisa membuat versi sederhana langsung di browser, menggunakan: Array JavaScript untuk menampung… Read More »
Dalam tutorial sebelumnya sudah dijelaskan tentang fetch API di JavaScript, dan pada tutorial kali ini akan dijelaskan tentang CRUD Fetch API di JavaScript. CRUD adalah singkatan dari: Create → Menambah data baru Read → Menampilkan data dari server Update → Mengubah data yang sudah ada Delete → Menghapus data Empat operasi ini adalah dasar dari… Read More »
Fetch API JavaScript adalah fitur modern di JavaScript yang digunakan untuk mengambil data dari server atau API eksternal. Dengan Fetch, kamu bisa melakukan permintaan HTTP (GET, POST, PUT, DELETE) tanpa perlu library tambahan seperti jQuery. Contohnya, kamu bisa mengambil data pengguna, daftar produk, atau berita terbaru dari server, lalu menampilkannya langsung di halaman web. Struktur Dasar… Read More »
Tidak semua aplikasi web memerlukan database besar seperti MySQL atau MongoDB. Untuk menyimpan data sederhana seperti riwayat pencarian, daftar tugas, atau preferensi pengguna, kamu bisa memakai LocalStorage bawaan browser. Agar data bisa disimpan dan dibaca dengan benar, JavaScript menggunakan format JSON (JavaScript Object Notation). Keduanya adalah kombinasi sempurna untuk menyimpan data lokal di sisi pengguna.… Read More »
Sebelumnya kita sudah belajar tentang array dan object manipulation Looping, map(), filter(), dan reduce(), sekarang kita akan lanjutkan tutorialnya tentang Array dan Object Manipulation Lanjutan (Destructuring, Spread Operator, dan Rest Parameter) di JavaScript. Dalam JavaScript modern (ES6 ke atas), kita bisa menulis kode lebih singkat, rapi, dan mudah dibaca dengan fitur: Destructuring Spread Operator (…)… Read More »
Dalam JavaScript, array dan object adalah struktur data paling penting untuk menyimpan dan mengelola data. Array digunakan untuk menyimpan kumpulan data berurutan, seperti daftar nama atau angka. Object digunakan untuk menyimpan data dengan pasangan key-value, seperti profil pengguna. Contoh dasar: // Array const buah = [“Apel”, “Jeruk”, “Mangga”]; // Object const user = { nama:… Read More »