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

> Your team's collective brain

- Site: https://nuclino.com
- Category: SaaS / Knowledge Management
- Verdict: **Solid side project** (62/100 vibecodeable)
- Estimated effort: 3-4 weeks part-time

## Verdict

Build a focused personal wiki and multi-view clone for yourself, but expect weeks of debugging around real-time co-editing state.

Replicating Nuclino as a solo developer is a rewarding exercise, but hitting the exact fluidity of its ProseMirror real-time collaboration engine and multi-view synchronization requires careful state architecture. While AI coding tools can scaffold the UI rapidly, handling WebSockets, conflict resolution, and RAG context retrieval will consume multiple weekends of rigorous debugging.

### What you can't replicate

- The 12,000+ team network and organic adoption loop
- Its battle-tested production stability built over 11 years

## What it does

A unified, real-time collaborative workspace combining internal wikis, document editing, knowledge bases, project management views, and infinite canvases into a single environment.

### Core features

- Hierarchical workspace and item navigation
- Real-time collaborative rich-text document editor
- Multi-view workspace rendering (List, Board, Table, Graph)
- Infinite canvas whiteboards
- Fast instant keyword and filter search
- AI Sidekick assistant for summaries and drafting

## The business

### Pricing

- Free: $0/mo — The basic version for personal use.
- Starter: Paid — Unlimited items and canvases with version history.
- Business: Paid — Advanced capabilities and AI tools.

Founded 2015.
Team size: Small boutique team.

## The hard parts

- Building a conflict-free real-time collaborative text editor with cursor synchronization
- Projecting the same underlying entities cleanly across four completely different UI paradigms (List, Board, Table, Graph)
- Wiring up an effective RAG vector pipeline for workspace context retrieval

## How to vibe code Nuclino

### Prerequisites

- Node.js (free): Required runtime for running the Next.js development environment.
- GitHub (free): Source control repository and deployment link for Vercel.

### Recommended AI tools

- Claude Code: Best-in-class coding agent for scaffolding multi-file Next.js apps, setting up databases, and debugging WebSocket layers from the terminal.
- Cursor: Ideal for fine-tuning React component layouts, markdown styling, and managing detailed inline diff reviews.

### Stack

- Frontend: Next.js (App Router) with Tailwind CSS and ProseMirror / TipTap
- Backend: Next.js API routes with Node.js WebSocket server
- Database: Turso (SQLite at the edge) with Drizzle ORM
- Auth: better-auth
- Payments: none
- Other: Vercel AI SDK, Anthropic API for Sidekick AI features

### Hosting

- Vercel (Hosting the Next.js frontend and serverless API endpoints.): $0/mo (Hobby tier)
- Fly.io (Hosting the persistent Node.js WebSocket server required for real-time collaborative editing.): ~$3-5/mo
- Turso (Serverless SQLite database for storing items, workspaces, and user state.): $0/mo (Free tier)

### Build guide

1. **Project Scaffolding & Database Schema** — Initialize the Next.js repository, configure Tailwind CSS, set up Drizzle ORM with Turso, and define database schemas for workspaces, items, comments, and tags.

```
Create a new Next.js App Router project using TypeScript and Tailwind CSS. Initialize Drizzle ORM configured for Turso (SQLite). Write the schema definitions for `workspaces` (id, name, created_at), `items` (id, workspace_id, title, content_json, parent_id, view_state, created_at, updated_at), and `tags` (id, name). Provide migration scripts and a seed utility to generate sample workspace data.
```

2. **Authentication & Workspace Shell** — Implement authentication using better-auth and build the clean sidebar navigation layout mirroring Nuclino's clutter-free workspace tree.

```
Integrate `better-auth` into the Next.js project with email/password authentication. Build a responsive dashboard shell featuring a collapsible sidebar for navigating workspaces and nested items in a tree hierarchy. Include creation buttons for new workspaces and items with instant optimistic UI updates.
```

3. **Rich-Text Editor & Real-Time Sync** — Integrate a block-based rich-text editor (ProseMirror/TipTap) and set up a companion WebSocket server on Fly.js for real-time document synchronization.

```
Set up a rich-text editor component using TipTap/ProseMirror supporting Markdown shortcuts, slash commands, and internal `@` linking between items. Create a standalone Node.js WebSocket server using `ws` to manage document room connections, broadcasting document state changes and active user cursor positions in real time.
```

4. **Multi-View Data Engine (List, Board, Table, Graph)** — Implement alternate workspace views that project the same item dataset into List, Kanban Board, Spreadsheet Table, and Network Graph visual paradigms.

```
Build view toggle components for workspaces: List view (clean structured table), Board view (Kanban columns grouped by status or tag), Table view (spreadsheet-style inline editor), and Graph view (interactive node-link diagram mapping item references using an SVG or canvas library like D3/vis-network). Ensure all views mutate the same underlying item entities.
```

5. **AI 'Sidekick' Assistant Integration** — Integrate the Vercel AI SDK and Anthropic API to provide inline document summaries, content generation, and workspace Q&A.

```
Implement an AI 'Sidekick' panel using the Vercel AI SDK and Anthropic Claude API. Add capabilities to summarize the current item document, draft new sections based on prompts, and answer user queries using context retrieved from workspace items.
```

### Cost vs paying

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

- Custom domain (optional): $12/year
- AI coding tool subscription: $20 one-time
- Total: ~$32 one-time

**Ongoing costs (monthly):**

- Fly.io WebSocket server: $3/mo
- Anthropic API usage for Sidekick AI: ~$2/mo
- Total: ~$5/mo

- Paying for the SaaS instead: $8-12/user/mo (Business Tier)
- Build time: 40-60 hours
- AI tool credits: $20 (Claude Pro or Cursor Pro)
- Break-even: N/A (Built for personal learning and self-hosted utility)

## Sources

- [Nuclino Official Website & Subpages](https://nuclino.com)
- [Hacker News - Nuclino Technical Stack & Launch Discussion](https://news.ycombinator.com)