An automated CLI tool that generates complete CRUD (Create, Read, Update, Delete) feature scaffolding for Next.js applications using Drizzle ORM.
This CRUD generator automatically creates all the necessary files for a complete feature module, following best practices and a clean architecture approach. It's designed to work with Next.js applications that use:
- TypeScript
- Drizzle ORM
- React Query
- Zod validation
- Tailwind CSS
- Shadcn UI components
- ✅ Generates complete feature scaffolding
- ✅ Creates API routes for REST operations
- ✅ Implements data table with sorting, filtering, and pagination
- ✅ Includes form creation with validation
- ✅ Handles create, read, update, and delete operations
- ✅ Uses a robust architecture with separation of concerns
- ✅ Follows consistent naming conventions and file organization
- Place the
crud-generator.jsfile in your project root - Install the required dependencies if you haven't already:
npm install chalk slugify- Make the script executable:
chmod +x crud-generator.jsRun the generator with:
node crud-generator.jsFollow the prompts to enter:
- Entity name (in PascalCase, singular form)
The generator will:
- Check if a Drizzle schema already exists for the entity
- Create one if it doesn't exist
- Parse the schema to understand the entity fields
- Generate all the necessary files
For a given entity (e.g., "Category"), the generator creates the following structure under features/category/:
features/category/
├── api/
│ ├── route.ts # API handlers for GET (list) and POST (create)
│ └── [slug]/
│ └── route.ts # API handlers for GET, PUT and DELETE by slug
├── components/
│ ├── molecules/
│ │ └── category-form.tsx # Form component for create/update
│ └── organisms/
│ ├── add.tsx # Add component with modal
│ ├── columns.tsx # Table columns configuration
│ ├── data-table-row-actions.tsx # Row actions (edit/delete)
│ ├── delete.tsx # Delete confirmation component
│ └── edit.tsx # Edit component with modal
├── config/
│ ├── category.key.ts # Query keys for React Query
│ ├── category.schema.ts # Zod validation schemas
│ └── category.type.ts # TypeScript types
├── domain/
│ ├── category.service.ts # Service for API communication
│ └── use-cases/
│ ├── category.use-case.ts # Use cases implementation
│ └── index.ts # Use cases exports
├── hooks/
│ └── use-category.ts # React hooks for data fetching/mutations
└── pages/
└── page.tsx # Main page component
After generating the feature:
- Add Routes: Update your app router configuration to include the new routes
- Add to Navigation: Add the new feature to your navigation or sidebar
- Run Migrations: If you created a new schema, run Drizzle migrations to update your database
The generator follows a clean architecture approach:
- Config: Contains types, schemas, and configurations
- Domain: Contains business logic and API services
- Components: UI components separated by complexity (molecules/organisms)
- Hooks: React hooks for data fetching and state management
- API: API routes for backend communication
You can modify the generator script to adapt it to your specific project needs:
- Adjust the file paths to match your project structure
- Modify the templates to follow your coding standards
- Add additional field types and validations
The generator assumes your project has:
- A Next.js App Router setup
- Drizzle ORM configured with PostgreSQL
- React Query for state management
- Tailwind CSS for styling
- Shadcn UI components
MIT