Components Before Abstractions
Every subchapter in this chapter, free to read online. Work through them in order, or open the concept required by your current project.
Component Identity and Capitalization
Learn how JSX chooses host elements or component bindings and why stable function identity affects React's component tree.
Component Files, Imports, and Exports
Move components across ES modules, choose named or default exports, and keep the first module graph readable.
Returning One UI Tree
Follow one component call to one returned React node, build valid nested markup, and make every empty result explicit.
Props as Inputs
Pass values from a parent element into a component call, read one props object, apply defaults, and leave source data unchanged.
Children as Composition
Pass nested React content through the children prop and separate a wrapper's structure from the content selected by its parent.
Conditional UI in the First App
Render complete UI states from props with early returns, conditional expressions, and explicit empty results.