Discover insights and stories in my latest article
28 September 2026
I build solutions through collaboration and clear communication with clients.
Adaptable to global time zones for seamless communication.
I constantly try to improve
My tech stack
NextReactTailwind CSS
ExpressNestJSPostgreSQLMySQL
Passionate about building clean, reliable, and bug-free digital products.
Building modern web applications
Focused on performance, scalability, and Product Quality.
Ready to build your next project?
Web Development
A small selection of recent projects
Selected web development work built for performance and scale.
Lumina Wear: Scalable & High-Conversion Fashion eCommerce Platform
Lumina Wear merupakan platform eCommerce fashion yang dikembangkan dengan fokus pada performa, pengalaman pengguna, dan kemudahan pengelolaan produk. Website dirancang untuk menghadirkan tampilan yang modern sekaligus didukung fondasi teknis yang optimal agar mampu mendukung kebutuhan bisnis yang terus berkembang. ## Key Features * Katalog produk fashion yang responsif dan mudah dikelola. * Struktur WooCommerce yang ringan dan efisien. * Optimasi performa untuk meningkatkan kecepatan akses halaman. * SEO-friendly untuk mendukung visibilitas di mesin pencari. * Arsitektur yang siap dikembangkan untuk kebutuhan bisnis di masa depan. ## Technical Implementation ### Custom WooCommerce Architecture Menggunakan struktur yang terorganisir dengan baik untuk mengurangi ketergantungan pada plugin yang tidak diperlukan, sehingga website tetap stabil, mudah dipelihara, dan memiliki performa yang optimal. ### Performance Optimization Menerapkan optimasi Core Web Vitals melalui kompresi aset, penggunaan format gambar WebP, lazy loading, serta pengelolaan resource yang efisien untuk mempercepat waktu muat halaman. ### Scalability Membangun fondasi sistem yang memungkinkan penambahan produk, kategori, integrasi pembayaran, pengiriman, maupun fitur tambahan lainnya tanpa mengganggu performa website. ### SEO Optimization Mengimplementasikan struktur URL, metadata, internal linking, dan hierarki konten yang mendukung indeksasi mesin pencari serta meningkatkan potensi trafik organik. ## Result Berhasil menghadirkan platform eCommerce yang cepat, responsif, dan mudah dikelola. Kombinasi antara desain visual yang modern dan optimasi teknis menghasilkan pengalaman belanja yang lebih nyaman sekaligus mendukung pertumbuhan bisnis secara berkelanjutan.
Hoo Bank: The Next Generation Payment Method
HooBank Landing Page merupakan website statis yang dikembangkan untuk menampilkan layanan digital finance dengan desain modern, responsif, dan berfokus pada pengalaman pengguna. Proyek ini mengutamakan visual yang menarik, performa tinggi, serta tata letak yang optimal untuk berbagai ukuran perangkat. ## Key Features * Responsive design untuk desktop, tablet, dan mobile. * Modern user interface dengan elemen visual interaktif. * Smooth scrolling dan navigasi yang intuitif. * Struktur komponen yang modular dan mudah dikembangkan. * Optimasi performa untuk pengalaman pengguna yang lebih baik. ## Technical Implementation ### Responsive Frontend Development Membangun antarmuka yang dapat menyesuaikan berbagai ukuran layar dengan pendekatan mobile-first untuk memastikan konsistensi tampilan pada seluruh perangkat. ### Component-Based Architecture Menggunakan struktur komponen yang terorganisir untuk meningkatkan maintainability, reusability, dan efisiensi pengembangan. ### Performance Optimization Mengoptimalkan aset visual, struktur layout, dan rendering halaman untuk menghasilkan waktu muat yang cepat serta pengalaman navigasi yang lebih responsif. ### Modern UI Implementation Mengimplementasikan desain modern dengan kombinasi tipografi, gradien, animasi ringan, dan visual 3D untuk meningkatkan daya tarik serta engagement pengguna. ## Result Berhasil mengembangkan landing page yang modern, responsif, dan memiliki performa yang baik. Website mampu menyampaikan informasi produk secara efektif dengan pengalaman pengguna yang optimal di berbagai perangkat.
Shortail Digital Messaging API
Platform komunikasi berbasis WhatsApp Business API yang dikembangkan untuk membantu perusahaan mengelola percakapan pelanggan, kontak, kampanye pesan, chatbot, hingga alur komunikasi bisnis dalam satu sistem yang terintegrasi. Proyek ini dirancang dengan fokus pada efisiensi operasional, pengelolaan akses pengguna yang fleksibel, serta otomatisasi proses komunikasi secara real-time. ## Tech Stack - Frontend: Next.js, TypeScript - Backend: NestJS, TypeScript - Database: PostgreSQL - Integrasi: WhatsApp Business API, Webhook real-time - Arsitektur: RESTful API dengan sistem role-based access control (RBAC) ## Fitur yang Diimplementasikan - Integrasi WhatsApp Business API — pengiriman dan penerimaan pesan pelanggan secara real-time. - Role & Permission Management — hak akses granular berdasarkan peran (Admin, Owner, Supervisor, Agent, Client). - Manajemen Chat & Kontak — pengelolaan percakapan, distribusi kontak, dan monitoring aktivitas komunikasi tim. - Campaign & Messaging Management — pengiriman pesan massal, pengelolaan template pesan, dan otomatisasi alur komunikasi. - Dynamic Access Control — tampilan menu dan fitur menyesuaikan hak akses pengguna secara otomatis. - Real-time Webhook Integration — sinkronisasi data pesan dan aktivitas pengguna langsung ke backend. ## Hasil Akhir Platform komunikasi yang scalable dan mudah dikelola berhasil dibangun dengan sistem akses berbasis peran yang fleksibel. Solusi ini mempercepat proses penanganan percakapan pelanggan, meningkatkan efisiensi kerja tim, serta mempermudah pengelolaan komunikasi bisnis dalam skala organisasi.
Bloom & Flow: High-Performance Florist Ecosystem
Bloom & Flow merupakan website florist modern yang dibangun menggunakan arsitektur Headless CMS untuk menghadirkan pengalaman pengguna yang cepat, responsif, dan mudah dikelola. Dengan memisahkan backend dan frontend, platform ini dirancang untuk memberikan fleksibilitas pengelolaan konten sekaligus performa yang optimal bagi pengunjung. ## Key Features * Arsitektur Headless CMS dengan pemisahan backend dan frontend. * Katalog produk yang cepat, responsif, dan SEO-friendly. * Manajemen konten yang fleksibel untuk produk, kategori, dan artikel. * Optimasi gambar otomatis untuk meningkatkan performa website. * Struktur API yang siap untuk integrasi layanan pihak ketiga. ## Technical Implementation ### Headless Architecture Mengimplementasikan pendekatan Headless CMS dengan memisahkan pengelolaan konten dan tampilan website. Arsitektur ini memberikan fleksibilitas lebih tinggi dalam pengembangan, pemeliharaan, dan skalabilitas sistem. ### Performance Optimization Mengoptimalkan performa website melalui Server-Side Rendering (SSR), Incremental Static Regeneration (ISR), lazy loading, serta optimasi aset untuk menghasilkan waktu muat halaman yang lebih cepat dan pengalaman pengguna yang lebih baik. ### Content Management System Membangun sistem manajemen konten yang memungkinkan pengelolaan produk, kategori, dan artikel secara terpusat tanpa memerlukan perubahan pada sisi frontend. ### API-Driven Development Menggunakan pendekatan API-first untuk memastikan pertukaran data yang efisien antara backend dan frontend, sekaligus mempermudah integrasi fitur tambahan seperti pembayaran online, manajemen pesanan, maupun layanan pihak ketiga lainnya. ### SEO Optimization Mengimplementasikan struktur URL yang ramah mesin pencari, metadata yang terorganisir, serta strategi rendering modern untuk meningkatkan visibilitas website pada hasil pencarian. ## Result Berhasil menghadirkan website florist dengan performa tinggi, pengalaman pengguna yang responsif, serta sistem manajemen konten yang fleksibel. Arsitektur yang digunakan memungkinkan pengembangan fitur baru dan skalabilitas sistem secara lebih efisien di masa mendatang.
Quality Assurance
Selected QA case studies
Test plans, bugs caught, and coverage improved on real production apps.
API + Automation Testing
Shortail Digital Agency · Customer Communication & Marketing
QA Messaging API Testing
Comprehensive QA portfolio project focused on testing a Messaging & CRM API system used for customer communication and campaign management.
3 Modules
API test coverage for core messaging & campaign features
SeleniumPostmanChrome Dev Tools
Professional Experience
How I Deliver Results
Plan & Scope
I start by analyzing project requirements, defining user stories, and identifying potential edge cases. This phase sets the foundation, scope, and a clear test plan before any code is written.
Build & Develop
I build clean, scalable features using modern frameworks like Next.js and NestJS, following the architecture and requirements defined in the planning phase.
Test & Validate
I run manual and automated testing across functional, regression, and API layers to catch issues early, before they ever reach real users.
Deploy & Support
I deploy the finished product, monitor its performance, and stay reachable for fast fixes and iteration after launch.