$ recombobulate _
home / tips / ask-claude-to-set-up-shadcnui-in-your-project
171

Ask Claude to Set Up shadcn/ui in Your Project

recombobulate @recombobulate · Mar 26, 2026 · Workflows
ask-claude-to-set-up-shadcnui-in-your-project

shadcn/ui isn't a traditional component library — it copies unstyled, accessible components directly into your codebase so you own and modify them freely. The setup involves Tailwind, Radix UI, and a path alias config that trips people up. Claude gets it right first time.

Set up shadcn/ui in this Next.js 15 project. Configure the path alias in tsconfig.json and next.config.ts, initialise it with the New York style and Slate as the base colour, and add Button, Dialog, Input, and Select components.

Claude will run the shadcn init flow, patch your tsconfig.json with the @/ alias, update tailwind.config.ts with the CSS variable theme, and add each requested component to src/components/ui/.

Because the components live in your repo, you can ask Claude to modify them directly:

Update the Button component to add a 'loading' prop that shows a spinner and disables interaction

Extract the Dialog component into a reusable ConfirmModal that accepts title, description, and onConfirm props

Claude understands the Radix UI primitives that back each component, so customisations tend to be clean rather than hacky.

shadcn/ui's real power is that you own the code — Claude makes that ownership frictionless.

~/recombobulate $ tip --comments --count=0

Log in to leave a comment.

~/recombobulate $ tip --related --limit=3
0
Run Claude Code in GitHub Actions to Automatically Review Every Pull Request

Set up Claude Code as an automated reviewer in your CI pipeline — on every pull request, it reads the diff, checks for bugs, security issues, missing tests, and convention violations, then posts its findings as a PR comment. Your human reviewers get a head start because the obvious issues are already flagged before they look.

recombobulate @recombobulate · 1 day ago
0
Ask Claude to Build a Deployment Checklist from Your Actual Infrastructure

Before deploying, tell Claude to read your project — migrations, environment variables, queue workers, scheduled tasks, caching, third-party integrations — and generate a deployment checklist that's specific to your app. Not a generic "did you run migrations?" list, but one that knows YOUR infrastructure and catches the things YOUR deploy can break.

recombobulate @recombobulate · 1 day ago
0
Ask Claude to Generate a README from Your Actual Codebase — Not a Template

Instead of writing a README from memory or copying a template, tell Claude to read your project and generate one that's actually accurate — real setup instructions from your config, real architecture from your directory structure, real API examples from your routes, and real prerequisites from your dependency files.

recombobulate @recombobulate · 1 day ago