Dirstarter works with all major code editors. This guide will help you set up your preferred editor for maximum productivity.

Recommended Extensions

Install these extensions for your preferred editor:

OXC (Linting)

OXC provides blazingly fast JavaScript/TypeScript linting (50-100x faster than ESLint) with real-time editor feedback.

Prisma

Adds syntax highlighting, formatting, auto-completion, and jump-to-definition for .prisma files.

Tailwind CSS IntelliSense

Provides intelligent autocomplete for Tailwind CSS classes, hover previews, and linting.

Editor Configuration

For VSCode and Cursor users, the repository includes pre-configured settings in .vscode/settings.json that set up:

• OXC settings for linting
• TypeScript settings
• File associations

Recommended Workflow

For the best development experience:

1. Use the integrated terminal to run development commands
2. Leverage the Problems panel to quickly find and fix issues
3. Use the Source Control panel for Git operations
4. Take advantage of the built-in IntelliSense for TypeScript and React

Agent Skills (Pro)

Dirstarter Pro includes Agent Skills — an agent-agnostic package of AI instructions built specifically for the Dirstarter codebase. It pairs a root AGENTS.md (always-on project guidance) with a set of on-demand skills that your AI coding agent loads only when a task matches, keeping its context focused while it follows Dirstarter's real patterns.

Works with any modern AI coding agent:

• Claude Code — reads CLAUDE.md and .claude/skills
• Codex — reads AGENTS.md and .agents/skills
• Cursor, opencode, Gemini CLI, and others — read AGENTS.md and the open SKILL.md standard

What you get:

• A comprehensive AGENTS.md covering the stack, architecture, and golden rules
• On-demand skills spanning the whole codebase — server procedures (oRPC), database (Prisma), forms, components, styling, services, auth & permissions, i18n, SEO, configuration, and deployment
• Step-by-step recipes for common work, like adding a new feature end-to-end
• Always accurate — the skills describe the boilerplate as it actually ships, so your agent never invents outdated patterns

How to access:

Agent Skills are available to Pro customers. After purchasing the Pro plan, you'll receive access instructions via email. They install into your project with a single command using the open Agent Skills tooling, or a simple copy, and work across every agent listed above.

If you have the Pro version and need help wiring up Agent Skills for your preferred agent, please contact support for assistance.

Next Steps

Now that your editor is configured, learn about Formatting & Linting to maintain code quality.