20 Creating a React app

 

This chapter covers

  • Building a React project
  • Setting up React components using the JSX format
  • Creating class-based and function-based components
  • Putting together a data store that stores local data and consumes an HTTP API

In this chapter, I start the process of creating a React application that has the same features as the standalone and Angular examples from earlier chapters. TypeScript is optional in React development, but there is good support available, and React development with TypeScript provides a good developer experience. For quick reference, table 20.1 lists the TypeScript compiler options used in this chapter.

20.1 Preparing for this chapter

20.1.1 Configuring the web service

20.1.2 Installing the Bootstrap CSS package

20.1.3 Starting the example application

20.2 Understanding TypeScript in React development

20.3 Defining the entity types

20.4 Displaying a filtered list of products

20.4.1 Using a functional component and hooks

20.4.2 Displaying a list of categories and the header

20.4.3 Composing and testing the components

20.5 Creating the data store

20.5.1 Implementing the HTTP API clients

Summary