Getting Started
Set up your first Helix CMS project in minutes
Installation
To get started with Helix, you'll need Node.js 20+ and npm/pnpm/yarn.
# Create a new project directory mkdir my-helix-project cd my-helix-project # Initialize your project npm init -y # Install the Helix SDK npm install @helix/sdk # Install the CLI tool npm install -D @helix/cli
You'll need a Helix account and Space. Sign up at helix.dev to get your Space ID and API key.
Project Structure
Your project will look like this:
my-helix-project/ ├── src/ │ └── types.ts # Your content model definitions ├── package.json └── .env # Your Helix credentials
Quick Start
Let's create your first content model using Helix's TypeScript-first approach:
1. Define Your Schema
Create a types.ts file in your project:
import { Localized, Slug, Widget, Asset } from '@helix/sdk';
// Exported classes are Entities (top-level content types)
export class Page {
@Slug()
slug!: Slug;
@Localized()
title!: string;
@Localized()
@Widget('richtext')
content?: string;
featuredImage?: Asset;
}
export class Author {
name!: string;
@Widget('textarea')
bio?: string;
avatar?: Asset;
}
export class Article {
@Slug()
slug!: Slug;
@Localized()
title!: string;
@Localized()
@Widget('richtext')
content?: string;
// Relation - automatically inferred from Entity type
author?: Author;
featuredImage?: Asset;
}
// Non-exported classes are Components (embedded content blocks)
class SEO {
@Localized()
metaTitle?: string;
@Localized()
@Widget('textarea')
metaDescription?: string;
}
Notice how natural this feels? You're just writing TypeScript classes with decorators. No configuration files, no schema DSL - just TypeScript.
2. Configure Your Environment
Create a .env file with your Helix credentials:
HELIX_SPACE_ID=your-space-id HELIX_API_KEY=your-api-key
3. Sync Your Schema
Use the Helix CLI to sync your schema to the CMS:
npx @helix/cli sync
The CLI will parse your TypeScript file, generate a schema manifest, and atomically update your CMS configuration.
4. Access the Admin UI
Log in to the Helix Admin UI at your studio URL (e.g., https://studio.helix.dev) and navigate to your space. You'll see your Page and Author entities ready for content creation!
Next Steps
Now that you have Helix running, explore these core concepts:
- Type System - Deep dive into TypeScript-based modeling
- Decorators - Learn all available decorators
- Entities & Components - Master content relationships
- Internationalization - Add multi-language support
- Branching - Use Git-style content workflows