Explore a curated collection of my work in fullstack architecture, AI engineering, and interface design.
Shopmart E-Commerce Platform
📘 Project Overview Shopmart is a custom-built E-Commerce platform designed to provide a modern, scalable, and API-driven shopping experience. Built using Node.js with Express as the backend, Shopmart enables users to browse products, manage carts, place orders, and handle transactions — all powered by secure authentication and modular architecture. This project was designed to be fully headless and integration-ready, allowing it to serve both frontend websites and third-party services like chatbots (Telegram Bot) or mobile apps
🤖 Automated Hotel Customer Service Bot with N8N
This project is a smart and automated hotel customer service system built using N8N, designed to streamline the guest experience through a conversational Telegram Bot. It allows users to chat with an AI-powered assistant to check room availability, inquire about pricing, and even place a booking — all without human intervention. It leverages AI and integrations with popular tools like Google Sheets and MongoDB to offer a seamless, real-time solution.
CMS For GWT Company Profile
To complement the GWT Company Profile website, I developed a custom Content Management System (CMS) that allows the internal team to manage and update website content easily — without relying on developers for every change. This CMS empowers non-technical users to modify key content areas such as the About section, services, team profiles, and client information dynamically. The goal was to create a lightweight yet powerful CMS tailored specifically for the company's structure and content flow.
Web Company Profile PT GWT
This project was developed for PT Growth With Technology (GWT), an Indonesian tech company formerly known as CIB Productions. As part of their rebranding initiative in 2025, GWT needed a modern, digital company profile website to showcase their identity, services, and team to potential clients and partners. The main objective was to deliver a clean, professional, and responsive website that not only reflects GWT’s credibility but also positions them as a forward-thinking digital solutions provider.
Automated Daily Email Summary Using n8n and DeepSeek AI
This project involves the development of an automated email summary system utilizing n8n, a powerful workflow automation tool, combined with DeepSeek AI for natural language processing. The system is designed to streamline email management by automatically extracting, summarizing, and sending daily email summaries every morning at 9 AM. The primary goal of this project is to improve productivity and optimize email handling by reducing the manual effort required to read and process incoming emails. The automation ensures that key information is highlighted and delivered promptly without the need for human intervention.
NexDo — Smart Task Manager
NexDo is a powerful yet minimalistic task management web application designed to help individuals and teams stay organized and productive. Built with Next.js and TypeScript, it offers a seamless user experience for planning, tracking, and completing tasks. It features a clean interface, fast performance, and essential productivity tools like calendars, kanban boards, analytics, and CRUD functionality. With a focus on responsiveness and user-centric design, NexDo is optimized for both desktop and mobile platforms.
Word To PDF Converter
This web-based tool offers seamless conversion between Word (.doc, .docx) and PDF formats. I developed this application to provide users with an efficient and accessible alternative to desktop conversion software. The tool features a clean, intuitive interface that simplifies the document conversion process while maintaining document formatting integrity. Built with Next.js for robust server-side processing and TypeScript for type safety, the application delivers reliable performance with optimized conversion algorithms. The Shadcn UI components create a responsive, visually appealing experience across all devices. The server-side conversion logic handles multiple conversion methods with automatic fallbacks, ensuring successful conversions even with complex documents. This project required balancing technical functionality with user experience to create a practical tool that serves everyday document conversion needs.
Nextgen
Nextgen is a dynamic software house specializing in comprehensive digital services for businesses across various industries. I designed and developed their corporate web platform that effectively showcases their diverse service offerings while providing an intuitive user experience for potential clients. The website serves as both a powerful marketing tool and a client engagement portal, highlighting Nextgen's expertise in software development, web solutions, mobile applications, cloud services, and digital transformation consulting. Built with a modern technology stack including Next.js for superior performance and React.js for dynamic interactive components, the site delivers a seamless experience with impressive loading speeds. Tailwind CSS provides the responsive design framework ensuring perfect display across all devices, while GSAP powers smooth animations and transitions that enhance the user experience. The backend infrastructure is deployed on carefully optimized Nginx servers running on Ubuntu, configured for maximum reliability and security. The architecture features an interactive service showcase, client portfolio gallery, streamlined contact system, and a secure client portal for project management and communication. This project required balancing professional presentation with technical functionality to effectively communicate Nextgen's capabilities and establish them as a trusted partner in the competitive digital services market.
Vancloud
Vancloud is a specialized division of Vntagelabs focused on providing premium domain registration and hosting services. I designed and developed their dedicated web platform that seamlessly combines an intuitive domain search interface with comprehensive hosting solutions and account management capabilities. Built with a modern technology stack including Next.js for superior performance and React.js for dynamic interactive components, the site delivers a smooth user experience for customers seeking domain services. Bootstrap 5 provides the responsive framework ensuring perfect display across all devices, while Swiper.js powers the elegant presentation of hosting plans and domain pricing tiers. The backend infrastructure is deployed on carefully optimized Nginx servers running on Ubuntu, configured for maximum reliability and security—critical factors for a domain service provider. The architecture features real-time domain availability checking, streamlined purchase flows, and a responsive client dashboard for managing domain portfolios. This project required balancing technical functionality with an approachable user interface to demystify domain registration and management for customers while establishing Vancloud as a trusted, professional service within the competitive domain hosting market.
Vntagelabs
Vntagelabs started as a specialized software house offering comprehensive web development, UI/UX design, and digital transformation services. I designed and developed their corporate website, creating a compelling digital presence that effectively showcases their expertise and portfolio. The website employs a modern tech stack with Next.js for optimal performance and SEO, React.js for dynamic interactive components, and Bootstrap 5 for responsive design implementation. A key feature is the immersive project showcase utilizing Swiper.js to create smooth, touch-friendly carousels that highlight their impressive portfolio of work. The backend is deployed on a highly optimized Nginx server running on Ubuntu, configured for maximum performance and security with proper caching strategies and SSL implementation. The architecture prioritizes page load speed and user experience while ensuring the site remains easily maintainable and scalable as the company grows. This project required careful attention to visual aesthetics and performance optimization to present Vntagelabs as a cutting-edge technology partner capable of delivering exceptional digital products for their clients.
Bitunix Short Links
A high-performance URL shortening and analytics platform built to enterprise specifications, combining sophisticated backend capabilities with an intuitive frontend experience. The system architecture employs Next.js for the client application, delivering lightning-fast interactions through strategic use of static generation, server-side rendering, and client-side state management, while the Laravel backend provides industrial-strength reliability, security, and scalability. The platform includes a comprehensive suite of advanced features including detailed click analytics with geographic and device breakdowns, customizable branded domains, QR code generation, expiration controls, password protection, and A/B testing capabilities for marketing campaigns. Technical innovations include a distributed caching system that enables sub-10ms response times even under heavy load, sophisticated rate limiting and abuse prevention mechanisms, and a real-time analytics pipeline that processes click data without affecting redirect performance. The modular, extensible architecture allows for rapid implementation of new features while maintaining backward compatibility, making Bitunix Short Links an evolving platform that scales with customer needs while maintaining exceptional performance metrics even at enterprise traffic volumes.
Advanced Web Image Editor
A professional-grade web-based image editing application that brings sophisticated photo manipulation capabilities to the browser, eliminating the need for resource-intensive desktop software while maintaining high-quality output. Engineered with Next.js and React for optimal performance, the editor leverages the HTML5 Canvas API and custom-built pixel manipulation algorithms to provide a comprehensive suite of editing tools including advanced color correction, layer-based composition, non-destructive filters, and precision masking capabilities. The user interface, crafted with ShadCN UI components and Tailwind CSS, presents complex functionality through an intuitive, context-sensitive interface that adapts to both desktop precision workflows and touch-optimized mobile interactions. Technical innovations include the development of a memory-efficient rendering pipeline that maintains smooth performance even with high-resolution images, client-side image optimization algorithms that intelligently balance quality and file size, and platform-specific export options that respect device constraints. Extensive cross-browser testing and optimization ensure consistent results regardless of platform, making professional image editing accessible to users across devices without compromising on quality or capability.
Octans Finance
A sophisticated financial management platform for Octans that revolutionizes how the organization visualizes, analyzes, and acts on complex financial data across multiple business units. Built on a modern Next.js framework with TypeScript for bulletproof type safety, the application features a comprehensive suite of interactive data visualization components powered by Chart.js, enabling stakeholders to identify trends and make data-driven decisions with confidence. The system architecture prioritizes both security and performance, implementing industry-leading encryption protocols for sensitive financial data while utilizing advanced caching strategies and code-splitting techniques to ensure rapid dashboard loading even with massive datasets. Beyond standard financial reporting, the platform incorporates predictive analytics modules that leverage historical data to forecast cash flow trends, budget variances, and potential investment opportunities. The implementation process included meticulous integration with existing accounting systems, custom API development for real-time data exchange, and the creation of a flexible permission structure that allows for granular control over sensitive financial information access.
ERP Boxity
A comprehensive enterprise resource planning solution that transformed Boxity's fragmented operational infrastructure into a unified, data-driven ecosystem connecting finance, inventory, sales, procurement, and human resources. The system architecture employs a sophisticated React-Redux frontend communicating with a highly optimized Node.js backend, with all data persisted in a carefully designed PostgreSQL database that ensures data integrity while enabling complex analytical queries. Key innovations include a dynamic workflow engine that adapts to changing business processes without requiring code changes, a powerful permissions system that provides granular access control across organizational hierarchies, and a customizable reporting module that allows non-technical users to extract meaningful insights from operational data. The implementation process involved extensive stakeholder collaboration, meticulous data migration from legacy systems, and phased deployment to minimize operational disruption. Post-implementation metrics demonstrated a 40% increase in operational efficiency, 28% reduction in inventory carrying costs, and 65% faster month-end closing process, delivering substantial ROI while positioning Boxity for scalable future growth.
Patungan CRM V1
The inaugural customer relationship management system for Patungan that revolutionized their client interaction process by transitioning from fragmented spreadsheets to a cohesive, centralized platform. This foundational system introduced critical functionality including contact management, interaction tracking, opportunity pipeline visualization, and basic reporting capabilities tailored to the company's unique workflow requirements. Leveraging Angular's component architecture paired with Firebase's real-time database capabilities, the platform delivered a responsive interface that worked seamlessly across devices while maintaining data consistency. The implementation included comprehensive data migration from legacy systems, custom user permission structures, and an intuitive dashboard that reduced the learning curve for non-technical staff. This pioneering solution established the technical foundation and user experience principles that would guide the evolution of Patungan's customer management ecosystem, setting the stage for the more advanced features implemented in Version 2.
Patungan CRM V2
A comprehensive upgrade to Patungan's customer relationship management platform, transforming their legacy system into a modern, feature-rich solution that addresses complex enterprise requirements while maintaining an intuitive user experience. This second-generation CRM implements a microservices architecture built on the MERN stack (MongoDB, Express, React, Node.js), enabling seamless scalability and future extensibility. The system features real-time data synchronization across departments, intelligent workflow automation, and advanced data visualization dashboards that provide actionable insights for decision-makers. A significant technical achievement was the development of a sophisticated data migration pipeline that allowed for zero-downtime transition from the legacy system while maintaining data integrity and historical records. Post-implementation metrics showed a 42% increase in team productivity and a 38% reduction in customer response times, directly contributing to improved customer satisfaction scores and higher retention rates.
Emamarkets Landing Page
A comprehensive redesign of the Emamarkets digital presence, employing a mobile-first strategy to address the company's rapidly growing mobile user base while enhancing overall brand perception. The project began with extensive user research and competitive analysis to identify critical pain points in the existing interface, followed by the creation of a visually striking design system that maintains consistency across all touchpoints. By implementing advanced GSAP animations that respond intelligently to user interaction patterns, the new landing page creates memorable experiences that significantly increase engagement metrics. The architecture prioritizes performance through careful optimization of JavaScript execution and asset loading, resulting in a 40% improvement in page load times and contributing directly to the 25% reduction in bounce rates observed post-launch. This project represents a perfect synthesis of aesthetic appeal and technical excellence, delivering measurable business results while elevating the brand's market position.
DUHANI Landing page
A comprehensive, high-conversion landing page for DUHANI designed to transform visitor traffic into qualified leads through strategic UX principles and data-driven design decisions. The project involved extensive market research to identify key user pain points and motivations, followed by the development of a clean, visually compelling interface that guides visitors through an optimized conversion funnel. By implementing sophisticated Framer Motion animations that highlight key product benefits without compromising load times, the design achieves the perfect balance between visual appeal and performance. The architecture employs a component-based approach with React and Tailwind CSS, allowing for rapid iterations based on A/B testing results and enabling the client to achieve a remarkable 35% increase in conversion rates within the first month post-launch.