Back to Projects

Website Builder

Platform website builder yang sedang saya kembangkan untuk kebutuhan sebuah institusi universitas di Blitar, Jawa Timur, agar tim internal dapat membuat dan mengelola website secara lebih mandiri. Sistem ini dibangun dengan Nuxt.js di sisi frontend, NestJS untuk API, MongoDB dengan Prisma sebagai layer data, dan GrapesJS sebagai editor visual. Konsep utamanya mirip WordPress Elementor dalam versi yang lebih ringan, dengan fokus pada kemudahan penggunaan untuk orang awam yang ingin mengelola halaman website tanpa harus memahami teknis development secara mendalam.

In Development
2026
Ongoing
University Institution
Blitar, Jawa Timur
Website Builder - Image 1

Overview

Platform website builder yang sedang saya kembangkan untuk kebutuhan sebuah institusi universitas di Blitar, Jawa Timur, agar tim internal dapat membuat dan mengelola website secara lebih mandiri. Sistem ini dibangun dengan Nuxt.js di sisi frontend, NestJS untuk API, MongoDB dengan Prisma sebagai layer data, dan GrapesJS sebagai editor visual. Konsep utamanya mirip WordPress Elementor dalam versi yang lebih ringan, dengan fokus pada kemudahan penggunaan untuk orang awam yang ingin mengelola halaman website tanpa harus memahami teknis development secara mendalam.

Challenges

  • Merancang website builder yang cukup fleksibel untuk kebutuhan editing halaman namun tetap sederhana untuk pengguna non-teknis
  • Mengintegrasikan GrapesJS ke dalam alur aplikasi custom agar editor dapat digunakan dengan stabil di dalam dashboard
  • Menyusun arsitektur full-stack yang mendukung autentikasi, builder, manajemen konten, dan user management dalam satu sistem
  • Membangun pengalaman dashboard yang rapi untuk fitur login, forgot password, summary, post management, dan profile settings
  • Menyiapkan struktur data yang tetap scalable untuk page builder, layout builder, kategori post, dan pengelolaan user

Solutions

  • Mengembangkan frontend berbasis Nuxt.js dan TailwindCSS untuk antarmuka dashboard yang cepat, modular, dan mudah dikembangkan
  • Membangun API menggunakan NestJS dengan MongoDB dan Prisma untuk fondasi backend yang terstruktur dan maintainable
  • Menggunakan GrapesJS sebagai core visual editor untuk builder pages dan builder layout agar proses editing lebih intuitif
  • Menyusun modul fitur yang mencakup autentikasi, forgot password, dashboard summary, post list beserta kategori, user management, edit profile, dan update password
  • Mendesain sistem sebagai website builder versi sederhana agar lebih mudah digunakan oleh user awam dibandingkan builder yang lebih kompleks

© 2025 Muhammad Lutfi. All rights reserved.