Code Patterns & Practices

Code Patterns & Practices

Common patterns and best practices for React Native development.

When to Use

• Implementing new features
• Refactoring existing code
• Choosing architecture patterns
• Solving common problems
• Improving code quality

Component Patterns

Custom Hooks

// Extract reusable logic
function useToggle(initial = false) {
  const [value, setValue] = useState(initial);
  const toggle = useCallback(() => setValue(v => !v), []);
  return [value, toggle] as const;
}

// Usage
const [isOpen, toggleOpen] = useToggle();

Compound Components

// Create flexible component APIs
interface TabsProps {
  children: React.ReactNode;
  defaultValue?: string;
}

function Tabs({ children, defaultValue }: TabsProps) {
  const [active, setActive] = useState(defaultValue);