Special feature generator

Generate a complete auth flow

Naming a feature auth activates the dedicated generator. It creates the full authentication flow and adapts the implementation to the stack saved in fsd.config.json.

Commands

bash
npx create-fsd-architecture --generate feature auth
bash
npx create-fsd-architecture -g feature auth
bash
npx create-fsd-architecture --generate feature auth --force

Generated flow

Login
Registration
Forgot password
Reset password
Verification code

Stack-aware output

Axios or Fetch

Creates API functions using the configured client.

TanStack Query

Adds React Query hooks, Vue Query composables, or Svelte Query accessors for the selected framework.

Framework-native stores

Creates Zustand, Redux Toolkit, Pinia, or Svelte store auth state and reusable helpers.

Redux Toolkit

Creates a reducer, actions, selectors, and registers the reducer.

Typed form validation

Uses React Hook Form, VeeValidate, or Superforms with Zod for every auth step.

Minimal stack

Keeps the generated feature UI-focused when optional tools are disabled.

SvelteKit output

In sveltekit projects, the command generates native Svelte 5 components for all five auth steps, TanStack Svelte Query v6 accessors, a Svelte auth store, and Superforms + Zod 4 validation. Forms use SvelteKit progressive enhancement while keeping their server-ready validation contract.

Vue output

In vue-vite and nuxt projects, the same command generates Vue single-file components for login, registration, password recovery, reset, and verification, plus Vue Query composables, a Pinia store, and VeeValidate + Zod forms when enabled. Nuxt uses its configured modules and SSR-aware Vue Query plugin.

Generated structure

text
src/features/auth/
├── api/
├── lib/
├── model/
├── ui/
└── index.ts

Exact files vary with the configured API, state, and forms choices. Existing auth files are protected unless you pass --force.

Nuxt writes the same feature under app/features/authbecause its framework adapter owns the app/ source root. SvelteKit writes it under src/features/auth.

Support FSD CLI

If FSD CLI helps you build, consider supporting its development and documentation. Donations are optional.

Buy Me a Coffee (opens in a new tab)

InstaPay · Egypt

ashrafmo-1

للدعم من مصر عبر إنستا باي. تأكد من بيانات المستلم قبل تأكيد التحويل.