Creating a Vite React application
In this section you will scaffold a Vite React application and set up Tailwind CSS for styling. This procedure has already been covered in Chapter 5, Setting Up a React workflow,, so you can refer to it. Make sure to complete the brief tutorial in Chapter 5, as the following guide is heavily based on the concepts presented therein.
You are going to use the create vite
command with the Node package manager to create your project through the following steps:
- Open your terminal client in a project directory containing the previously created backend folder, and issue the following command for creating a Vite React project:
npm create vite@latest frontend-app -- --template react
- Now, change the directory to the newly created
frontend-app
folder and install the dependencies and Tailwind:npm install -D tailwindcss postcss autoprefixer
- Initialize the Tailwind configuration—the following command creates a blank Tailwind configuration...