Browse

Expo Router .cursorrules prompt files

Expo Router is a navigation tool for Expo and React Native apps that simplifies the management of app routes, enhancing the user experience with streamlined navigation.

Filters

All

React

Tailwind CSS

Filters

Tech

Clear

Local Storage

React Context API

Mockito

Java Platform Module System (JPMS)

DeepLearning4J

Terraform

Spring Framework

Java Cryptography Architecture (JCA)

Eureka Server

Hibernate

Ansible

Jenkins

Stream API

Hadoop

Spring MVC

Spark

JBehave

Cucumber

Java Collections Framework

Spring Cloud Gateway

JUnit 5

Logback

Spring Boot Actuator

Java Persistence API (JPA)

CSS3

Franklin

Google Docs

Airbnb’s JavaScript Style Guide.

Microsoft Word

Helix

Adobe Edge Delivery Services

CSV

uvicorn

SqlAlchemy 2.0

arq

Alembic

Postgres v3.12

LINQ

Moq

MSTest

ASP.NET Core

AutoMapper

Entity Framework Core

IMemoryCache

Fluent Validation

NUnit

NSubstitute

Dependency Injection

Swashbuckle.AspNetCore

xUnit

RESTful

Poetry

with statements

bcrypt

ReDoc

Python's logging module

async support

dependency injection

Factory Boy

list comprehensions

Swagger UI

requirements.txt

FastAPI's TestClient

Dockerfiles

docstrings

parse_obj_as

type hints

Bootstrap

decorators

Jinja2

generator expressions

BaseSettings

context managers

Sveltekit 2

CDN

Firebase CLI

Firebase Crashlytics

Firebase Firestore

Xcode

Google Analytics

Firebase Authentication

Firebase Cloud Messaging

Android Studio

Firebase Storage

React Native CLI

Firebase Emulator Suite

Twitter Card

sitemap.xml

Open Graph

Web Vitals

Psycopg2-binary

Uvicorn

Python-Multipart

mysql

Nextjs 14

nuqs

Next.js SSR

React Server Components

pnpm

Vue Router 4

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:

React Native .cursorrules prompt file

Grzegorz Wolfinger

0

NEW

TypeScript Code Convention .cursorrules prompt file

You are an expert in TypeScript, Node.js, Next.js App Router, React, Expo, tRPC, Shadcn UI, Radix UI, and Tailwind.

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

Naming Conventions:

Use lowercase with dashes for directories (e.g., components/auth-wizard)
Favor named exports for components

TypeScript Usage:

Use TypeScript for all code; prefer interfaces over types
Avoid enums; use maps instead
Use functional components with TypeScript interfaces

Syntax and Formatting:

Use the "function" keyword for pure functions
Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements
Use declarative JSX

Error Handling and Validation:

Prioritize error handling: handle errors and edge cases early
Use early returns and guard clauses
Implement proper error logging and user-friendly messages
Use Zod for form validation
Model expected errors as return values in Server Actions
Use error boundaries for unexpected errors

UI and Styling:

Use Shadcn UI, Radix, and Tailwind for components and styling in the Next.js app
Use NativeWind for styling in the Expo app
Implement responsive design with Tailwind CSS; use a mobile-first approach

Key Conventions:

Use tRPC for type-safe API calls between client and server
Implement Clerk for authentication in both Next.js and Expo apps
Use Lucide icons for Next.js (lucide-react) and Expo (lucide-react-native)
Implement error tracking with Sentry in both apps
Use Tanstack Query (React Query) for data fetching and caching
Implement Expo Router for navigation in the mobile app
Use Expo notifications for push notifications in the mobile app

Performance Optimization:

Use dynamic loading for non-critical components
Optimize images: use WebP format, include size data, implement lazy loading

Next.js Specific:

Follow Next.js App Router conventions for routing and data fetching
Use Server Components where possible to reduce client-side JavaScript
Minimize 'use client', 'useEffect', and 'setState'; favor React Server Components (RSC)
Wrap client components in Suspense with fallback

Expo Specific: