About .cursorrules prompt file
What you can build
React Component Library: Create a library of React components styled with Tailwind CSS that adhere to single responsibility principles and are optimized for performance and reusability. These components should leverage the Context API for state management and include intelligent error handling using try/catch blocks.
Vite Starter Template: Develop a Vite starter template that includes React, Tailwind CSS, and essential configurations. The template should include example components that demonstrate best practices, like modularity, ES6 syntax, and using async/await for asynchronous operations.
Code Quality Analyzer Tool: Build a tool that analyzes JavaScript/React code to ensure adherence to best practices outlined in this AI prompt, such as proper use of ES6 features, descriptive naming, and modularity.
Real-time Collaboration Platform: Create a platform for developers to collaborate on React projects in real-time using Vite and Tailwind CSS. Utilize modern web standards to streamline the editing experience and ensure performance.
Educational Platform for Modern Web Development: Develop an educational platform that teaches users how to create efficient, modular, and performant web applications using React, Vite, Tailwind CSS, and modern JavaScript features.
Asynchronous Operations Management Tool: Design a tool that helps developers manage asynchronous operations in their projects more effectively by providing insights and optimizations for async/await, Promise.all, and error handling strategies.
Context API Manager: Build an application that visually represents and assists in managing global state across smaller React applications using Context API, promoting seamless state sharing and modifications.
Template Literal Builder: Implement a tool that assists developers in constructing complex template literals in JavaScript, encouraging better readability and maintenance of code.
Function Converter Utility: Develop a utility that converts traditional JavaScript functions into arrow functions and consts, aligning with best practices for more modern and concise JavaScript code.
Benefits
- Emphasizes exclusive use of Tailwind classes for styling, encouraging consistency.
- Highlights the importance of modularity and reusability by focusing components on a single responsibility.
- Promotes clear, self-explanatory code through descriptive naming and leveraging ES6+ features.
Synopsis
Developers can build efficient, modular web applications by adhering to best practices using Vite, React, JavaScript, and Tailwind CSS, focusing on code readability and performance.
Overview of .cursorrules prompt
This .cursorrules file provides guidelines for an expert full-stack web developer focused on creating efficient, readable, and high-performance code using Vite, React, JavaScript, and Tailwind CSS. It emphasizes modern web standards and industry best practices, encouraging the use of modular and reusable code with a clear structure and descriptive naming. Key directives include using Tailwind classes for styling, adopting ES6+ features, favoring named exports, and employing async/await for asynchronous tasks. The file also advises using array methods over loops, leveraging the context API for state management, and prefixing boolean variables appropriately. Additionally, it outlines error handling and documentation best practices for complex logic.
