CraftMySite - Visual Website Builder
A visual, drag-and-drop website builder that enables developers to create responsive websites using Tailwind CSS without writing code. Users can build websites by selecting pre-built sections, customizing styles and content through an intuitive click-to-edit interface, and export production-ready HTML or JSX code.
Project Summary
Built a visual website builder with real-time preview, JSON-based DOM management, and HTML/JSX export capabilities, featuring undo/redo functionality, API-driven style customization, and Google OAuth authentication.
Tech Stack
Key Features
Visual DOM Editor with JSON-based structure
Real-time Preview
Pre-built Section Library
Click-to-Edit Interface
Style Customization Panel
Code Export (HTML/JSX)
What Makes This Unique
JSON-Based DOM Architecture
Recursive Element Operations
API-Driven Style System
Dual Format Export
State History Management
ContentEditable Integration
Complexity & Challenges Solved
Complex State Management
Recursive Tree Traversal
History/Undo-Redo Implementation
Real-time Synchronization
API Integration
Authentication & Authorization