About .cursorrules prompt file
What you can build
Tailwind MUI Template Builder: A website service that provides customizable templates using Tailwind CSS and Material UI components. Users can select and combine different UI elements to create personalized templates for their projects without needing extensive design knowledge.
React Component Library Marketplace: A platform where developers can buy, sell, or share React components built using the technologies listed, like shadcn/ui and aceternityui. The marketplace facilitates component discovery and reuse, accelerating project development.
Next.js Portfolio Generator: An app that leverages Next.js alongside the specified dependencies to create stunning developer portfolios. Users can utilize different templates and customize them with CKEditor5 for content management, integrated with Prisma for backend management.
TypeScript Code Quality Analyzer: A web service that analyzes TypeScript codebases for quality and security using best practices. While ESLint isn’t used in this project, the tool can focus on TypeScript-specific patterns and offer Tailwind and MUI integration advice.
Material UI Icon Finder: A browser extension that seamlessly integrates with code editors and provides quick access to the @mui/icons-material library. The tool enables developers to search and insert icons directly into their codebase.
Tailwind CSS Theme Customizer: A tool for creating and managing Tailwind CSS themes, allowing users to preview how various styles and merges affect UI components. Developers can export themes for easy integration into their Next.js projects.
Prisma Database Schema Visualizer: An app to visualize and edit Prisma database schemas. It connects directly to the user’s database and displays models in an interactive graph, allowing modifications and immediate application of changes.
Framer Motion Animation Library: A curated library of animation sequences created using Framer Motion that developers can easily integrate into their Next.js projects. The library offers a diverse range of animations tailored for Material UI components.
Shadcn/UI and AceternityUI Tutorials: An educational platform offering interactive tutorials and courses focused on implementing and leveraging shadcn/ui and aceternityui libraries within Next.js applications.
Styled Components Editor: A web-based editor that provides a friendly UI for styling React components using styled-components. Users can visually tweak and test styles, with the ability to preview changes in real-time and export the resulting code.
Benefits
- Integrated with Next.js and TypeScript for optimal developer experience and type safety.
- Utilizes TailwindCSS, Material UI, and Shadcn/UI for flexible and advanced styling capabilities.
- Configured with key dependencies like Prisma for database management and NextAuth for authentication integration.
Synopsis
Developers building a modern portfolio website using Next.js with a strong emphasis on TypeScript, TailwindCSS, Material UI, and additional integrations like authentication and rich-text editing would benefit from this prompt.
Overview of .cursorrules prompt
The .cursorrules file outlines the setup for a project named "Portfolio2" using Next.js. It specifies the use of TypeScript and Tailwind CSS, but opts out of using ESLint and customizing the default import alias. The project structure includes the use of an `src/` directory and an App Router. The file lists a comprehensive set of dependencies crucial for the project, such as packages for UI components, styling, authentication, and a database client. Key dependencies include Material UI, Tailwind CSS, Prisma, and Next.js. Additionally, relevant devDependencies for the development environment, such as type definitions and PostCSS, are included.
