doc.dev Project Structure

Overview

This document details the complete structure of the doc.dev documentation platform project. This is a focused, single-purpose application built with Next.js and Convex for document editing and management.

Root Structure

doc-dev/
├── apps/                      # Application packages
│   └── doc/                  # Documentation platform
├── packages/                  # Shared packages
├── docs/                      # Documentation
├── turbo.json                # Turborepo configuration
├── pnpm-workspace.yaml       # PNPM workspace config
├── package.json              # Root package.json
├── biome.json                # Biome formatter/linter config
├── tsconfig.json             # TypeScript configuration
└── CLAUDE.md                 # AI assistant guide

Applications (/apps/doc)

/apps/doc/web - Main Documentation App

web/
├── app/                      # Next.js App Router
│   ├── api/                 # API Routes
│   ├── app/                 # Application pages
│   ├── components/          # App-specific components
│   ├── dashboard/           # Document management dashboard
│   ├── providers/           # Context providers
│   ├── layout.tsx           # Root layout
│   ├── not-found.tsx        # 404 page
│   ├── page.tsx             # Homepage
│   └── globals.css          # Global styles
├── components/              # React Components
│   └── docs/               # Document-specific components
├── src/                     # Source utilities
│   ├── components/         # Additional components
│   └── hooks/              # Custom React hooks
├── middleware.ts           # Next.js middleware
├── next.config.js          # Next.js config
├── package.json           # Dependencies
├── tailwind.config.ts     # Tailwind config
└── tsconfig.json          # TypeScript config

/apps/doc/cli - CLI Tools

cli/
├── bin/                    # Executable scripts
│   └── doc-watch.js       # Main CLI executable
├── src/                   # Source code
│   ├── config.js          # Configuration handling
│   ├── index.js           # Main CLI logic
│   ├── logger.js          # Logging utilities
│   ├── utils.js           # Helper utilities
│   └── watcher.js         # File watching logic
├── test/                  # Test files and fixtures
└── package.json          # CLI dependencies

Packages (/packages)

/packages/convex-doc - Document Backend

convex-doc/
├── convex/               # Convex functions
│   ├── _generated/       # Auto-generated files
│   ├── documents.ts      # Document management
│   ├── projects.ts       # Project management
│   ├── schema.ts         # Database schema
│   └── userPreferences.ts # User preferences
├── package.json         # Backend dependencies
└── tsconfig.json       # TypeScript config

/packages/ui - Shared UI Components

ui/
├── src/
│   ├── components/       # ShadCN UI components
│   ├── primitives/       # Base UI primitives
│   ├── static/          # Static assets (logos, etc.)
│   ├── hooks/           # Shared React hooks
│   └── lib/             # UI utilities
├── components.json      # ShadCN configuration
└── package.json        # UI dependencies

/packages/typescript-config - Shared TypeScript Configs

typescript-config/
├── base.json           # Base TypeScript config
├── nextjs.json         # Next.js specific config
├── react-library.json # React library config
└── package.json       # Config package

Documentation (/docs)

Current Documentation Structure

docs/
├── architecture/       # Architecture documentation
│   └── PROJECT_STRUCTURE.md # This file
├── development/        # Development guidelines
│   ├── GIT_PREFERENCES.md
│   ├── TYPESCRIPT_BEST_PRACTICES.md
│   ├── SHADCN.md
│   ├── UI_STANDARDS.md
│   └── PLAYWRIGHT_MCP_DOCS.md
├── features/          # Feature documentation
│   ├── TIPTAP_EDITOR.md
│   └── SEO.md
├── projects/          # Project-specific docs
│   └── doc/          # Doc.dev specific documentation
├── README.md         # Documentation index
├── TENETS.md         # Core development principles
└── SYNTAX_HIGHLIGHTING_FIX.md

Key Configuration Files

Root Level

  • turbo.json - Turborepo pipeline configuration
  • pnpm-workspace.yaml - Workspace package definitions
  • biome.json - Code formatting and linting rules
  • tsconfig.json - Root TypeScript configuration
  • package.json - Root dependencies and scripts

Application Level

  • next.config.js - Next.js configuration
  • tailwind.config.ts - Tailwind CSS configuration
  • tsconfig.json - TypeScript configuration
  • package.json - Dependencies and scripts

Scripts Overview

Development

  • pnpm dev - Start doc.dev development server (port 3016)
  • pnpm dev:doc-tests - Start with testing setup
  • pnpm dev:doc-watch - Start CLI file watcher
  • pnpm build - Build for production

Convex Backend

  • pnpm convex:doc:dev - Start Convex development
  • pnpm convex:doc:codegen - Generate Convex types
  • pnpm convex:doc:deploy - Deploy to Convex

Code Quality

  • pnpm lint - Run Biome linter
  • pnpm lint:fix - Auto-fix lint issues
  • pnpm format - Format code with Biome
  • pnpm check - Run all Biome checks

UI Components

  • pnpm ui:add <component> - Add ShadCN UI component

Testing

  • pnpm test - Run Playwright tests

Technology Stack

Frontend

  • Framework: Next.js 15.4.1 with Turbopack
  • Language: TypeScript 5.7.3
  • Styling: Tailwind CSS v4
  • UI Components: ShadCN UI
  • Editor: TipTap rich text editor
  • Markdown: MDX with syntax highlighting

Backend

  • Database: Convex (real-time document storage)
  • Authentication: Clerk integration
  • API: Next.js API routes

Development

  • Package Manager: pnpm 10.4.1
  • Build Tool: Turborepo
  • Code Quality: Biome.js
  • Testing: Playwright

Environment Variables

Required environment variables:

  • CONVEX_DEPLOYMENT - Convex deployment ID
  • NEXT_PUBLIC_CONVEX_URL - Public Convex URL
  • NEXT_PUBLIC_CONVEX_DEPLOYMENT_DOC - Doc deployment URL
  • Clerk authentication credentials
  • Various API keys as needed

Port Configuration

  • Development: Port 3016 (doc-web application)
  • Production: Managed by deployment platform

Key Features

Document Management

  • Real-time document editing with TipTap
  • Markdown support with MDX
  • Syntax highlighting with Shiki
  • Document organization and templates

CLI Tools

  • File watching for automatic updates
  • Markdown processing and validation
  • Development utilities

Testing

  • End-to-end testing with Playwright
  • Component testing setup
  • Integration with Convex backend

Last updated: January 24, 2025

On this page