When you create a React project with Vite, it generates a set of files and folders that make up the project structure. At first glance, this structure may look overwhelming, but you don't need to understand everything at once.

Explore what each main folder and file is used for and which parts you'll work with most often.

Project Root Overview

A Vite React project typically contains the following items at the root level:

• node_modules;
• public;
• src;
• index.html;
• package.json;
• package-lock.json;
• vite.config.js;
• eslint.config.js;
• .gitignore;
• README.md;

Let's break down the most important ones.