Dinshad

Create a fully-featured Next.js application with shadcn/ui components and AI-friendly structure in seconds.

Quick Start

``bash
mkdir my-project
cd my-project
npx dinshad
`

This creates a Next.js 14.0.3 project with:
- 🎨 Complete shadcn/ui component system
- 🌓 Light/Dark mode + multiple themes
- 🤖 AI-friendly project structure
- 🎯 TypeScript + ESLint
- 📱 Responsive by default
- 🚀 Ready for development

Project Structure

`
my-project/
├── app/ # Next.js pages
│ ├── page.tsx # Home page
│ └── blank/ # Template page
├── components/ # React components
│ ├── ui/ # shadcn components
│ ├── navbar.tsx # Navigation + theme
│ └── ...
├── lib/ # Utilities
├── project.md # Project requirements
└── todo.md # Development tasks
`

Features

$3

- 30+ pre-configured shadcn/ui components
- All components theme-aware
- TypeScript types included
- Accessible by default

Available Components:
`
Layout:
- Card: cards, headers, footers
- Sheet: slide-out panels
- Accordion: collapsible sections
- AspectRatio: responsive containers

Navigation:
- NavigationMenu: main navigation
- DropdownMenu: nested menus
- Menubar: horizontal menus
- Tabs: tabbed interfaces

Inputs:
- Button: various button styles
- Input: text inputs
- Textarea: multiline inputs
- Select: dropdown selections
- Checkbox: toggle boxes
- RadioGroup: option groups
- Switch: toggle switches
- Slider: range inputs

Data Display:
- Table: data tables with sorting
- Calendar: date displays
- Progress: progress indicators

Feedback:
- Alert: status messages
- Toast: notifications
- Skeleton: loading states

Overlay:
- Dialog: modal windows
- AlertDialog: confirmation dialogs
- HoverCard: hover tooltips
- Popover: contextual overlays
- Tooltip: hover tips

Other:
- Avatar: user images
- Badge: status indicators
- Command: command palettes
- Separator: divider lines
`

$3

- Light/Dark modes
- Additional themes:
- Slate (default)
- Rose
- Blue
- Green
- Orange
- Easy theme switching from navbar
- CSS variables for customization

$3

This template is optimized for AI development using Cursor. To get the best experience:

1. Open project in Cursor
2. Set up project rules (Cmd/Ctrl + Shift + J):

Recommended Rules:
`
You are the primary developer for this project. Follow these guidelines:

1. Project Organization:
- Read project.md for requirements
- Use todo.md to track tasks with checkboxes
- Replace blank/ template with actual features

2. Component Usage:
- Use pre-installed shadcn components
- Maintain theme compatibility (light/dark)
- Follow Next.js app router patterns
- Add JSDoc comments for components

3. Development Process:
- Track progress in todo.md
- Add console.logs for debugging
- Request user testing when needed
- Record test results in log.txt
`

3. Start development by:
- Defining requirements in project.md
- Planning tasks in todo.md
- Using the blank/ page as a template

Development

Start the development server:
`bash
npm run dev
`

Visit http://localhost:3000 to see your app.

Project Organization

$3


- project.md: Define your project requirements
- todo.md: Track development progress
- app/blank/: Template page for new features

$3

- Edit themes in app/globals.css
- Modify navigation in components/navbar.tsx
- Add new pages in app/` directory
- All shadcn/ui components ready to use

Need Help?

- Check shadcn/ui docs
- Visit our GitHub repository
- Open an issue

License

MIT