Widget Platform
A comprehensive platform that enables users to create, customize, and embed dynamic real-time widgets into any website, built on a scalable monorepo architecture.
🚀 Project Overview
The Widget Platform is a comprehensive, full-stack solution designed to empower users to effortlessly create, customize, and embed dynamic widgets into any website. Built with modern web technologies, the platform ensures seamless integration, real-time updates, and an intuitive user experience without impacting the host website's performance.
🔑 Key Features
Centralized Dashboard: A robust Next.js control panel where users can register, manage their widgets, and tweak visual configurations such as colors, typography, and cloud-hosted media.
Ultra-lightweight Widget Core: Powered by Preact and Vite, the embedded widget is compiled into a single, highly optimized JavaScript file. It is designed to be completely isolated and doesn't conflict with the host website's existing DOM or CSS.
Real-time Synchronization: A dedicated Node.js WebSocket server ensures that any changes made in the dashboard are instantly reflected on the live widget, providing a magical, frictionless editing experience.
Scalable Architecture: Developed as a Monorepo, cleanly separating concerns between the backend API services, the interactive frontend interface, and the embeddable scripts.
🛠️ Technical Highlights
The backend relies on MongoDB (via Mongoose) for robust data persistence, while media assets are securely stored and delivered globally using Cloudflare R2. The user interface is meticulously crafted using the latest React 19, Tailwind CSS v4, and Shadcn UI, guaranteeing top-tier accessibility and a highly polished, modern aesthetic.