TypeScript React Projects .cursorrules prompt file
About .cursorrules prompt file
What you can build
Code Quality Monitoring Tool: A web service that integrates with GitHub repositories to automatically analyze TypeScript and React code according to best practices, providing suggestions for optimizing performance, maintainability, and code structure.
Full-Stack Project Template Generator: A CLI tool that creates a boilerplate TypeScript, React, and Node.js project adhering to the specified coding standards, including workspace structure, linting configurations, and testing setup.
TypeScript Interface Builder: A web application that allows developers to visually design TypeScript interfaces and automatically generate the corresponding code, encouraging the use of interfaces over types.
Performance Optimization Dashboard: An online platform that connects to full-stack applications, analyzes data fetching and state management configurations, and suggests optimizations for production builds.
Edge Deployment Automation Service: A tool that automates deployment scripts for edge workspaces, ensuring the deployment process is efficient and follows the specified guidelines in the deployment script.
Error Logging and Notification System: A service that integrates with applications to log errors and send friendly user notifications, with early returns and guard clauses for better error handling.
Comprehensive Testing Suite: A testing framework built on top of Vitest that offers templates and guidelines for achieving extensive test coverage in TypeScript and React applications.
Linting and Formatting Plugin: A plugin for development environments that enforces ESLint rules and Prettier configurations automatically, helping maintain code quality and consistency.
Git Workflow Enhancer: A Git workflow extension that utilizes Husky hooks to enforce pre-commit checks, manage .gitignore files, and ensure best practices are followed before code is committed.
Yarn Workspace Integrity Checker: A package management tool that runs automatic checks to ensure workspace integrity and dependency health using Yarn 4.1.0, reducing the risk of broken builds.
Benefits
- Emphasizes TypeScript accuracy with practical examples, full TypeScript usage, and preference for interfaces over types to enhance code quality.
- Promotes a clear structure with logical file organization, modularization, and naming conventions to streamline the development process.
- Prioritizes code quality through consistent formatting, linting, and comprehensive testing using Prettier, ESLint, and Vitest.
Synopsis
Full-stack web developers using TypeScript, React, and Node.js can create optimized, maintainable, and high-performance applications adhering to specified best practices.
Overview of .cursorrules prompt
The .cursorrules file provides guidelines for developers working with TypeScript, React, Node.js, and full-stack web development. It specifies code style and structure, encouraging concise TypeScript code, functional programming patterns, and logical file organization. Naming conventions suggest lowercase directory names and named exports. TypeScript is to be used extensively, preferring interfaces over types, and functional components are recommended. Syntax and formatting are guided by a specific Prettier configuration, and error handling strategies are emphasized. Testing should use Vitest for comprehensive coverage, and a clear workspace structure is advised. Performance optimization, linting, and formatting should be addressed with ESLint and efficient data strategies. The Git workflow includes pre-commit hooks with Husky, and Yarn 4.1.0 is specified for package management, following best practices for performance, accessibility, and maintainability.