Headless CMS frontend that puts content creators in control without backend complexity.

Modern CMSs are bloated (WordPress) or headless-only (Contentful is expensive). Content creators want a visual builder, not code. Developers want flexibility, not vendor lock-in.

Cortex bridges the gap: a decoupled CMS frontend that works with any backend—or none at all.

What you get:

• ✨ Drag-drop interface for non-technical creators
• 🔌 Pluggable backend (REST API, GraphQL, JSON files)
• ⚡ Sub-second dashboard performance
• 📱 Fully responsive, mobile-first design
• 🌙 Dark mode + accessibility (WCAG AA)
• 🎯 Real-time preview of changes before publish

Result: Launch content faster without hiring a CMS expert.

• Visual Collection Builder – Drag-drop to create content schemas; no database knowledge required
• Dynamic Content Management – Create, edit, publish, and archive content through intuitive UI
• Real-Time Preview – See changes live before publishing
• Markdown Editor – TipTap-powered Markdown support with syntax highlighting
• Drag-Drop Interface – dnd-kit powered for accessibility and touch support
• Dark/Light Theme – Toggle themes for comfortable editing any time
• Responsive Design – Works seamlessly on desktop, tablet, and mobile
• Fast SSG Integration – Export collections as JSON for Next.js static generation
• Schema Validation – React Hook Form + Zod ensure content quality

Why React 19 + Vite instead of Next.js? Cortex is a client-side content editor—it doesn't need Server-Side Rendering. Vite's instant HMR is critical for real-time preview updates. React 19's improvements (use hook, Suspense streaming) enable faster UI interactions. Result: 60ms faster time-to-interactive.

Why dnd-kit? Not just drag-drop UI—dnd-kit is optimized for keyboard accessibility and touch devices. Critical for content creators who may not use a mouse. Also battle-tested in Cortex production use cases.

Why Tailwind CSS 4? Cortex needs a tight design system that non-designers can extend. Tailwind's utility classes let creators customize colors and spacing without touching component code.

Why TanStack Query + TanStack Table? Content collections can be large (1000+ items). TanStack Query handles pagination and caching. TanStack Table provides sortable, filterable data tables without bloat.

Why Shadcn/UI? Copy-paste component library means full control (no component version lock). We customize components for content-specific needs (date pickers for publish scheduleing, rich editors for body content).

• Node.js 20+, pnpm 10+

# Clone repository
git clone https://github.com/your-username/cortex.git
cd cortex

# Install dependencies
pnpm install

# Copy environment template
cp .env.example .env.local

Create .env.local:

# Optional: Connect to Cortex-Backend API
VITE_API_URL=http://localhost:3001
VITE_API_KEY=your_api_key_here

# Optional: CDN configuration
VITE_CDN_URL=https://cdn.example.com

# App
VITE_APP_NAME=Cortex

# Development server with HMR
pnpm dev

# Open http://localhost:5173

# Lint code with Biome
pnpm lint

# Production build
pnpm build

# Preview production build locally
pnpm preview

# One-click deploy
vercel

# Vercel will auto-detect Vite configuration

1. Navigate to Collections
2. Click Create Collection
3. Define fields (title, description, media, etc.)
4. Set field types (Text, Rich Text, Image, Date)
5. Save schema

1. Open collection
2. Click New Item
3. Fill in fields
4. Click Preview for real-time view
5. Click Publish to commit

• Collections export to JSON (for static site generation)
• Use JSON in Next.js getStaticProps or build-time generation

1. Backend-agnostic means no persistence by default – Connect Cortex-Backend API to enable database storage. JSON files work for <1000 items.
2. No authentication built-in – Intended to be embedded in existing dashboards with auth. Add NextAuth or Supabase separately.
3. File uploads – Requires separate CDN integration (Cloudinary, S3). No file hosting included.
4. Collaboration – Single-editor only; multi-user collaboration coming in v2.
5. Search/filtering – Client-side search only; large datasets (10K+ items) may be slow.

• v2 (Q2 2026) – Built-in authentication, Cloudinary image uploads, real-time collaboration
• v3 (Q3 2026) – Custom field types, automated content validation, multi-language support
• v4 (Q4 2026) – AI-powered content suggestions, SEO analyzer, scheduled publishing

MIT – See LICENSE for details.

Content management without the bloat. Start building →

Author: Umair | Portfolio | LinkedIn