Creating the project
We will develop our form using Visual Studio Code and a new Create React App-based project setup. We’ve previously covered this several times, so we will not cover the steps in this chapter – instead, see Chapter 3, Setting Up React and TypeScript.
We will style the form with Tailwind CSS. We also previously covered how to install and configure Tailwind in Create React App in Chapter 5, Approaches to Styling Frontends. So, after you have created the React and TypeScript project, install and configure Tailwind.
We will also use the @tailwindcss/forms
plugin to style the form. So, install this plugin as well – see Chapter 7, Working with Forms, for information on how to do this.
The app we will build will contain a header and some content beneath it. Here is the component structure we will create:
Figure 8.1 – App component structure
The header will have a Sign in button to authenticate and authorize...