If you want to learn how to build efficient React applications, this is your book. Ideal for web developers and software engineers who understand how JavaScript, CSS, and HTML work in the browser, this updated edition provides best practices and patterns for writing modern React code. No prior knowledge of React or functional JavaScript is necessary.
With their learning road map, authors Alex Banks and Eve Porcello show you how to create UIs that can deftly display changes without page reloads on large-scale, data-driven websites. You’ll also discover how to work with functional programming and the latest ECMAScript features. Once you learn how to build React components with this hands-on guide, you’ll understand just how useful React can be in your organization.
• Understand key functional programming concepts with JavaScript
• Look under the hood to learn how React runs in the browser
• Create application presentation layers with React components
• Manage data and reduce the time you spend debugging applications
• Incorporate React Hooks to manage state and fetch data
• Use a routing solution for single-page application features
• Learn how to structure React applications with servers in mind
Author(s): Alex Banks, Eve Porcello
Edition: 2
Publisher: O'Reilly Media
Year: 2020
Language: English
Commentary: Vector PDF
Pages: 310
City: Sebastopol, CA
Tags: Programming; JavaScript; Web Applications; Functional Programming; Asynchronous Programming; DOM; Node.js; React; Testing; Routing; JSX; Stateful Applications; Test-Driven Development; Next.js
Copyright
Table of Contents
Preface
Conventions Used in This Book
Using Code Examples
O’Reilly Online Learning
How to Contact Us
Acknowledgments
Chapter 1. Welcome to React
A Strong Foundation
React’s Past and Future
Learning React: Second Edition Changes
Working with the Files
File Repository
React Developer Tools
Installing Node.js
Chapter 2. JavaScript for React
Declaring Variables
The const Keyword
The let Keyword
Template Strings
Creating Functions
Function Declarations
Function Expressions
Default Parameters
Arrow Functions
Compiling JavaScript
Objects and Arrays
Destructuring Objects
Destructuring Arrays
Object Literal Enhancement
The Spread Operator
Asynchronous JavaScript
Simple Promises with Fetch
Async/Await
Building Promises
Classes
ES6 Modules
CommonJS
Chapter 3. Functional Programming with JavaScript
What It Means to Be Functional
Imperative Versus Declarative
Functional Concepts
Immutability
Pure Functions
Data Transformations
Higher-Order Functions
Recursion
Composition
Putting It All Together
Chapter 4. How React Works
Page Setup
React Elements
ReactDOM
Children
React Components
React Components: A Historical Tour
Chapter 5. React with JSX
React Elements as JSX
JSX Tips
Mapping Arrays with JSX
Babel
Recipes as JSX
React Fragments
Intro to webpack
Creating the Project
Loading the Bundle
Source Mapping
Create React App
Chapter 6. React State Management
Building a Star Rating Component
The useState Hook
Refactoring for Advanced Reusability
State in Component Trees
Sending State Down a Component Tree
Sending Interactions Back up a Component Tree
Building Forms
Using Refs
Controlled Components
Creating Custom Hooks
Adding Colors to State
React Context
Placing Colors in Context
Retrieving Colors with useContext
Stateful Context Providers
Custom Hooks with Context
Chapter 7. Enhancing Components with Hooks
Introducing useEffect
The Dependency Array
Deep Checking Dependencies
When to useLayoutEffect
Rules to Follow with Hooks
Improving Code with useReducer
useReducer to Handle Complex State
Improving Component Performance
shouldComponentUpdate and PureComponent
When to Refactor
Chapter 8. Incorporating Data
Requesting Data
Sending Data with a Request
Uploading Files with fetch
Authorized Requests
Saving Data Locally
Handling Promise States
Render Props
Virtualized Lists
Creating a Fetch Hook
Creating a Fetch Component
Handling Multiple Requests
Memozing Values
Waterfall Requests
Throttling the Network Speed
Parallel Requests
Waiting for Values
Canceling Requests
Introducing GraphQL
GitHub GraphQL API
Making a GraphQL Request
Chapter 9. Suspense
Error Boundaries
Code Splitting
Introducing: The Suspense Component
Using Suspense with Data
Throwing Promises
Building Suspenseful Data Sources
Fiber
Chapter 10. React Testing
ESLint
ESLint Plug-Ins
Prettier
Configuring Prettier by Project
Prettier in VSCode
Typechecking for React Applications
PropTypes
Flow
TypeScript
Test-Driven Development
TDD and Learning
Incorporating Jest
Create React App and Testing
Testing React Components
Queries
Testing Events
Using Code Coverage
Chapter 11. React Router
Incorporating the Router
Router Properties
Nesting Routes
Using Redirects
Routing Parameters
Chapter 12. React and the Server
Isomorphic Versus Universal
Client and Server Domains
Server Rendering React
Server Rendering with Next.js
Gatsby
React in the Future
Index
About the Authors
Colophon
