nextjs material ui tailwind css cursorrules prompt
via PatrickJS/awesome-cursorrules
Next.js + Material UI + Tailwind CSS + shadcn/ui stack with TypeScript and App Router
What is nextjs material ui tailwind css cursorrules prompt?
Cursor rules for the Portfolio2 project, a Next.js application combining Material UI, Tailwind CSS, shadcn/ui, and Acernity UI. Use this rule to maintain consistent styling patterns, component structure, and TypeScript conventions across the full-stack application with Prisma ORM and NextAuth authentication.
- Enforces Next.js 14 App Router patterns with TypeScript and src/ directory structure
- Coordinates Material UI (@mui/material) with Tailwind CSS and styled-components for consistent theming
- Supports shadcn/ui and Acernity UI component integration alongside Material UI
- Provides guidance on Prisma ORM usage and NextAuth authentication implementation
- Maintains import alias conventions (@/) and CSS utility class organization with tailwind-merge
Applies to
File patterns this rule matches.
Rule definition (reference)
Source of truth, from the repository.
Ce projet s'appel Portfolio2
Il est basé sur Next.Js, il a tailwindcss, materialui, shadcn/ui et aceternityui
What is your project named? portfolio2
Would you like to use TypeScript? Yes
Would you like to use ESLint? No
Would you like to use Tailwind CSS? Yes
Would you like to use src/ directory? Yes
Would you like to use App Router? (recommended) Yes
Would you like to customize the default import alias (@/)? No
What import alias would you like configured? @/
Nola liste des dépendance
"dependencies": { "@ckeditor/ckeditor5-react": "^6.3.0", "@emotion/react": "^11.11.4", "@emotion/styled": "^11.11.5", "@mui/icons-material": "^5.15.18", "@mui/material": "^5.15.18", "@mui/styled-engine-sc": "^6.0.0-alpha.18", "@prisma/client": "^5.14.0", "autoprefixer": "^10.4.19", "bcryptjs": "^2.4.3", "ckeditor5": "^41.4.2", "clsx": "^2.1.1", "framer-motion": "^11.2.5", "init": "^0.1.2", "next": "^14.2.3", "next-auth": "^4.24.7", "react": "^18.3.1", "react-dom": "^18.3.1", "shadcn-ui": "^0.8.0", "styled-components": "^6.1.11", "tailwind-merge": "^2.3.0" },
"devDependencies": { "@types/bcryptjs": "^2.4.6", "@types/node": "^20", "@types/react": "^18", "@types/react-dom": "^18", "postcss": "^8.4.38", "prisma": "^5.14.0", "tailwindcss": "^3.4.3", "typescript": "^5.4.5" }
Related rules
Senior full-stack TypeScript, React, Node.js guidance with clean architecture, testing, and WHY-oriented reasoning.
Quantitative factor research skills for designing, evaluating, and mining alpha factors in equities markets.
Android development with Jetpack Compose, clean architecture, and Material Design 3.
Angular development with Novo Elements UI library using standalone components.
Expert Angular 18 + TypeScript development with Jest, emphasizing clean code and performance.
Manage Kubernetes clusters, add-ons, stacks, and credentials via the Ankra CLI platform.