Next.js feature-based architecture rules

No description provided.

Install via CLI

$ npx @airuleshub/cli@latest add nextjs-feature-based-architecture-rules

Rule Content

🎯 RULE: ROUTING + FEATURES MUST BE SEPARATED

app/ → routing only
features/ → business logic

📁 FOLDER STRUCTURE (NEXT.JS)

src/│├── app/                              # Next.js App Router│   ├── layout.tsx│   ├── globals.css││   ├── (public)/│   │   ├── layout.tsx│   │   ├── page.tsx                  # landing│   │   └── login/│   │       └── page.tsx││   ├── (protected)/│   │   ├── layout.tsx│   │   └── dashboard/│   │       └── page.tsx││   ├── (admin)/│   │   └── admin/│   │       └── page.tsx││   └── api/                          # route handlers│       └── auth/│           └── route.ts│├── features/│   ├── auth/│   │   ├── components/│   │   │   ├── LoginForm.tsx│   │   │   └── RegisterForm.tsx│   │   ││   │   ├── hooks/│   │   │   ├── useLogin.ts│   │   │   └── useSession.ts│   │   ││   │   ├── queries/│   │   │   ├── auth.queries.ts│   │   │   └── auth.mutations.ts│   │   ││   │   ├── services/│   │   │   └── auth.api.ts│   │   ││   │   ├── types/│   │   │   └── auth.types.ts│   │   ││   │   ├── utils/│   │   │   └── auth.utils.ts│   │   ││   │   ├── constants/│   │   │   └── auth.constants.ts│   │   ││   │   └── index.ts│   ││   ├── rules/│   │   ├── components/│   │   ├── hooks/│   │   ├── queries/│   │   ├── services/│   │   ├── types/│   │   ├── utils/│   │   ├── constants/│   │   └── index.ts│├── shared/│   ├── components/│   ├── hooks/│   ├── lib/│   │   ├── api.ts│   │   ├── query-client.ts│   │   └── auth.ts│   ├── utils/│   ├── constants/│   └── types/│├── providers/│   └── QueryProvider.tsx│├── middleware.ts                    # auth / route guards│├── styles/│   └── globals.css│├── config/│   └── env.ts│├── types/│└── next.config.js

⚡ NEXT.JS RULES

app/ MUST NOT contain business logic
All logic MUST live inside features/
Server components MUST NOT include client-side logic unnecessarily
TanStack Query MUST be used for client-side server state
API routes MUST remain thin (no heavy logic)
Middleware MUST handle authentication and routing guards

🚫 COMMON FORBIDDEN

API calls inside components
Cross-feature imports
Global business logic
useEffect for fetching
Monolithic folders

Next.js feature-based architecture rules

Rule Content

🎯 RULE: ROUTING + FEATURES MUST BE SEPARATED

📁 FOLDER STRUCTURE (NEXT.JS)

⚡ NEXT.JS RULES

🚫 COMMON FORBIDDEN

Command Palette