React Setup with Vite – Step-by-Step Guide

Let’s quickly set up React using Vite – the fast, modern way recommended by React itself.


Install Node.js

  1. Go to nodejs.org
  2. Download the LTS (Long Term Support) version
  3. Complete the installation


Verify installation:

Open your terminal and run:

node -v
npm -v


Install VS Code

Download from code.visualstudio.com

This is where you’ll write and run all your React code.


Install Vite

Why Vite?

  1. Officially recommended by React docs
  2. Super fast dev server 🚀
  3. Cleaner build process
  4. Supports TypeScript, CSS modules, pre-processors, and more!


Go to vite.dev


Install Vite via Terminal:

npm create vite@latest


Follow the prompts:

  1. Project Name – Type your desired project name
  2. Select Framework – Choose React
  3. Variant – Select JavaScript
  4. Hit Enter!


Install Node Modules


Once Vite setup is done, run:

npm install


Open Project in VS Code

code .

This opens your project directly in VS Code.


Run the React App

npm run dev

Your project should now run on localhost:5173 (Vite’s default port).


Test It Works!

Go to src/App.jsx (or src/App.js) and replace the code with:

<h1>Code Step by Step</h1>
<h1>Hello React 19</h1>

You’re all set! React 19 is now running with Vite!