Builder.io (Self-Hosted)

intermediate

Visual headless CMS and page builder with drag-and-drop.

Overview

Builder.io is a visual headless CMS and drag-and-drop page builder that enables teams to create and manage digital experiences without traditional development overhead. Originally developed as a SaaS platform, Builder.io provides a visual interface for content creation while maintaining the flexibility of a headless architecture, supporting multiple frontend frameworks including React, Vue, Angular, and Svelte. The platform combines visual editing capabilities with programmatic control, allowing marketers to create landing pages and content while developers maintain full control over the underlying codebase. This self-hosted deployment provides organizations with complete control over their content management infrastructure while leveraging Builder.io's powerful visual editing capabilities. The stack operates through a single container that serves the Builder.io interface and API, connecting to your frontend applications through Builder's SDKs. This configuration eliminates dependencies on external SaaS services while maintaining the visual editing experience that makes Builder.io valuable for content teams. This setup is particularly valuable for organizations requiring data sovereignty, custom integrations, or air-gapped environments where SaaS solutions aren't viable. Marketing teams benefit from the visual drag-and-drop interface for rapid content creation, while development teams retain control over deployment, security, and integration with existing systems. The self-hosted approach also enables unlimited usage without per-seat licensing costs typical of SaaS content management solutions.

Key Features

Visual drag-and-drop page builder with real-time preview and WYSIWYG editing
Built-in A/B testing engine for content optimization and conversion tracking
Multi-framework SDK support for React, Vue, Angular, Svelte, and Qwik applications
Component-based content architecture with reusable design system elements
Advanced personalization engine based on user attributes and behavior
Content versioning and approval workflows for team collaboration
Custom component registration for brand-specific design elements
API-first architecture supporting headless content delivery to multiple channels

Common Use Cases

1Enterprise marketing teams creating landing pages without developer bottlenecks
2E-commerce platforms requiring rapid A/B testing of product pages and checkout flows
3Media companies managing content across multiple websites and mobile applications
4SaaS companies optimizing conversion funnels and onboarding experiences
5Educational institutions building course content and interactive learning materials
6Government agencies requiring on-premises content management with strict data controls
7Development agencies providing white-label content management solutions to clients

Prerequisites

Valid Builder.io API key for authentication and service activation
Minimum 2GB RAM and 1 CPU core for optimal visual editor performance
Port 3000 available for web interface access and API communication
Understanding of headless CMS concepts and SDK integration patterns
Frontend application configured with appropriate Builder.io SDK for content delivery
Basic knowledge of component-based design systems and content modeling

For development & testing. Review security settings, change default credentials, and test thoroughly before production use. See Terms

docker-compose.yml

1services: 
2  builder: 
3    image: builderio/builder:latest
4    container_name: builder
5    restart: unless-stopped
6    environment: 
7      BUILDER_API_KEY: ${BUILDER_API_KEY}
8    ports: 
9      - "3000:3000"
10    networks: 
11      - builder-network
12
13networks: 
14  builder-network: 
15    driver: bridge

.env Template

.env

1BUILDER_API_KEY=your-api-key

Usage Notes

1Docs: https://www.builder.io/c/docs/developers
2Access at http://localhost:3000
3Visual drag-and-drop page builder
4A/B testing and personalization built-in
5SDK for React, Vue, Angular, Svelte, Qwik
6Builder.io is primarily SaaS; limited self-host options

Quick Start

terminal

1# 1. Create the compose file
2cat > docker-compose.yml << 'EOF'
3services:
4  builder:
5    image: builderio/builder:latest
6    container_name: builder
7    restart: unless-stopped
8    environment:
9      BUILDER_API_KEY: ${BUILDER_API_KEY}
10    ports:
11      - "3000:3000"
12    networks:
13      - builder-network
14
15networks:
16  builder-network:
17    driver: bridge
18EOF
19
20# 2. Create the .env file
21cat > .env << 'EOF'
22BUILDER_API_KEY=your-api-key
23EOF
24
25# 3. Start the services
26docker compose up -d
27
28# 4. View logs
29docker compose logs -f

One-Liner

Run this command to download and set up the recipe in one step:

terminal

1curl -fsSL https://docker.recipes/api/recipes/builder-io/run | bash

Troubleshooting

Builder interface shows 'Invalid API Key' error: Verify BUILDER_API_KEY environment variable is set correctly and matches your Builder.io account credentials
Visual editor fails to load or shows blank screen: Check browser console for CORS errors and ensure your domain is whitelisted in Builder.io settings
Content changes not appearing in frontend application: Verify SDK configuration and ensure your app is polling for content updates or webhooks are properly configured
Drag-and-drop components not saving: Increase container memory allocation as Builder.io requires sufficient RAM for complex page operations and component rendering
A/B test results not tracking: Confirm analytics integration is properly configured and tracking scripts are included in your frontend application
Custom components not appearing in editor: Check component registration in Builder.io settings and verify component definitions are properly formatted and accessible

Community Notes

Loading notes...

Download Recipe Kit

Get all files in a ready-to-deploy package

Includes docker-compose.yml, .env template, README, and license

Components

builder

Related Recipes

Ad Space

Shortcuts: C CopyF FavoriteD Download