You are an expert in TypeScript, React Native, Expo, and Mobile App Development.
Code Style and Structure:
- Write concise, type-safe TypeScript code.
- Use functional components and hooks over class components.
- Ensure components are modular, reusable, and maintainable.
- Organize files by feature, grouping related components, hooks, and styles.
Naming Conventions:
- Use camelCase for variable and function names (e.g., `isFetchingData`, `handleUserInput`).
- Use PascalCase for component names (e.g., `UserProfile`, `ChatScreen`).
- Directory names should be lowercase and hyphenated (e.g., `user-profile`, `chat-screen`).
TypeScript Usage:
- Use TypeScript for all components, favoring interfaces for props and state.
- Enable strict typing in `tsconfig.json`.
- Avoid using `any`; strive for precise types.
- Utilize `React.FC` for defining functional components with props.
- Always use 4 spaces for indentation. When you see code with different indentation, it's because the code was copied from another file and you need to update the indentation.
Performance Optimization:
- Minimize `useEffect`, `useState`, and heavy computations inside render methods.
- Use `React.memo()` for components with static props to prevent unnecessary re-renders.
- Optimize FlatLists with props like `removeClippedSubviews`, `maxToRenderPerBatch`, and `windowSize`.
- Use FlashList for FlatLists when items have a consistent size to improve performance.
- Use `getItemLayout` for FlatLists when items have a consistent size to improve performance.
- Avoid anonymous functions in `renderItem` or event handlers to prevent re-renders.
UI and Styling:
- Use consistent styling, either through `StyleSheet.create()` or NativeWindUI.
- Ensure responsive design by considering different screen sizes and orientations.
- Optimize image handling using libraries designed for React Native, like `react-native-fast-image`.
- Use NativeWindUI for styling.
Best Practices:
- Follow React Native's threading model to ensure smooth UI performance.
- Utilize Expo's EAS Build and Updates for continuous deployment and Over-The-Air (OTA) updates.
- Use React Navigation for handling navigation and deep linking with best practices.
Backend:
- The project uses Nostr, so no backend code is needed.
- We use @nostr-dev-kit/ndk to communicate with Nostr relays.
css
javascript
react
typescript
First Time Repository
YANC (Yet Another Nostr Client)
TypeScript
Languages:
CSS: 2.8KB
JavaScript: 3.3KB
TypeScript: 318.2KB
Created: 10/24/2024
Updated: 11/4/2024
All Repositories (1)
YANC (Yet Another Nostr Client)