HubSmith
Desktop toolkit for local HubSpot CMS development with live preview and AI-assisted component creation
HubSmith is a desktop application that brings HubSpot CMS development to your local machine. It enables developers to browse, preview, and edit HubSpot themes, modules, and pages locally with live reload — bridging the gap between HubSpot's cloud-based Design Manager and modern local development workflows.
By downloading HubSpot assets locally, HubSmith unlocks the ability to use AI-powered coding tools like Claude Code for creating and modifying HubSpot components — something impossible when working directly in the HubSpot web editor.
HubSpot CMS development traditionally happens in the cloud through the Design Manager — a web-based editor. This creates friction for developers who prefer local tooling, version control, and AI-assisted development workflows.
Key Pain Points:
- →No local preview for HubSpot themes and modules without deploying to HubSpot
- →HubL templating language requires HubSpot server for rendering — no local emulation available
- →AI coding tools cannot access HubSpot's web-based editor, limiting productivity gains
- →Managing multiple themes and assets across projects is cumbersome in the cloud UI
- →No efficient way to browse and manage Design Manager resources locally
HubSmith provides a desktop application that syncs HubSpot assets locally, emulates HubL template rendering via Nunjucks, and offers live preview with hot reload. This creates a familiar local development experience while maintaining full compatibility with HubSpot CMS.
Core Capabilities:
- ✓Local HubL template rendering powered by Nunjucks engine
- ✓Live reload preview for themes and modules during editing
- ✓File synchronization between local filesystem and HubSpot
- ✓Page management — create, duplicate, and filter pages
- ✓Cross-platform desktop app (Electron + Tauri) for Windows, macOS, and Linux
- ✓Enables AI-assisted development by making assets available on local filesystem
Frontend Application
Modern React UI built with Vite for fast development and Tailwind CSS for styling. TypeScript throughout for type safety.
Backend & Rendering
Express server handles HubL template rendering using Nunjucks as an emulation layer, providing local preview without deploying to HubSpot.
Desktop Platforms
Dual desktop framework support — Electron for full cross-platform compatibility, Tauri as a lightweight alternative for Linux.
HubSpot Integration
Authenticated API client for theme and page management, bidirectional file sync, and local HubL template emulation.
CI/CD & Distribution
GitLab CI/CD pipeline with automated builds for desktop installers across platforms. Docker support for web mode.
HubL Emulation via Nunjucks
HubSpot's HubL templating language is closely related to Jinja2/Nunjucks. HubSmith leverages this similarity to render templates locally, enabling preview without HubSpot server access.
Bidirectional File Sync
Themes and modules live in user project directories on the local filesystem. Changes sync bidirectionally between local files and HubSpot, keeping both environments in sync.
AI-Ready Local Workflow
By bringing HubSpot assets to the local filesystem, HubSmith enables AI coding assistants like Claude Code to read, understand, and modify HubSpot components — unlocking AI-assisted HubSpot development.
Dual Desktop Framework
Supporting both Electron and Tauri gives users the choice between full-featured cross-platform support and a lightweight, resource-efficient alternative.
- →Template Emulation Has Limits — Nunjucks covers most HubL features, but some advanced tags and global partials require workarounds or graceful degradation
- →Local Dev Unlocks AI Tooling — Moving assets from cloud to local filesystem was the key enabler for AI-assisted development workflows
- →Desktop Apps Need Multiple Targets — Supporting both Electron and Tauri addresses different user needs (features vs. performance)
- →Developer Experience Drives Adoption — Live reload and familiar local workflows dramatically reduce friction compared to cloud-only editing
Local-First Development
Enabled full local HubSpot CMS development workflow with live preview, eliminating the need to constantly deploy to HubSpot for testing.
AI-Powered Component Creation
Unlocked AI-assisted HubSpot development by making templates and modules accessible to tools like Claude Code.
Cross-Platform Distribution
Desktop app available on Windows, macOS, and Linux with automated CI/CD builds for each platform.
Efficient Asset Management
Streamlined browsing and management of HubSpot Design Manager resources from a single desktop interface.