Learning React : Modern Patterns for Developing React Apps

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 programming is necessary. 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 Explore React's component lifecycle to improve UI performance Use a routing solution for single-page application features Learn how to structure React applications with servers in mind Preface Conventions Used in This Book Using Code Examples O’Reilly Online Learning How to Contact Us Acknowledgments 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 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 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 4. How React Works Page Setup React Elements ReactDOM Children React Components React Components: A Historical Tour 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 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 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 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 9. Suspense Error Boundaries Code Splitting Introducing: The Suspense Component Using Suspense with Data Throwing Promises Building Suspenseful Data Sources Fiber 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 11. React Router Incorporating the Router Router Properties Nesting Routes Using Redirects Routing Parameters 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 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 JavaScriptLook under the hood to learn how React runs in the browserCreate application presentation layers with React componentsManage data and reduce the time you spend debugging applicationsIncorporate React Hooks to manage state and fetch dataUse a routing solution for single-page application featuresLearn how to structure React applications with servers in mind This book is for developers who want to learn the React library while learning the latest techniques currently emerging in the JavaScript language. This book does not assume any knowledge of React at all, but you will be better prepared for the contents of this book if you are comfortable with HTML, CSS, and JavaScript.