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

> Customer Support for modern companies

- Site: https://productlane.com
- Category: Customer Support & Product Discovery SaaS
- Verdict: **Serious undertaking** (45/100 vibecodeable)
- Estimated effort: 4-6 weeks of focused part-time work

## Verdict

Build a core subset focusing on the ticket-to-Linear workflow, but omnichannel sync and robust RAG will demand weeks of heavy engineering.

Productlane is deceptively complex. While cloning a basic Next.js CRUD app with a feedback board is straightforward, replicating its core value requires orchestrating a live bi-directional GraphQL sync engine with Linear, handling messy inbound email MX records and Slack Events API webhooks, and building a responsive, embeddable JavaScript support widget. An AI coding agent will scaffold the UI and basic database models in hours, but configuring webhook signature verification, handling API rate limits, and debugging streaming RAG responses against Linear issues will require serious manual intervention.

### What you can't replicate

- Productlane's established brand trust and native listing in the Linear Integrations directory
- Real-world distribution across hundreds of high-growth B2B SaaS companies

## What it does

An AI-native customer support and product discovery platform built around Linear, unifying shared inbox, support portal, feedback board, and release intelligence.

### Core features

- Linear bi-directional sync engine (GraphQL API, webhooks, status mapping)
- Omnichannel inbox (email via SendGrid/Postmark inbound parsing, Slack Events API, live chat websockets)
- AI support agent with RAG over help center articles and automated Linear issue routing
- Self-updating knowledge base and help center reflecting shipped issues
- Public feedback portal and roadmap synced with Linear projects
- Release intelligence changelog drafting from completed Linear projects
- Embeddable in-app JavaScript widget with dark mode and custom styling
- Customer & company CRM view with domain auto-association and merging logic

## The business

### Pricing

- Starter: $29/mo — For early-stage teams collecting feedback and building in the open.
- Pro: $59/mo — For growing teams centralizing support and feedback.
- Scale: $99/mo — For larger teams needing customer portals and advanced security.

### Funding

$825,000 raised.
- Bootstrap & angel grants
Investors: WERK1 (accelerator), European angel investors

Founded 2022.
Team size: ~9 employees.

## The hard parts

- Maintaining resilient, low-latency bi-directional sync with Linear without hitting rate limits or state conflicts
- Parsing inbound email streams and mapping fragmented Slack Connect events into unified thread entities
- Engineering a lightweight (50ms UI) embeddable support widget that loads seamlessly inside third-party web apps
- Structuring vector embeddings and RAG access controls so the AI agent only cites authorized workspace data

## How to vibe code Productlane

### Prerequisites

- Node.js (free): Runtime environment for Next.js full-stack development
- GitHub (free): Code repository and deployment CI/CD integration
- Linear Developer Account (free): Required to set up OAuth apps and API keys for bi-directional sync

### Recommended AI tools

- Claude Code: Best-in-class terminal agent for scaffolding full-stack features, database schemas, and API integrations across multiple files.
- Cursor: Ideal for fine-tuning the embeddable widget frontend, Tailwind CSS styles, and interactive UI components.

### Stack

- Frontend: Next.js (App Router, Tailwind CSS, TypeScript)
- Backend: Next.js API Routes & Server Actions
- Database: Neon (Serverless Postgres with pgvector for AI help center embeddings)
- Auth: better-auth
- Payments: None (Personal use clone)
- Other: Vercel AI SDK, Resend, Inngest

### Hosting

- Vercel (Hosting the Next.js app, API routes, and embeddable widget script): $0-20/mo
- Neon (Serverless Postgres database storing tickets, companies, and vector embeddings): $0/mo

### Build guide

1. **Project Scaffolding & Database Schema** — Initialize the Next.js application with Tailwind CSS, configure better-auth with PostgreSQL via Neon, and establish database schemas for users, organizations, threads, messages, help_articles, and linear_mappings.

