What is a CLAUDE.md file and how does it work?

A CLAUDE.md file is a Markdown conventions file that Claude Code reads automatically when you start a session. It contains your project's folder structure, coding standards, naming conventions, and performance rules - so Claude writes consistent code from the first prompt. standarx generates this file for you in under 3 minutes with a guided wizard for React and Next.js projects.

How do I create cursor rules (.cursor/rules/*.mdc) for my project?

A .cursor/rules/*.mdc file tells Cursor's AI Composer exactly how to structure and write code for your project. With standarx, you select your framework (React or Next.js), choose a folder structure, toggle coding standards, and configure performance optimizations. The tool generates a clean .cursor/rules/*.mdc file you drop into your project root - Cursor reads it automatically.

Why does my AI coding assistant write messy or inconsistent code?

AI coding assistants like Claude Code, Cursor, and Codex produce inconsistent code because they don't know your project's specific conventions. Without explicit rules, the AI invents a different folder layout every time, mixes naming patterns, skips error handling, and ignores performance optimizations. The fix is giving your AI a conventions file (CLAUDE.md, .cursorrules, or AGENTS.md) that defines what "good" means for your stack. standarx generates these files automatically.

How do I stop AI from changing my folder structure every time?

AI coding agents change folder structures because they have no reference for your project's architecture. The solution is creating a rules file that explicitly defines your directory layout, what each folder is for, and how new files should be organized. standarx lets you configure a complete folder structure (with definitions for each directory), then generates a Markdown file your AI reads before writing any code - ensuring consistent structure across every session.

What coding standards should my AI agent follow for React and Next.js?

For React and Next.js projects, your AI agent should follow standards covering: named exports for components, TypeScript strict mode, proper error boundaries, semantic HTML, file size limits, import ordering, consistent naming conventions (PascalCase for components, camelCase for utilities), and accessibility (ARIA attributes, keyboard navigation). standarx provides a curated library of 30+ coding standards you can toggle on/off and customize, then generates a file your AI obeys.

What is "vibe coding" and how do I fix problems with it?

Vibe coding is when you build with AI tools (like Cursor or Claude Code) without setting explicit rules - you just "vibe" and let the AI decide everything. The problems: inconsistent folder structures, mixed coding patterns, missing optimizations, and unmaintainable code. The fix is giving your AI a conventions file before you start coding. standarx generates these files (CLAUDE.md, .cursorrules, AGENTS.md) so your AI follows consistent standards from line one - structured vibe coding.

Framework Combos

Encode Your Next.js Folder Structure for AI Agents

Your folder structure is the most important convention to encode. Once an AI knows where things go, everything else follows.

Last updated: 2026-07-01

Folder structure as the foundation

The folder structure is the single most impactful thing to encode in your rules file. It determines where every new file goes -and getting this right means your AI never creates files in wrong locations. More importantly, a well-defined structure implies the architecture: where business logic lives, what files are server-only, and what the boundary between UI and data is.

Three structure tiers for Next.js

Small projects (< 10 routes): flat structure with shared components. Medium projects: add features/ or domains/ with colocated components and hooks. Large projects: full feature-based architecture with src/features/[domain]/ modules, each self-contained with its own components, hooks, actions, queries, and types. The right structure for your project depends on team size and expected growth.

Medium project structure template

The most commonly applicable structure -feature-grouped but not fully domain-modular.

CLAUDE.md -Folder Structure section

# Folder Structure

```
src/
├── app/                    # Routes ONLY. Thin pages that import from below.
│   ├── (marketing)/        # Route group -shared marketing layout
│   ├── (dashboard)/        # Route group -shared dashboard layout
│   └── api/                # Route handlers: route.ts
│
├── components/             # Shared UI used in 2+ routes
│   ├── ui/                 # Base UI primitives (Button, Input, Badge)
│   └── [feature]-card.tsx  # Composed components
│
├── features/               # Business domain modules
│   └── [feature]/
│       ├── components/     # Feature-specific UI
│       ├── hooks/          # Feature-specific client hooks
│       ├── actions/        # Server Actions for this feature
│       ├── queries/        # Data fetching functions (server-side)
│       ├── types.ts        # Feature-specific types
│       └── index.ts        # Public API -only import from this
│
├── hooks/                  # Shared custom hooks (used in 2+ features)
├── lib/                    # Server-only: Prisma, auth, Stripe
│   └── (all files must import 'server-only')
├── store/                  # Zustand stores (UI state only)
├── types/                  # Global TypeScript types and Zod schemas
└── utils/                  # Pure helpers (usable on client and server)
```

## Placement Rules
- New component for one feature → src/features/[feature]/components/
- New component for 2+ features → src/components/
- New server utility → src/lib/  (add import 'server-only')
- New type/interface → src/features/[feature]/types.ts or src/types/ if global
- New Zustand store → src/store/[domain]-store.ts

## Never Create
- pages/ directory (App Router project)
- src/helpers/ or src/misc/ (use utils/ or lib/ instead)
- Top-level src/ folders not listed above

Encode Your Next.js Folder Structure for AI Agents

Folder structure as the foundation

Three structure tiers for Next.js

Medium project structure template

Generate folder structure rules for your project