frontend
Catatan teknis seputar web development, DevOps, dan integrasi AI.
104 artikel
- 18.30frontend
MessageCircle Bukan WhatsApp, Klien yang Ngasih Tahu
Tombol WhatsApp pakai ikon chat generik lucide bikin pengunjung ragu. Solusinya inline SVG brand plus perbaikan kontras tombol.
#react#frontend#seo - 18.16frontend
Grid Dua Kolom di Mobile, Satu Keputusan yang Gue Tarik Balik
Grid 4 kolom dipecah 2 di layar kecil bikin kartu mepet. Solusinya: carousel embla di mobile, grid tetap di desktop, dan DOM jadi dobel.
#nextjs#react#frontend - 16.28frontend
Pindah ke Grid, Pola Show More, dan Satu Trade-off SEO
Refactor halaman services: kolom panjang jadi grid 3 kolom dengan pola Show More. Ada trade-off SEO yang baru disadari setelah cek view source.
#nextjs#react#frontend - 16.22frontend
Badge Sertifikasi Tanpa Gambar Bikin next/image Crash
Field image dijadikan optional, tapi komponen langsung render next/image tanpa ngecek. Halaman About crash dengan error src missing. Ini fallback UI yang bener.
#nextjs#typescript#frontend - 02.36frontend
Tipe TypeScript Nggak Ikut ke JSON, Makanya Ada Kontrak Test
Interface TypeScript ilang saat runtime, jadi JSON konten butuh contract test. Cerita dari commit egperkasa-website: optional property, type erasure, dan it.each Vitest.
#typescript#testing#frontend - 14.14frontend
Membedumkan Pipeline Embed Artikel Buatan Agen
Pipeline embed artikel kini render token di dalam <pre>/<code> sebagai kode literal, degradasi ke fallback saat payload rusak, dan re-highlight blok Quarto/Pandoc.
#shiki#nextjs#frontend - 12.45frontend
Dua Commit yang Saya Revert: generateSitemaps vs Route Next 16
Build Next 16 menolak route folder sitemap.xml karena bentrok konvensi metadata. Dua commit saya revert, sistem /sitemaps/ lama via rewrite sudah cukup.
#nextjs#seo - 01.38frontend
Kontrak Code Block Shiki dan Short Lang ID
Saya kunci kontrak code block biar artikel tidak merusak render: lang id pendek, alias Shiki jelas, dan blok yang salah bentuk ditolak sebelum publish.
#shiki#nextjs#frontend - 01.38frontend
Gabung Fragment HTML di ArticleBody React
Bug kecil di ArticleBody bikin paragraf pecah dan jarak antar blok jadi aneh. Solusinya ternyata bukan rewrite parser, cuma gabung fragment HTML yang berurutan.
#react#frontend#html