Selamat Datang 4.0

Sejak Next.js mengumumkan Incremental Static Regeneration, saya sudah berniat untuk mengimplementasikan fitur blog lengkap dengan cms nya untuk fergushaga.id. Walaupun saya bukan orang yang terbiasa menulis atau menyusun suatu ulasan, fitur blog di sini lebih ditujukan sebagai implementasi teknis namun tetap memiliki fungsionalitas yang memadai mulai dari cms sampai halaman blog nya sendiri.

Artikel ini akan membahas pembaruan iterasi ke-empat fergushaga.id secara umum.

CMS

Awalnya saya berkeinginan untuk menggunakan hosted CMS seperti sanity / dato, atau selfhosted solution seperti strapi. Tetapi jika menggunakan hosted cms, terasa seperti kurang memenuhi aspek implementasi teknis. Jika menggunakan strapi, rasa-rasanya terlalu overkill untuk skala projek kecil.

Beberapa fitur CMS yang dibutuhkan fergushaga.id :

Akhirnya saya memutuskan untuk membangun CMS sendiri. Tidak terlalu kompleks dan tidak mengurangi aspek implementasi teknis. CMS ini saya beri nama whitepage.

Planetscale

Sebagai seorang frontend developer, saya memiliki pengetahuan SQL yang terbatas. Awalnya whitepage menggunakan MySQL dan setiap kali saya menulis kode untuk API baru yang berhubungan dengan database, kalimat ini selalu terbesit : "ada yang lebih simple enggak ya? cuma gini doang kok querynya 20 baris ya? ntar ini maintain MySQL nya gimana ya? migrasi database? apa tuh?".

Sampai pada akhirnya saya menemukan Planetscale.

Planetscale adalah DBaas serverless, memiliki fitur branching (seperti git), cli yang powerful, free-tier yang mumpuni, serta integrasi yang mudah ke Next.js dan Prisma.

Menggunakan Planetscale + Prisma sangat mempercepat proses development dan menyelesaikan beberapa masalah database saya di awal seperti migration, maintainability dan scalability. Dari sisi query sendiri, meskipun untuk memahami schema dan API prisma bagi saya cukup memakan waktu, pada akhirnya proses development tetap lebih cepat dan rapi jika dibandingkan menggunakan raw query SQL.

Performa

Sejak v3, fergushaga.id sudah menggunakan Chakra-UI. Namun untuk v4 ini saya berpindah haluan dan menggunakan daisyUI. Jangan salah, saya sangat menyukai Chakra dan saya akan tetap memilih Chakra untuk projek yang lebih kompleks atau projek yang banyak menggunakan modal pada UI nya. 

Selain menggunakan daisyUI, saya juga mengurangi beberapa animasi dan tidak lagi menggunakan font DancingScript (di home page). Hasilnya berdasarkan web.dev measure, fergushaga.id mengalami peningkatan peforma;

v3 :

v4 :

Perlu dicatat bahwa peningkatan accessibility dan SEO tidak berhubungan dengan mengganti Chakra ke daisyUI.

Penutup

Iterasi ke-4 ini banyak memberikan pengetahuan baru bagi saya, tidak kalah dari iterasi-iterasi sebelumnya. Bagian yang paling menarik menurut saya adalah bagaimana planetscale dan prisma dapat mempercepat proses development dan membuat saya seorang frontend bagikan seorang backend engineer profesional. Canda!

Untuk blog di fergushaga.id kedepannya masih akan ditambahkan beberapa fitur seperti tagar dan komentar.

Pada akhirnya walaupun saya sadar masih banyak kekurangan terutama pada whitepage dan juga saya harus lebih banyak berlatih untuk menulis, saya merasa cukup puas untuk iterasi ke-4 ini karena memenuhi esensi dari fergushaga.id sendiri yaitu sebagai tech playground dan portofolio pribadi saya.