Browse

Data Storage .cursorrules strategies

Filters

Tech

Clear

seaborn

Tauri

logging

Azure

MySQL

Go

Kafka

WebP.

next-safe-action

Phoenix LiveView

Ecto

File System Watcher

Plug

Finch

Gettext

Phoenix

Jason

Phoenix LiveDashboard

Sobelow

ExCoveralls

DNS Cluster

ExUnit

Release Please

Swoosh

Credo

LeftHook

npm

Wagmi

Viem

Next.js 14

Daisy UI

Express.js

Vercel AI SDK

Firebase

Slither

Hardhat

Mythril

Chainlink VRF

SOLID

OpenAI

SVG

SWR

Prometheus

Memcached

ELK Stack

Grafana

async/await

API

Grid

OpenAPI

React Server Components

Turborepo

None

TanStack React Query

Mongoose

virtual environments

dask

PyTorch

tqdm

Flask

joblib

NumPy

python-dotenv

pip

Django REST Framework

unittest

WhiteNoise

pytest-django

AWS

NoSQL

Kubernetes

Cypress

Axios

Next.js SSR.

Next.js 14 App Router

Angular

React Server Components (RSC)

Rell

Kotlin

Tailwind CSS.

Cairo

Biome

Composer

WebAssembly

yarn

Material UI

autoprefixer

bcryptjs

@types/react

Next.Js

@types/node

prisma

framer-motion

postcss

react-dom

Supabase Auth

WCAG

React.FC

React.ReactNode

fetch API

Categories

Clear

Transaction Management

Event Handling

Code Implementation

Coding Conventions

Smart contract development

Cryptographic operations

Code organization

Testing and deployment

Blockchain integration

Game development

Permission Management

Gasless Transactions

Solidity Development

Web3 Development

Developer Tools

Crypto

Ancient Times

Procedural Generation

Resource Management

Turn-Based Strategy

Virtual World

Application Structure

iOS Development

Mobile App Design

$derived

$props

Snippets

$host

$bindable

Svelte 5

$effect

`createRawSnippet`

$state

$inspect

Nintendo Ringcon

Unity

Exercise-Based Games

Tower Defense

Clear readable code

Typescript

NextJS

Coding assistant

VSCode

Testing and documentation

Java coding best practices

Code review practices

AI assistant behavior

Security practices

WordPress Plugin

Software Configuration

Draft Management

System Tray App

Localization

Event-Driven Development

Modern PHP Practices

Scheduling Systems

MVC Architecture

Security Measures

Asset Compilation

Software Setup

Fullstack Development

Senior Developer

Environment Variables

ES6 Syntax

Custom Utilities

Modern Development Practices

Programming Assistant

Svelte/SvelteKit

Coding style

Object-oriented programming

Testing guidelines

Mock data generation

Rich-text editor

Open-source

TypeScript path aliases

Local Environment Development

Modular Library Development

Player Feedback

Dungeons and Dragons

NPC Management

Asynchronous Components

Data Fetching and Routing

Web Vitals Optimization

Asynchronous Operations

Backend Logic

AI/ML Integration

Data Visualization

Business Simulation

Simulation Game

Key Performance Indicators

Advanced Java Features

Java Design Patterns

Concurrency and Multithreading

Software Testing and Debugging

Continuous Integration and Deployment

Security in Java Applications

Modern Software Development

Cloud-Native Development

operational maintenance

state management

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

NEW

React TypeScript Material UI .cursorrules prompt file

You are an expert in TypeScript, React, and Material UI.

Code Style and Structure

Write concise, technical TypeScript code with accurate examples.
Use functional and declarative programming patterns; avoid classes.
Prefer iteration and modularization over code duplication.
Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError).
Structure files: exported component, subcomponents, helpers, static content, types.
Importing React from "react" is unnecessary and should be avoided.

Naming Conventions

Use PascalCase for component names.
Use camelCase for function and variable names.
Use ALL_CAPS for constants.

TypeScript Usage

Use TypeScript for all code; prefer interfaces over types.
Avoid enums; use const objects instead.
Use functional components with TypeScript interfaces for props.

Syntax and Formatting

Use arrow functions for component definitions and callbacks.
Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements.
Use declarative JSX.

UI and Styling

Use Material UI components and icons for all UI elements.
Utilize Material UI's styling solutions (e.g., styled, makeStyles, or sx prop) for custom styling.
Implement responsive design using Material UI's responsive utilities.
When creating custom UI components, use styled-components for styling.

Material UI Usage

Import Material UI components from @mui/material.
Import Material UI icons from @mui/icons-material.
Use Material UI's theming system for consistent styling.

Performance Optimization

Use React.memo() for pure functional components when necessary.
Utilize useMemo and useCallback hooks to optimize performance.
Implement code splitting for large applications.

Debugging and Troubleshooting

After 1-2 iterations of debugging, if progress seems slow, suggest implementing debug output.
Create a reusable debug component to display network requests and props/state values.
Include a "copy to clipboard" button with the debug output for easy sharing.
Place the debug component alongside the relevant UI components being debugged.

State Management

Use React hooks (useState, useEffect, useContext) for state management.
For complex state, consider using useReducer or a state management library compatible with Material UI.

Data Storage

For local storage, use the localStorage API.
For web/cloud storage, use Firestore.
Create a separate file (e.g., firebaseConfig.ts) for Firestore configuration and import it where needed.

Follow Material UI and React best practices for component composition and prop usage.

stack: