Building Web Applications with React 16

• Employing React.createElement() and React.DOM.render()
• Support well-designed components by leveraging imports
• Dynamically generating the UI

• Coding custom component classes
• Generating component output with the render method
• Composing a JSX component hierarchy
• Extending the hierarchy with the Container/Presentational design pattern
• Understanding the differences between JSX and HTML

Parameterising components

• Disambiguating component properties and state
• Leveraging the children props to pass content dynamically
• Inserting properties into rendered output with this.props
• Improving maintainability and reliability with defaultProps and proptTypes
• Centralising logic at the container level by passing functions as props
• Integrating stateless functional components

Manipulating component state

• Separating component state from component behaviour
• Reading application data with this.state
• Mutating data with this.setState()
• Efficiently managing state to improve performance
• Best practices for sharing state with createContext

Integrating into the component life cycle

• Attaching and detaching logic and event handlers in componentDidMount and componentWillUnmount
• Enhancing performance with componentShouldUpdate

Routing between components

• Exploiting the react-router for semantic URLs
• Mapping URL paths and parameters to components

• Working with interactive properties
• Capturing form component updates with onChange
• Exploiting controlled components

• Applying the onChange / setState() convention
• Reducing onChange clutter for clearner code

Modelling client-side data interactivity

• Architecting loosely-coupled applications for extensibility
• Managing state centrally
• Interacting with data using actions, reducers, and stores
• Defining reducers to correctly manage updates, deletes, and inserts

Coding a Redux application

• Best practices when implementing Redux
• Creating a Redux data store
• Using the React-Redux Higher-Order Components
• Sharing state between containers and presentational components
• Integrating multiple stores/reducers in large applications to avoid complexity
• Reviewing alternatives: Mbox, alt, Relay, Flux, and Reflux

Connecting React to RESTful services

• Making Ajax calls from React using thunk and promises
• Integrating isomorphic-fetch to support client and server-side access
• Mapping CRUD access to REST actions
• Reviewing alternatives

Developer tools

• Inspecting React components with browser extensions
• Identifying and debugging rendering errors

Unit testing

• Running tests with Jest
• Isolating code under test with Enzyme

Performance testing

• Establishing a baseline
• Analysing performance with Flamegraphs
• Optimising component reconciliation with key

• Optimising runtime performance with shouldComponentUpdate
• Extending your components with Higher Order Components