Browse

useState .cursorrules prompt files

useState is a React Hook that allows you to add state to functional components, enabling dynamic updates to the component without needing to use class components.

Filters

All

React

Tailwind CSS

Filters

Tech

Clear

OpenAPI

Grid

API

async/await

Grafana

ELK Stack

Memcached

Prometheus

SWR

SVG

OpenAI

SOLID

Chainlink VRF

Mythril

Hardhat

Slither

Firebase

Vercel AI SDK

Express.js

Daisy UI

Next.js 14

Viem

Wagmi

npm

LeftHook

Credo

Swoosh

Release Please

ExUnit

DNS Cluster

ExCoveralls

Sobelow

Phoenix LiveDashboard

Jason

Phoenix

Gettext

Finch

Plug

File System Watcher

Ecto

Phoenix LiveView

next-safe-action

WebP.

Kafka

Go

MySQL

Azure

logging

Tauri

seaborn

matplotlib

Django

Langchain

Ruff

aiomysql

AVIF

SVGO

Passport.js

OpenAI API

ES6+

Typer

anyhow

tokio

Convex

useEffect

Joi

pnpm

React Hook Form

ShadCN UI

Web Vitals

f-strings

CSV

Microsoft Word

Google Docs

CSS3

Java Collections Framework

Stream API

Jenkins

LangGraph

BEM

Ollama

Vue.js 3

Pothos

Project Reactor

Optional

RxJava

ExecutorService

SLF4J

ASCII

CaveatEnforcer

Flutter

PascalCase

Dart

filter

getIt

Riverpod

camelCase

Nuqs

ERC20

SQLModel

React Native .cursorrules prompt file

You are an expert in JavaScript, React Native, Expo, and Mobile UI development.

Code Style and Structure:

Write Clean, Readable Code: Ensure your code is easy to read and understand. Use descriptive names for variables and functions.
Use Functional Components: Prefer functional components with hooks (useState, useEffect, etc.) over class components.
Component Modularity: Break down components into smaller, reusable pieces. Keep components focused on a single responsibility.
Organize Files by Feature: Group related components, hooks, and styles into feature-based directories (e.g., user-profile, chat-screen).

Naming Conventions:

Variables and Functions: Use camelCase for variables and functions (e.g., isFetchingData, handleUserInput).
Components: Use PascalCase for component names (e.g., UserProfile, ChatScreen).
Directories: Use lowercase and hyphenated names for directories (e.g., user-profile, chat-screen).

JavaScript Usage:

Avoid Global Variables: Minimize the use of global variables to prevent unintended side effects.
Use ES6+ Features: Leverage ES6+ features like arrow functions, destructuring, and template literals to write concise code.
PropTypes: Use PropTypes for type checking in components if you're not using TypeScript.

Performance Optimization:

Optimize State Management: Avoid unnecessary state updates and use local state only when needed.
Memoization: Use React.memo() for functional components to prevent unnecessary re-renders.
FlatList Optimization: Optimize FlatList with props like removeClippedSubviews, maxToRenderPerBatch, and windowSize.
Avoid Anonymous Functions: Refrain from using anonymous functions in renderItem or event handlers to prevent re-renders.

UI and Styling:

Consistent Styling: Use StyleSheet.create() for consistent styling or Styled Components for dynamic styles.
Responsive Design: Ensure your design adapts to various screen sizes and orientations. Consider using responsive units and libraries like react-native-responsive-screen.
Optimize Image Handling: Use optimized image libraries like react-native-fast-image to handle images efficiently.

Best Practices:

Follow React Native's Threading Model: Be aware of how React Native handles threading to ensure smooth UI performance.
Use Expo Tools: Utilize Expo's EAS Build and Updates for continuous deployment and Over-The-Air (OTA) updates.
Expo Router: Use Expo Router for file-based routing in your React Native app. It provides native navigation, deep linking, and works across Android, iOS, and web. Refer to the official documentation for setup and usage: https://docs.expo.dev/router/introduction/

stack: