Postingan

Menampilkan postingan dari April, 2026

Pengenalan crootJS

Gambar
CrootJS merupakan sebuah library JavaScript yang dirancang untuk mempermudah proses pengembangan aplikasi web dengan pendekatan yang sederhana dan efisien. Library ini ditujukan bagi pengembang yang menginginkan struktur aplikasi yang rapi tanpa harus menggunakan framework besar yang cenderung kompleks. Dalam perkembangan teknologi frontend saat ini, banyak framework yang menawarkan fitur lengkap, namun sering kali terlalu berlebihan untuk kebutuhan proyek berskala kecil hingga menengah. CrootJS hadir sebagai alternatif yang lebih ringan, sehingga pengembang dapat lebih fokus pada logika aplikasi tanpa terbebani oleh konfigurasi yang rumit. CrootJS menekankan pada beberapa aspek utama, yaitu pengelolaan data (state) yang sederhana, pengaturan tampilan yang terstruktur, serta performa yang tetap optimal tanpa beban tambahan yang tidak diperlukan. Kenapa harus croot.js? karena pustaka module dari javascript punya banyak keunggulan diantaranya: 1. Buat website jadi lebih dinamis 2. Karbon...
Posting Komentar
Baca selengkapnya

Belajar CrootJS Hingga Mini Project Login & Register

Gambar
 CrootJS hadir sebagai alternatif ringan berbasis JavaScript dengan pendekatan modular menggunakan ES Module 1. Apa itu CrootJS? CrootJS adalah library modular berbasis JavaScript yang membantu developer membangun interaksi dinamis tanpa bergantung pada framework besar. menggunakan pendekatan ES Module, sehingga kita dapat mengimpor fungsi tertentu sesuai kebutuhan. 2. Menggunakan CrootJS via CDN karena CrootJS berbasis ES Module, kita harus menggunakan:  - HTML : Contoh: 3. Mini Project: Login & Register ikuti langkah-langkah berikut ini yaa 1. Buka github.com dan pastikan kamu sudah punya akun yaa jika belum kamu bisa membuat akun terlebih dahulu. Alternatif lain jika tidak menggunakan github.com, kamu bisa menggunakan aplikasi Visual Studio Code (VSCode) 2. Setelah kamu berhasil masuk, kamu bisa membuat repository baru dengan klik "repository" di pojok kanan atas  3. Setelah itu klik "New Repository" untuk membuat repository baru 4. Setelah berhasil membuat r...
Posting Komentar
Baca selengkapnya

Belajar Web API Jadi Gampang: Contoh POST Sederhana pakai JScroot & webhook.cool

Gambar
💻 Belajar Web API Sederhana: Kirim Data dari Website dengan POST (JScroot + webhook.cool) Dalam dunia web development modern, hampir semua website yang kita gunakan tidak berdiri sendiri. Di balik tampilan yang kita lihat, ada proses komunikasi antara frontend (tampilan) dan backend (server) yang terjadi terus-menerus. Komunikasi inilah yang disebut API . Apa itu API?     API (Application Programming Interface) adalah jembatan yang menghubungkan website dengan server. Website tidak bisa langsung mengakses database, jadi harus “berbicara” melalui API menggunakan HTTP request seperti GET dan POST . GET vs POST GET → mengambil data dari server POST → mengirim data ke server Pada tutorial ini, kita akan fokus ke POST dengan membuat website sederhana yang bisa mengirim input user ke server. Tools yang Digunakan: JScroot → library JavaScript untuk mempermudah API HTTP request (seperti GET dan POST) langsung dari browser tanpa perlu men...
Posting Komentar
Baca selengkapnya

Membuat dasar sistem blokir sederhana (simulasi)

Gambar
1. Buka file eksplorer lalu buat folder baru project kalian namanya terserah kalian ajalah 2. Setelah itu buka Visual Studio Code kalian 3. Lalu open folder tadi yang telah kalian buat 4. Lalu buat file html baru yang diberi nama blocked.html Klik icon tersebut untuk buat file baru (Gambar 1 : Icon untuk buat file baru) Lalu isi kolom tersebut dengan blocked.html (Gambar 2 : Kolom untuk mengisi nama file) Setelah mengisi kolom tersebut dengan blocked.html, lalu klik enter (Gambar 3 : Isi file tersebut dengan blocked.html) Lalu isi file kosong (Gambar 4 : Isi file kosong tersebut dengan kode program) 5. Setelah itu isi file tersebut dengan kode program seperti dibawah ini: <!DOCTYPE html> <html> <head> <title>Smart Focus</title> </head> <body> <h1>Halaman Utama</h1> <!-- Script di sini --> <script type="module" src="root.js"></script> </body> </html> (Gambar 5 : kode program...
Posting Komentar
Baca selengkapnya