Learn React with TypeScript - Second Edition

By : Carl Rippon

4.4 (8)

Buy this Book

Learn React with TypeScript - Second Edition

4.4 (8)

By: Carl Rippon

Buy this Book

Overview of this book

Reading, navigating, and debugging a large frontend codebase is a major issue faced by frontend developers. This book is designed to help web developers like you learn about ReactJS and TypeScript, both of which power large-scale apps for many organizations. This second edition of Learn React with TypeScript is updated, enhanced, and improved to cover new features of React 18 including hooks, state management libraries, and features of TypeScript 4. The book will enable you to create well-structured and reusable React components that are easy to read and maintain, leveraging modern design patterns. You’ll be able to ensure that all your components are type-safe, making the most of TypeScript features, including some advanced types. You’ll also learn how to manage complex states using Redux and how to interact with a GraphQL web API. Finally, you’ll discover how to write robust unit tests for React components using Jest. By the end of the book, you’ll be well-equipped to use both React and TypeScript.

Preface

Who this book is for

What this book covers

To get the most out of this book

Download the example code files

Download the color images

Conventions used

Get in touch

Share Your Thoughts

Download a free PDF copy of this book

Part 1: Introduction

Free Chapter

Chapter 1: Introducing React

Technical requirements

Understanding the benefits of React

Understanding JSX

Creating a component

Understanding imports and exports

Summary

Answers

Chapter 2: Introducing TypeScript

Technical requirements

Understanding the benefits of TypeScript

Understanding JavaScript types

Using basic TypeScript types

Creating TypeScript types

Using the TypeScript compiler

Summary

Questions

Answers

Chapter 3: Setting Up React and TypeScript

Technical requirements

Creating a project with webpack

Creating a project with Create React App

Creating a React and TypeScript component

Summary

Questions

Answers

Chapter 4: Using React Hooks

Technical requirements

Using the effect Hook

Using state Hooks

Using the ref Hook

Using the memo Hook

Using the callback Hook

Summary

Questions

Answers

Part 2: App Fundamentals

Chapter 5: Approaches to Styling React Frontends

Technical requirements

Summary

Answers

Chapter 6: Routing with React Router

Technical requirements

Introducing React Router

Declaring routes

Creating navigation

Using nested routes

Using route parameters

Creating an error page

Using index routes

Using search parameters

Navigating programmatically

Using form navigation

Implementing lazy loading

Summary

Questions

Answers

Chapter 7: Working with Forms

Technical requirements

Using controlled fields

Using uncontrolled fields

Using React Router Form

Using native validation

Using React Hook Form

Summary

Questions

Answers

Part 3: Data

Chapter 8: State Management

Technical requirements

Summary

Answers

Chapter 9: Interacting with RESTful APIs

Technical requirements

Creating the project

Using the effect hook with fetch

Posting data with fetch

Using React Router

Using React Query

Using React Router with React Query

Summary

Questions

Answers

Chapter 10: Interacting with GraphQL APIs

Technical requirements

Understanding the GraphQL syntax

Setting up the project

Using React Query with fetch

Using Apollo Client

Summary

Questions

Answers

Part 4: Advanced React

Chapter 11: Reusable Components

Technical requirements

Creating the project

Using generic props

Using props spreading

Using render props

Adding checked functionality

Creating custom hooks

Allowing the internal state to be controlled

Summary

Questions

Answers

Chapter 12: Unit Testing with Jest and React Testing Library

Technical requirements

Testing pure functions

Testing components

Simulating user interactions

Getting code coverage