React Setup with Vite🌱 Beginner

The fastest and most modern way to bootstrap a new React application is by using Vite. It is a blazing-fast build tool that has entirely replaced older tools like Create React App.

What is Vite?

Vite (French for "quick") is a next-generation frontend tooling system. When building React apps, you need a bundler to translate your JSX and modern JavaScript down to standard code that older browsers can understand. Vite does this almost instantly.

Why Use Vite over Create React App?

For years, create-react-app (CRA) was the standard. However, CRA relies on Webpack, which can take agonizing minutes to start up on large enterprise applications. Vite leverages native ES Modules, meaning your local development server boots in milliseconds, regardless of how massive your app becomes.

How to Scaffold a React App

You need Node.js installed on your machine. Open your terminal and run the Vite scaffolding command:

# 1. Run the Vite initializer and name your project 'my-react-app'
npm create vite@latest my-react-app -- --template react

# 2. Navigate into the new folder
cd my-react-app

# 3. Install all the necessary dependencies
npm install

# 4. Start the blazing-fast local development server!
npm run dev

Your new React app is now running, typically at http://localhost:5173.