```
Scaffold a new Next.js project using App Router, TypeScript, and Tailwind CSS. Integrate better-auth with a Neon PostgreSQL connection string. Create Prisma or Drizzle schema definitions for tenants, users, support threads, messages (with sender types: customer, agent, ai), help center articles with pgvector embeddings, and linear_issues mapping tables. Ensure all foreign keys have proper indexing and cascade rules. Set up environment variable validation with Zod.
```

2. **Linear Bi-Directional Integration** — Implement OAuth authentication with Linear and build webhook handlers and GraphQL sync routines to map customer requests directly into Linear issues.

```
Implement Linear OAuth2 authentication flow in Next.js. Build a secure webhook endpoint (/api/webhooks/linear) that verifies HMAC signatures from Linear. Handle issue state change events (e.g., 'completed', 'canceled') to update local database states and trigger automated draft generation. Write a synchronization service using Linear's GraphQL API to fetch teams, projects, and issue labels, allowing support threads to be converted into Linear issues with one click.
```

3. **Omnichannel Inbox & Inbound Parsing** — Build the unified team inbox UI and set up inbound email ingestion and Slack event handlers.

```
Build a fast, keyboard-navigable team inbox interface inspired by Linear (supporting ⌘K shortcuts, filtering by status, and unread badges). Implement an inbound email processing endpoint that parses multipart MIME emails from SendGrid/Postmark webhooks, extracts sender domain information, auto-associates messages with existing companies based on domain matching, and groups them into active threads. Add a basic WebSocket or polling mechanism for real-time inbox updates.
```

4. **AI Support Agent & RAG Pipeline** — Integrate the Vercel AI SDK and Anthropic API to ground automated responses in help center articles and past threads.

```
Implement an AI support agent using the Vercel AI SDK and Anthropic API. When an inbound customer message arrives, query Neon pgvector for relevant help center articles and past resolved threads using cosine similarity. Construct a grounded system prompt providing workspace context and safety guardrails. Generate an AI draft response and present it in the thread sidebar for human review. Include functionality for the AI to automatically create a Linear issue and assign tags if the user query requests a bug fix or feature.
```

5. **Embeddable Support & Feedback Widget** — Develop a lightweight, zero-dependency embeddable JavaScript widget that clients can drop into their web apps for support and feedback.

```
Create a standalone embeddable React/JS widget package that bundles into a single script tag for third-party websites. The widget should render a subtle floating trigger icon (e.g., a question mark badge), expand into a multi-tab panel for Support, Feedback Roadmap, and Changelog, support dark mode and custom HEX color theming via props, and securely authenticate users via HMAC tokens. Ensure bundle size is minimal and styles are fully encapsulated using Shadow DOM to prevent style leakage.
```

6. **Help Center, Roadmap, and Changelog** — Build public-facing knowledge base pages, feedback upvote boards, and automated changelog generation synced with shipped Linear projects.

```
Build public-facing portal pages for the Help Center, Feature Requests roadmap, and Changelog. Implement Markdown rendering with zoomable images for articles. Create an upvoting mechanism for feature requests where users submit their email once. Build an automated release intelligence script that triggers when a Linear project is marked complete, parsing closed issues to draft a changelog post ready for one-click publishing and email broadcast via Resend.
```

### Cost vs paying

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

- Custom domain for personal instance: $12 one-time
- Total: ~$12 one-time

**Ongoing costs (monthly):**

- Vercel Hobby / Pro Hosting: $0-20/mo
- Anthropic API & Neon database credits: $5-10/mo
- Total: ~$15-30/mo

- Paying for the SaaS instead: $59/mo (Pro tier)
- Build time: 45-60 hours
- AI tool credits: $20 (Claude Pro)
- Break-even: Not a financial calculation (build is for personal use and learning)

## Sources

- [Productlane Official Website](https://productlane.com)
- [Productlane Documentation](https://productlane.com/docs)
- [Productlane Pricing](https://productlane.com/pricing)
- [GetLatka - Productlane Company Profile](https://getlatka.com)