mrfdn.com - Saya sedang asyik ngulik Express dan HTMX. Dan terasa menyenangkan karena HTMX seperti magic. Hal-hal yang terasa malas dikerjakan dengan susah payah kini bisa dilakukan dengan mudah. Contohnya kali ini saya ingin menampilkan indikator loading saat proses fetching data di server. Caranya sangat mudah, HTMX memiliki atribut yang bernama hx-indicator. Atribut ini bisa ditempatkan pada tombol atau tag html yang mengeksekusi fetching data. Di sini saya menggunaakan tag <button> untuk melakukan fetching data. ...

mrfdn.com - Halo… Express js merupakan salah satu framework Nodejs terbaik yang ada di dunia. Dia bisa menjalankan aplikasi berbasis web dengan NodeJS sebagai backend untuk segala kebutuhan. Baik untuk serve static file hingga CRUD (create, read, update, delete) sederhana dengan mengintegrasikan database. Jika anda memiliki aplikasi CRUD yang menggunakan Express JS, anda bisa mengonlinekan aplikasi anda itu ke internet dengan menggunakan Vercel. Vercel merupakan salah satu platform yang bisa digunakan untuk hosting web secara gratis. ...

mrfdn.com - Jika menggunakan neovim, ada 2 cara untuk setup dan config neovim. Cara pertama, yaitu install neovim, lalu isi config pada folder ~/.config/nvim/. Ini sama seperti config neovim distro linux pada umumnya. Cara kedua, yaitu install dan config neovim langsung dari home-manager. Dengan cara ini neovim akan berjalan secara modular. Tidak perlu lagi menggunakan plugin manager, karena plugin didefinisikan pada konfigurasi nvim di home-manager. Apa saja yang aktif? ...

mrfdn.com - Dark mode, atau mode gelap, telah menjadi tren desain antarmuka pengguna yang populer. Banyak pengguna menghargai opsi ini karena dapat mengurangi kelelahan mata dan meningkatkan kenyamanan saat menggunakan perangkat pada malam hari. Dalam artikel ini, kita akan membahas cara mengimplementasikan dark mode pada halaman HTML dengan menggunakan HTML, CSS, dan JavaScript. Versi 1 : Tanpa Toggle Pada contoh pertama ini, kita menggunakan 2 tombol untuk klik secara manual antara light mode atau dark mode. ...

mrfdn.com - Percayalah tentang judul yang anda baca pada blog ini. Ini adalah saran terbaik buat kamu orang normal yang belajar menggunakan linux dan tidak tau mau ngapain di linux. Belajarlah menggunakan vim. Tidak banyak orang yang memberikan saran ini. Dan saya heran kenapa orang tidak merekomendasikan menggunakan vim, padahal banyak sekali sisi positifnya jika tahu pakai vim. Orang-orang terlalu nyaman menggunakan nano atau text editor lainnya dibandingkan vim. ...

mrfdn.com - Kali ini saya hanya ingin membagikan pengalaman saya yang pernah mengerjakan projekan web development secara solo dev. Ya, projekan web yang dikerjakan sendiri. Awalnya saya mengira ini mudah, dan akan cepat kelar, karena saya cukup memahami apa yang ingin dibuat. Tetapi tidak. Cukup banyak hal detail yang mesti diperhatikan yang harus dipikirkan dan dikerjakan. Semua elemen/komponen web harus dirancang sebaik mungkin, supaya aplikasi/web yang akan diserahkan kepada klien bisa berjalan dengan solid dan tanpa kendala. ...

mrfdn.com - Suatu hari teman saya yang berprofesi sebagai dosen mengajak saya untuk menjadi salah satu juri pada sebuah lomba desain website antar kampus se-Indonesia. Entah apa motivasinya, mungkin karena dia sering melihat saya utak atik theme, atau pernah membantunya membuatkan theme wordpress. entahlah… Awalnya saya menolak karena saya pikir masih banyak yang lebih kompeten dari pada saya. Lalu saya pun akhirnya mengambil tawaran tersebut. Tugas saya tidak banyak, saya hanya perlu menilai hasil desain website yang dikirim oleh adik-adik mahasiswa. ...

mrfdn.com - Mungkin ada beberapa di antara teman-teman yang menggunakan Hugo sebagai platform untuk nge-blog. Dan blog nya juga menampilkan iklan adsense. Kali ini saya ingin share cara menampilkan iklan di antara paragraf hugo. Baris iklan akan tampil setiap beberapa paragraf. Iklan akan terender secara otomatis pada file html, bukan tampil sebagai javascript. Tanpa berlama-lama, begini caranya menampikan iklan di antara paragraf hugo blog. Buat file partial Buat file partial di layouts/partials/iklan/iklan-tengah.html. ...

mrfdn.com - Kali ini saya sedang belajar Solidjs. Di sini saya ingin submit dan fetch data secara otomatis dari dan ke google sheet. Saya menggunakan Astro, dan menjalankan SolidJS sebagai component. Komponen ini yang saya buat ini digunakan untuk menghandle kirim ucapan / komentar untuk web invitation. Di sini saya dibantu oleh ChatGPT untuk generate codingan solid js. Langsung saja begini caranya: Daftar Isi Install package solidjs Folder structure Buat komponen utama SolidJS : App.jsx Buat komponen Form.jsx Panggil komponennya di halaman astro: index.astro Kesimpulan Install package solidjs Pastikan sudah install solid di projekan astro ...

mrfdn.com - Kali ini saya ingin share cara setup VPS server dengan OS Freebsd yang saya beli pada sebuah web hosting. Saya hanya ingin menjalankan web statis di sana. Jadi settingan server ini akan sangat minimalis. Tanpa berlama-lama begini caranya. Daftar Isi Setup Nginx Konfigurasi Server Block Nginx Install Lets Encrypt situs bisa diakses melalui HTTPS Cara update SSL menggunakan Certbot di Freebsd Ganti port SSH Freebsd Rsync Hugo ke VPS Hosting Setup Nginx Install nginx dan neovim ...