React
React — key terms
React: Add React to a Website
Ref: Adding a Ref to a Class Component
Ref: Adding a Ref to a DOM Element
Flow type checker with React: Adding Flow to a Project
Flow type checker with React: Adding Flow Type Annotations
TypeScript with React: Adding TypeScript to a Project
Components: Autobinding
Basic List Component
Bundling
Ref: Callback Refs
React DOM Elements: checked
Class.contextType
React DOM Elements: className
Code Splitting
The Diffing Algorithm: Component Elements Of The Same Type
Lifecycle: ComponentDidMount()
Components
Lifecycle: ComponentWillUnmount()
Components: Composing Components
Components: Conditional Rendering
TypeScript with React: Configuring the TypeScript Compiler
Container components
Context
Context.Consumer
Context.Provider
Controlled Components
Higher-Order Component: Convention: Maximizing Composability
Higher-Order Component: Convention: Pass Unrelated Props Through to the Wrapped Component
Higher-Order Component: Convention: Wrap the Display Name for Easy Debugging
React: Create React App
ReactDOM: createPortal()
Ref: Creating Refs
React DOM Elements: dangerouslySetInnerHTML
React Without ES6: Declaring Default Props
PropTypes: Default Prop Values
StrictMode: Detecting legacy context API
StrictMode: Detecting unexpected side effects
The Diffing Algorithm: DOM Elements Of The Same Type
Conditional Rendering: Element Variables
The Diffing Algorithm: Elements Of Different Types
Basic List Component: Embedding map() in JSX
Error Boundaries
Portals: Event Bubbling
Basic List Component: Extracting Components with Keys
TypeScript with React: File extensions in TypeScript
ReactTestUtils: findAllInRenderedTree()
ReactDOM: findDOMNode()
ReactTestUtils: findRenderedComponentWithType()
ReactTestUtils: findRenderedDOMComponentWithClass()
ReactTestUtils: findRenderedDOMComponentWithTag()
Flow Type Checker
Flow type checker with React
Components: Forwarding Refs
Fragments
Handling Events
Higher-Order Component
React DOM Elements: htmlFor
ReactDOM: hydrate()
StrictMode: Identifying unsafe lifecycles
import()
Conditional Rendering: Inline If with Logical && Operator
Conditional Rendering: Inline If-Else with Conditional Operator
ReactTestUtils: isCompositeComponent()
ReactTestUtils: isDOMComponent()
ReactTestUtils: isElement()
ReactTestUtils: isElementOfType()
JSX
Key
Fragments: Keyed Fragments
The Diffing Algorithm: Keys
Components: Lifecycle
State: Lifting State Up
Mixin
React Without ES6: Mixins in React without ES6
ReactTestUtils: mockComponent()
React.lazy: Named Exports
React DOM Elements: onChange
Handling Events: Passing Arguments to Event Handlers
Portals
Conditional Rendering: Preventing Component from Rendering
Props
PropTypes
React
React DOM Elements
React Elements
React Top-Level API
React Without ES6
React: React Without JSX
React.Children
React.Children: React.Children.count
React.Children: React.Children.forEach
React.Children: React.Children.map
React.Children: React.Children.only
React.Children: React.Children.toArray
React Top-Level API: React.cloneElement()
React.createContext
React Top-Level API: React.createElement()
React Top-Level API: React.createFactory()
React Top-Level API: React.createRef
React.forwardRef
React Top-Level API: React.isValidElement()
React.lazy
React.memo
React.PureComponent
ReactDOM
ReactDOMServer
ReactTestUtils
The Diffing Algorithm: Recursing On Children
Ref
Ref: Refs and Function Components
Render Prop
ReactDOM: render()
Lifecycle: Render()
React Elements: Rendering an Element into the DOM
ReactTestUtils: renderIntoDocument()
ReactDOMServer: renderToNodeStream()
ReactDOMServer: renderToStaticMarkup()
ReactDOMServer: renderToStaticNodeStream()
ReactDOMServer: renderToString()
PropTypes: Requiring Single Child
Code Splitting: Route-based code splitting
Flow type checker with React: Running Flow
TypeScript with React: Running TypeScript
ReactTestUtils: scryRenderedComponentsWithType()
ReactTestUtils: scryRenderedDOMComponentsWithClass()
ReactTestUtils: scryRenderedDOMComponentsWithTag()
React DOM Elements: selected
React Without ES6: Setting the Initial State
Shallow Rendering
Shallow Rendering: shallowRenderer.getRenderOutput()
Shallow Rendering: shallowRenderer.render()
Fragments: Short Syntax
ReactTestUtils: Simulate
State
Static type checker
Add React to a Website: Step 1: Add a DOM Container to the HTML
Add React to a Website: Step 2: Add the Script Tags
Add React to a Website: Step 3: Create a React Component
StrictMode
Flow type checker with React: Stripping Flow Syntax from the Compiled Code
React DOM Elements: style
React DOM Elements: suppressContentEditableWarning
React DOM Elements: suppressHydrationWarning
Suspense
Test Renderer
Test Renderer: testInstance.children
Test Renderer: testInstance.find()
Test Renderer: testInstance.findAll()
Test Renderer: testInstance.findAllByProps()
Test Renderer: TestInstance.findAllByType()
Test Renderer: testInstance.findByProps()
Test Renderer: testInstance.findByType()
Test Renderer: testInstance.instance
Test Renderer: testInstance.parent
Test Renderer: testInstance.props
Test Renderer: testInstance.type
Test Renderer: TestRenderer.create()
Test Renderer: testRenderer.getInstance()
Test Renderer: testRenderer.root
Test Renderer: testRenderer.toJSON()
Test Renderer: testRenderer.toTree()
Test Renderer: testRenderer.unmount()
Test Renderer: testRenderer.update()
The Diffing Algorithm
The file input Tag
The select Tag
The textarea Tag
TypeScript: Type Definitions
TypeScript
TypeScript with React
Uncontrolled Components
ReactDOM: unmountComponentAtNode()
React Elements: Updating the Rendered Element
Render Prop: Use Render Props for Cross-Cutting Concerns
Render Prop: Using Props Other Than render
Web Components: Using React in your Web Components
Render Prop: Using Render Props with React.PureComponent
TypeScript with React: Using TypeScript with Create React App
Web Components: Using Web Components in React
React DOM Elements: value
StrictMode: Warning about deprecated findDOMNode usage
StrictMode: Warning about legacy string ref API usage
Web Components
Ref: When to Use Refs
React — Domain interactive map
Clickable & draggable!