State & Hooks

useState

import { useState } from 'react';
import { Button, Text, View } from 'react-native';

function Counter() {
  const [count, setCount] = useState(0);
  return (
    <View>
      <Text>Count: {count}</Text>
      <Button title="Add" onPress={() => setCount(count + 1)} />
    </View>
  );
}

useEffect (side effects)

import { useEffect, useState } from 'react';

function Clock() {
  const [time, setTime] = useState(new Date());
  useEffect(() => {
    const id = setInterval(() => setTime(new Date()), 1000);
    return () => clearInterval(id);   // cleanup on unmount
  }, []);                             // [] = run once
  return <Text>{time.toLocaleTimeString()}</Text>;
}

Rules of hooks: only call them at the top level of a component, never inside loops or conditions. Never mutate state directly — always use the setter.