Debugging Common React Errors

In this lesson you will diagnose the most common React errors: missing-key warnings, undefined state bugs, too many re-renders, and hydration mismatches.

React logs: *Each child in a list should have a unique "key" prop.* This happens when you render an array without adding a `key` prop. Fix it by adding a stable, unique key to each list item.

// Bad
items.map(item => <li>{item.name}</li>)

// Good
items.map(item => <li key={item.id}>{item.name}</li>)