# How to Vibe Code Your Own Umso (and Stop Paying for It)

> The Website Builder For Everyone

- Site: https://umso.com
- Category: Website Builder
- Verdict: **Solid side project** (68/100 vibecodeable)
- Estimated effort: 2-3 weeks part-time

## Verdict

Build a solid subset with a modern AI stack, but skip the complex drag-and-drop WYSIWYG editor if you want to finish.

Replicating Umso's prompt-to-site generator and component library is entirely viable with Next.js and LLM structured outputs. However, building a rock-solid, production-grade visual page builder that handles component nesting, inline editing, and state management without breaking is notoriously tedious and eats up weeks of debugging. Furthermore, building your own custom domain management and wildcard DNS routing pipeline introduces unexpected infrastructure friction.

### What you can't replicate

- Umso's existing community and brand equity
- Years of battle-tested edge routing for user-published subdomains

## What it does

Streamlined, AI-assisted website builder explicitly targeted at early-stage startups and solo founders for rapid landing pages, marketing sites, and basic content blogs.

### Core features

- Prompt-based AI site generator (layout, structure, and copy)
- Constrained component-based block editor
- Custom domain mapping and SSL provisioning
- Built-in lead capture forms
- Privacy-first analytics tracking
- GDPR-compliant cookie consent banners
- Multilingual translation support
- Static site publishing engine

## The business

### Pricing

- Free Plan: $0 — Homepage only with blog, free subdomain, branding, and basic analytics.
- Basic Plan: $7/mo — Perfect for landing pages, billed yearly.
- Pro Plan: $20/mo — All features included, billed yearly.

Founded 2019.
Team size: Micro-team.

## The hard parts

- Building a buttery-smooth block-based visual website editor in the browser
- Orchestrating reliable JSON-structured AI generation for multi-page layouts
- Managing custom domain SSL provisioning and wildcard routing at scale
- Handling localized multilingual content synchronization across static exports

## How to vibe code Umso

### Prerequisites

- Node.js (free): Required runtime for modern JavaScript and Next.js development.
- GitHub (free): Source control and seamless integration with Vercel deployment pipelines.

### Recommended AI tools

- Claude Code: Handles multi-file scaffolding, component generation, and iterative debugging straight from the terminal.
- Cursor: Ideal for fine-tuning individual UI component blocks and Tailwind styling adjustments.

### Stack

- Frontend: Next.js
- Backend: Next.js API Routes
- Database: Turso
- Auth: better-auth
- Payments: None (Personal use clone)
- Other: Vercel AI SDK, Tailwind CSS, Plausible

### Hosting

- Vercel (Hosting the primary web builder application and serving published user sites via wildcard domains): $0-20/mo
- Turso (Storing user site configurations, pages, block trees, and form submissions): $0/mo

### Build guide

1. **Scaffold Next.js App & Database Schema** — Initialize a fresh Next.js project with Tailwind CSS, configure Turso for SQLite data persistence, and set up better-auth for user authentication.

```
Create a new Next.js project configured with App Router and Tailwind CSS. Set up Turso database client using Drizzle ORM with tables for 'users', 'sites' (id, userId, name, subdomain, customDomain, settings), and 'pages' (id, siteId, slug, title, contentJson). Integrate better-auth for email/password authentication. Ensure all configuration files are complete and ready for local development.
```

2. **Build AI Site Generator Workflow** — Implement an AI prompt intake screen that calls an LLM via the Vercel AI SDK to generate a structured JSON layout of marketing sections.

```
Create an AI site generator page with a clean prompt input form ('Describe your startup or project'). Using the Vercel AI SDK and Anthropic API, write a server action that prompts the model to return a strictly typed JSON payload representing a multi-section landing page (hero, features, testimonials, footer) complete with tailored copy. Store the generated site structure in the Turso database linked to the authenticated user.
```

3. **Develop Component-Based Rendering Engine** — Build a modular frontend block renderer that dynamically renders landing page sections from the stored JSON layout.

```
Build a dynamic component renderer in Next.js that takes the site's JSON layout blocks (Hero, FeatureGrid, PricingTable, FAQ, Footer) and renders them using polished Tailwind CSS components. Create a visual dashboard where users can view their generated pages, reorder sections, and edit text inline. Ensure responsive design works across mobile and desktop viewports.
```

4. **Implement Lead Capture Forms & Analytics** — Add native lead capture form submission handlers and lightweight privacy-first analytics tracking for published sites.

```
Add a backend API endpoint to handle lead capture form submissions from published user sites, storing submissions in a 'leads' table linked to each site with a dashboard view to inspect them. Implement a lightweight, cookie-free analytics tracker script that records page views and referrers when visitors load published user sites, displaying aggregate stats in the user dashboard.
```

5. **Publishing Engine & Custom Domain Routing** — Build dynamic subdomain and custom domain routing handlers to serve published user sites directly from the database.

```
Implement a Next.js wildcard middleware and dynamic catch-all route ([...slug]/page.tsx) that inspects the incoming request hostname or subdomain (e.g., mysite.umso.co or custom domain), queries the Turso database for the matching site configuration, and renders the published static site layout dynamically with high performance and correct SEO meta tags.
```

### Cost vs paying

**Starting costs (one-time):**

- Custom Domain (Optional): $12/yr
- Total: ~$12 one-time

**Ongoing costs (monthly):**

- Vercel Hosting: $0-20/mo
- Turso Database: $0/mo
- LLM API Credits (AI Generation): ~$3/mo
- Total: ~$3-23/mo

- Paying for the SaaS instead: $20/mo (Pro Plan)
- Build time: 18-25 hours
- AI tool credits: $20/mo (Claude Pro / Cursor)
- Break-even: Roughly parity with Pro plan, but built for learning and absolute control.

## Sources

- [Umso Official Website & Pricing Data](https://umso.com)
- [Umso Security Policy & AWS Infrastructure Documentation](https://umso.com)