Learning React: A Hands-On Guide to Building Web Applications Using React and Redux, Second edition

Table of contents

1. Cover Page
2. Title Page
3. Copyright Page
4. About This E-Book
5. Accessing the Free Web Edition
6. Dedication
7. Contents at a Glance
8. Table of Contents
9. About the Author
10. Acknowledgments
11. 1 Introducing React
    1. Old-School Multipage Design
    2. New-School Single-Page Apps
    3. Meet React
       1. Automatic UI State Management
       2. Lightning-Fast DOM Manipulation
       3. APIs to Create Truly Composable UIs
       4. Visuals Defined Entirely in JavaScript
       5. Just the V in an MVC Architecture
    4. Conclusion
12. 2 Building Your First React App
    1. Dealing with JSX
    2. Getting Your React On
    3. Displaying Your Name
    4. It’s All Still Familiar
       1. Changing the Destination
       2. Styling It Up!
    5. Conclusion
13. 3 Components in React
    1. Quick Review of Functions
    2. Changing How We Deal with UI
    3. Meet the React Component
       1. Creating a Hello, World! Component
       2. Specifying Properties
       3. First Part: Updating the Component Definition
       4. Second Part: Modifying the Component Call
    4. Dealing with Children
    5. Conclusion
14. 4 Styling in React
    1. Displaying Some Vowels
    2. Styling React Content Using CSS
       1. Understand the Generated HTML
       2. Just Style It Already!
    3. Styling Content the React Way
       1. Creating a Style Object
       2. Actually Styling Our Content
       3. Making the Background Color Customizable
    4. Conclusion
15. 5 Creating Complex Components
    1. From Visuals to Components
       1. Identifying the Major Visual Elements
       2. Identifying the Components
    2. Creating the Components
       1. The Card Component
    3. The Square Component
    4. The Label Component
       1. Passing Properties, Again!
    5. Why Component Composability Rocks
    6. Conclusion
16. 6 Transferring Properties
    1. Problem Overview
    2. Detailed Look at the Problem
    3. Meet the Spread Operator
    4. A Better Way to Transfer Properties
    5. Conclusion
17. 7 Meet JSX…Again!
    1. What Happens with JSX?
    2. JSX Quirks to Remember
       1. Evaluating Expressions
       2. Returning Multiple Elements
       3. You Can’t Specify CSS Inline
       4. Comments
    3. Capitalization, HTML Elements, and Components
    4. Your JSX Can Be Anywhere
    5. Conclusion
18. 8 Dealing with State in React
    1. Using State
       1. Our Starting Point
    2. Getting Our Counter On
       1. Setting the Initial State Value
       2. Starting Our Timer and Setting State
       3. Rendering the State Change
    3. Optional: The Full Code
    4. Conclusion
19. 9 Going from Data to UI in React
    1. The Example
    2. Your JSX Can Be Anywhere, Part II
    3. Dealing with Arrays
    4. Conclusion
20. 10 Events in React
    1. Listening and Reacting to Events
       1. Starting Point
    2. Making the Button Click Do Something
    3. Event Properties
       1. Meet Synthetic Events
       2. Doing Stuff with Event Properties
    4. More Eventing Shenanigans
       1. You Can’t Directly Listen to Events on Components
       2. Listening to Regular DOM Events
       3. The Meaning of this Inside the Event Handler
    5. React…Why? Why?
       1. Browser Compatibility
       2. Improved Performance
    6. Conclusion
21. 11 The Component Lifecycle
    1. Meet the Lifecycle Methods
       1. See the Lifecycle Methods in Action
       2. The Initial Rendering Phase
       3. Getting the Default Props
       4. Getting the Default State
       5. componentWillMount
       6. render
       7. componentDidMount
       8. The Updating Phase
       9. Dealing with State Changes
       10. shouldComponentUpdate
       11. componentWillUpdate
       12. render
       13. componentDidUpdate
       14. Dealing with Prop Changes
       15. The Unmounting Phase
    2. Conclusion
22. 12 Accessing DOM Elements in React
    1. The Colorizer Example
    2. Meet Refs
    3. Using Portals
    4. Conclusion
23. 13 Setting Up Your React Dev Environment Easily
    1. Meet Create React
       1. Making Sense of What Happened
    2. Creating Our HelloWorld App
    3. Creating a Production Build
    4. Conclusion
24. 14 Working with External Data in React
    1. Web Request 101
    2. It’s React Time!
       1. Getting Started
    3. Getting the IP Address
       1. Kicking the Visuals Up a Notch
    4. Conclusion
25. 15 Building an Awesome Todo List App in React
    1. Getting Started
    2. Creating the Initial UI
    3. Building the Rest of the App
       1. Adding Items
    4. Displaying the Items
       1. Styling our App
       2. Removing Items
    5. Animation! Animation! Animation!
    6. Conclusion
26. 16 Creating a Sliding Menu in React
    1. How the Sliding Menu Works
    2. Setting Up the Sliding Menu
    3. Getting Started
    4. Showing and Hiding the Menu
       1. Creating the Button
       2. Creating the Menu
    5. Conclusion
27. 17 Avoiding Unnecessary Renders in React
    1. About the render Method
    2. Optimizing render Calls
       1. Getting an Example Going
    3. Seeing the render Calls
       1. Overriding a Component Update
       2. Using PureComponent
    4. Conclusion
28. 18 Creating a Single-Page App in React Using React Router
    1. The Example
    2. Getting Started
    3. Building Our Single-Page App
       1. Displaying the Initial Frame
       2. Creating Our Content Pages
       3. Using React Router
    4. It’s the Little Things
       1. Fixing Our Routing
       2. Adding Some CSS
       3. Highlighting the Active Link
    5. Conclusion
29. 19 Introduction to Redux
    1. What Is Redux?
    2. Building a Simple App Using Redux
       1. It’s Redux Time
       2. Lights! Camera! Action!
       3. Our Reducer
       4. Store Stuff
    3. Conclusion
30. 20 Using Redux with React
    1. Managing React State with Redux
       1. How Redux and React Overlap
       2. Getting Started
       3. Building the App
    2. Conclusion
31. Index
32. Code Snippets