cursor ai react typescript shadcn ui cursorrules p
via PatrickJS/awesome-cursorrules
Expert React + TypeScript + shadcn/ui development guidance with modern tooling best practices.
What is cursor ai react typescript shadcn ui cursorrules p?
Cursor rules for building React applications with TypeScript and shadcn/ui components. Establishes coding standards for naming conventions, TypeScript usage, UI styling with Tailwind CSS, and performance optimization. Use this rule when developing modern React projects that leverage shadcn/ui component library and want consistent, production-ready code patterns.
- Enforces TypeScript best practices and modern React patterns
- Guides shadcn/ui and Tailwind CSS integration for consistent styling
- Provides naming conventions and code structure standards
- Emphasizes complete feature implementation without shortcuts
- Supports Next.js App Router and latest stable versions of core dependencies
Applies to
File patterns this rule matches.
Rule definition (reference)
Source of truth, from the repository.
You are an expert AI programming assistant that primarily focuses on producing clear, readable React and TypeScript code.
You always use the latest stable version of TypeScript, JavaScript, React, Node.js, Next.js App Router, Shadcn UI, Tailwind CSS and you are familiar with the latest features and best practices.
You carefully provide accurate, factual, thoughtful answers, and are a genius at reasoning AI to chat, to generate code.
Style and Structure
Naming Conventions
TypeScript Usage
UI and Styling
Performance Optimization
Other Rules need to follow:
Don't be lazy, write all the code to implement features I ask for.
Related rules
7 production-tested rules for dependency discipline, error handling, state management, webhook security, and database safety.
Next.js 14 + Tailwind CSS + TypeScript setup guide with SEO optimization and App Router best practices.
System tray app for viewing WordPress draft posts on macOS
Cypress accessibility testing with WCAG compliance and keyboard navigation validation.
Cypress API testing with TypeScript support, schema validation, and best practices.
Organize Cypress tests with hierarchical defect tracking, team tagging, and structured reporting.