Learning React

Chapter 1 Introducing React
Old School Multi-Page Design
New School Single-Page Apps
Meet React
Automatic UI State Management
Lightning-fast DOM Manipulation
APIs to Create Truly Composable UIs
Visuals Defined Entirely in JavaScript
Just the V in an MVC Architecture
Chapter 2 Building Your First React App
Dealing with JSX
Getting Your React On
Displaying Your Name
It's All Still Familiar
Changing the Destination Styling It Up!
Chapter 3 Components in React
A Quick Review of Functions
Changing How We Deal with the UI
Meet the React Component
Creating a Hello, World! Component
Specifying Properties
Dealing with Children
Chapter 4 Styling in React
Displaying Some Vowels
Styling React Content Using CSS
Understand the Generated HTML
Just Style It Already!
Styling Content the React Way
Creating a Style Object
Actually Styling Our Content
You Can Omit the "px" Suffix
Making the Background Color Customizable
Chapter 5 Creating Complex Components
From Visuals to Components
Identifying the Major Visual Elements
Identifying the Components
Creating the Components
The Card Component
The Square Component
The Label Component
Passing Properties, Again!
Why Component Composability Rocks
Chapter 6 Transferring Properties (Props)
Problem Overview
Detailed Look at the Problem
Meet the Spread Operator
Properly Transferring Properties
Chapter 7 Meet JSX-Again!
What Happens with JSX?
JSX Quirks to Remembe
You Can Only Return A Single Root Node
You Can't Specify CSS Inline
Reserved Keywords and className
Comments
Capitalization, HTML Elements, and Components
Your JSX Can Be Anywhere
Chapter 8 Dealing with State
Using State
Our Starting Point
Getting Our Counter On
Setting the Initial State Value
Starting Our Timer and Setting State
Rendering the State Change
Optional: The Full Code
Conclusion
Chapter 9 Going from Data to UI
The Example
Your JSX Can Be Anywhere-Part II
Dealing with Arrays in the Context of JSX
Chapter 10 Working with Events
Listening and Reacting to Events
Starting Point
Making the Button Click Do Something
Event Properties
Doing Stuff With Event Properties
More Eventing Shenanigans
Listening to Regular DOM Events
The Meaning of this Inside the Event Handler
React...Why? Why?!
Browser Compatibility
Improved Performance
Chapter 11 The Component Lifecycle
Meet the Lifecycle Methods
See the Lifecycle Methods in Action
The Initial Rendering Phase
The Updating Phase
The Unmounting Phase
Chapter 12 Accessing DOM Elements
Meet Refs
Chapter 13 Creating a Single-Page App Using React Router
The Example
Building the App
Displaying the Initial Frame
Displaying the Home Page
Interim Cleanup Time
Displaying the Home Page Correctly
Creating the Navigation Links
Adding the Stuff and Contact Views
Creating Active Links
Chapter 14 Building a Todo List App
Getting Started
Creating the UI
Creating the Functionality
Initializing our State Object
Handling the Form Submit
Populating Our State
Displaying the Tasks
Adding the Finishing Touches
Chapter 15 Setting Up Your React Development Environment
Meet the Tools
Node.js
Babel
webpack
Your Code Editor
It Is Environment Setup Time!
Setting up our Initial Project Structure
Installing and Initializing Node.js
Installing the React Dependencies
Adding our JSX File
Going from JSX to JavaScript
Building and Testing Our App
Chapter 16 The End