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

> Email marketing software for SaaS teams

- Site: https://loops.so
- Category: SaaS / Email Infrastructure
- Verdict: **Serious undertaking** (45/100 vibecodeable)
- Estimated effort: 4-6 weeks of part-time development

## Verdict

Build a simplified single-tenant email workspace for learning, but keep paying for Loops if your startup's revenue depends on inbox placement.

Replicating the CRUD interface, contact lists, and a basic block editor is straightforward with modern AI tools. However, orchestrating durable multi-day workflow timers and maintaining pristine sender reputation without landing in the spam folder requires complex asynchronous background processing and strict compliance handling that will consume dozens of frustrating hours.

### What you can't replicate

- Established IP sender reputation across major mailbox providers
- Zero-downtime queue infrastructure processing millions of transactional messages

## What it does

Unified platform for marketing broadcasts, lifecycle onboarding workflows, and transactional emails built specifically for product-led growth teams.

### Core features

- Contact database with custom attributes and audience segmentation
- Lexical-based markdown block editor for rich email composition
- Visual node-based workflow automation canvas for lifecycle sequences
- Transactional and marketing email API endpoints
- Event-driven background job orchestration for timed delays and filters
- Domain sender verification (SPF, DKIM, DMARC handling)
- MJML-based responsive email rendering engine

## The business

### Pricing

- Early Stage Plan: $0 — For early products and smaller audiences.
- Pro Plan: $49/mo — Starting tier based on 5,000 subscribers.

### Funding

Unknown raised.
- Y Combinator (W22)
Investors: Y Combinator, Angel investors from Lattice, Dropbox, Codecademy, Framer

Founded 2022.
Team size: ~9 employees.

## The hard parts

- Email deliverability and inbox placement reputation management (bounce suppression, feedback loops)
- Cross-client email rendering across Outlook and legacy webmail clients
- Reliable event-driven timer state machine for multi-day workflow branches without dropping events
- High-throughput transactional email queue processing

## How to vibe code Loops

### Prerequisites

- Node.js (free): Required runtime for TypeScript, Next.js, and backend automation worker loops.
- GitHub (free): Source control and CI/CD pipeline triggers.
- Amazon SES Account (Pay-as-you-go ($0.10/1k)): Underlying email delivery relay required for sending actual emails.

### Recommended AI tools

- Claude Code: Best-in-class coding agent for scaffolding multi-file full-stack systems and managing complex schema relations.
- Cursor: Ideal for fine-tuning the visual workflow canvas and Lexical block editor UI components.

### Stack

- Frontend: Next.js with Tailwind CSS and React Flow for the visual automation canvas
- Backend: Next.js API routes paired with Inngest for durable background workflow orchestration
- Database: Neon (Serverless Postgres)
- Auth: better-auth
- Payments: Stripe
- Other: Amazon SES for email transmission, MJML for email template compilation

### Hosting

- Vercel (Hosting the Next.js frontend and serverless API functions): $0-20/mo
- Neon (Serverless Postgres database storing contacts, lists, and workflow definitions): $0/mo

### Build guide

1. **Project Scaffolding and Database Schema** — Initialize the Next.js application with TypeScript, Tailwind CSS, Prisma or Drizzle ORM connected to Neon Postgres, and configure better-auth.

```
Create a new Next.js full-stack application using TypeScript and Tailwind CSS. Configure a Drizzle ORM schema targeting Neon Postgres with tables for 'users', 'contacts' (storing email, first name, last name, subscribed boolean, custom JSON attributes, userGroup), 'audiences', 'events', 'campaigns', and 'workflows'. Integrate better-auth for user authentication. Create a clean dashboard shell with sidebar navigation for Audience, Workflows, Campaigns, and Settings.
```

2. **Contact Management & Segment Engine** — Build the contact list view, contact import flows, and dynamic segmentation filtering based on properties.

```
Build the Audience contact management interface in Next.js. Implement a data table displaying contacts with pagination, search, and filter capabilities based on custom contact properties and subscription status. Create backend API endpoints for creating, updating, and importing contacts via CSV or JSON payload. Add a saved segments builder allowing users to create dynamic filters (e.g., plan equals pro AND subscribed is true).
```

3. **Transactional API and Amazon SES Integration** — Implement the API endpoint for sending transactional emails and integrate Amazon SES for reliable message dispatch.

```
Build a secure REST API endpoint at `/api/v1/emails/send` that accepts a recipient email, template identifier, and dynamic data variables. Integrate the AWS SDK (`@aws-sdk/client-ses`) to transmit emails via Amazon SES. Implement error handling, bounce tracking logging, and API key authentication per workspace. Ensure outgoing emails include compliant unsubscribe headers and footer settings.
```

4. **Visual Workflow Automation Canvas** — Create a node-based visual canvas using React Flow to design lifecycle onboarding sequences and timed event triggers.

```
Implement a visual workflow automation builder using React Flow in the Next.js app. Allow users to drag and drop trigger nodes (e.g., 'userCreated', 'eventReceived'), timer nodes (e.g., 'wait 3 days'), condition filter nodes (e.g., 'filter !activated'), and action nodes ('send email'). Store workflow graph topologies as JSON structures in the database and provide a visual configuration sidebar for each node type.
```

5. **Durable Background Job Orchestration** — Wire up Inngest to execute asynchronous workflow step progressions, scheduled delays, and event listeners.

```
Integrate Inngest into the Next.js backend to handle durable background workflow execution. When an app event hits `/api/v1/events/send`, trigger an Inngest background function that evaluates active workflows listening for that event name. Implement step functions that handle delays (e.g., `step.sleep('3d')`), evaluate branch conditions, and dispatch emails through the SES module when criteria are met.
```

6. **Email Editor & MJML Compilation** — Build a markdown/block-based email composition interface and compile templates to responsive HTML using MJML.

```
Build an email template editor interface using a block-based markdown approach. Integrate an MJML compilation library on the backend to translate component blocks into fully responsive HTML emails that render correctly across legacy email clients like Outlook. Add a preview mode showing desktop and mobile viewport toggles and test send functionality.
```

### Cost vs paying

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

- Custom Domain for sending reputation: $12/yr
- AI Coding Assistant subscription: $20
- Total: ~$32 one-time

**Ongoing costs (monthly):**

- Vercel Hobby/Pro hosting: $0-20/mo
- Amazon SES email volume: ~$0.10 per 1k emails
- Total: ~$5-25/mo

- Paying for the SaaS instead: $49/mo (Pro Plan)
- Build time: 45-60 hours
- AI tool credits: $20 (Claude Pro)
- Break-even: 1 month of paid SaaS subscription

## Sources

- [Loops Official Website](https://loops.so)
- [Loops Pricing Documentation](https://loops.so/pricing)
- [Loops Engineering Blog: Migrating to AWS](https://loops.so/engineering/migrating-to-aws-in-production-with-zero-downtime)