Sebagai developer, ada beberapa proyek yang benar-benar menguji batas kemampuan kita. Bagi saya, salah satunya adalah ketika saya memimpin inisiatif untuk menulis ulang (rewrite) Portal Online Single Submission (OSS), sebuah sistem perizinan usaha terintegrasi berskala nasional. Proyek ini bukan sekadar pembaruan, melainkan sebuah lompatan besar dari arsitektur lama ke tumpukan teknologi frontend yang modern.
Tantangan Awal: Mengurai Kompleksitas
Portal OSS yang lama adalah aplikasi monolitik yang dibangun dengan teknologi JavaScript sisi klien tradisional. Meskipun fungsional, ia datang dengan berbagai tantangan:
- Performa Lambat: Waktu muat halaman terasa berat karena semua logika render terjadi di browser pengguna.
- Kesulitan Maintenance: Codebase yang sudah berumur dan saling terkait erat membuatnya sulit untuk dikembangkan dan diperbaiki tanpa menimbulkan efek samping.
- SEO yang Tidak Optimal: Sebagai aplikasi sisi klien, mesin pencari kesulitan mengindeks konten secara efektif, yang membatasi visibilitasnya.
Tujuannya jelas: kami membutuhkan arsitektur baru yang tidak hanya cepat dan andal, tetapi juga mudah dikelola dan ramah SEO.
Solusi: Memilih Next.js dan TypeScript sebagai Fondasi
Setelah evaluasi yang cermat, kami memilih Next.js sebagai framework utama. Pilihan ini didasari oleh beberapa keunggulan kuncinya:
Rendering Fleksibel (SSR & SSG): Next.js memungkinkan kami menerapkan Server-Side Rendering (SSR) untuk halaman-halaman yang memerlukan data dinamis dan Static Site Generation (SSG) untuk halaman informasional. Hasilnya? Waktu muat halaman pertama (First Contentful Paint) menjadi jauh lebih cepat karena pengguna menerima HTML yang sudah di-render sepenuhnya oleh server.
Ekosistem React yang Matang: Kami merancang ulang seluruh antarmuka pengguna (UI) dengan membangun sebuah pustaka komponen yang dapat digunakan kembali (reusable component library). Ini tidak hanya mempercepat proses pengembangan tetapi juga memastikan konsistensi visual di seluruh portal.
Keamanan Tipe dengan TypeScript: Migrasi dari JavaScript ke TypeScript adalah keputusan fundamental. Ini secara drastis mengurangi bug saat runtime dan membuat kolaborasi tim menjadi lebih mudah berkat keamanan tipe dan fitur autocompletion.
Proses dan Hasil
Prosesnya tidak mudah. Kami memulainya dengan membedah fungsionalitas yang ada, merancang ulang alur pengguna, dan secara bertahap membangun kembali setiap fitur sebagai komponen Next.js yang terisolasi. Integrasi dengan puluhan
REST API yang ada dilakukan dengan hati-hati menggunakan fetch, sementara
state management yang kompleks ditangani dengan React Context untuk menjaga aplikasi tetap ringan.
Hasil akhirnya sangat memuaskan. Portal OSS V2 yang baru tidak hanya terasa jauh lebih cepat dan responsif, tetapi juga lebih mudah untuk dikelola dan dikembangkan. Peringkat SEO kami meningkat, dan yang terpenting, pengalaman pengguna (UX) menjadi lebih baik. Proyek ini menjadi bukti nyata bagaimana adopsi arsitektur frontend modern dapat mengubah sebuah produk digital secara fundamental.