Guided Notes
Introduction to React
Components, JSX, and the mental model.
React builds user interfaces out of components — small, reusable functions that return what should appear on screen. A page is just a tree of components nested inside each other.
JSX lets you write HTML-like syntax directly inside JavaScript: `function Greeting() { return <h1>Hello!</h1>; }`. Under the hood, JSX compiles to plain JavaScript function calls.
React re-renders a component automatically whenever its state changes — you describe what the UI should look like for a given state, and React handles updating the actual DOM to match.