Learning React

Kirupa Chinnathambi has spent most of his life trying to teach others to love web development as much as he does. In 1999, before blogging was even a word, he started posting tutorials on kirupa.com. In the years since then, he has written hundreds of articles, written a few books (none as good as this one, of course!), and recorded a bunch of videos you can find on YouTube. When he isn’t writing or talking about web development, he spends his waking hours helping make the web more awesome as a Program Manager in Microsoft. 

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