Thuta Learning
BasicWeb Developmentintermediate

Get Started (Vite)

Relax. We'll talk through this in plain words — no textbook voice.

Using Vite is one of the easiest ways to start a React project on your local computer. Vite spins up a fast development server and gives you a clean, tidy React project folder structure right from the start.

jsx
# 1. Create a React project with Vite
npm create vite@latest my-react-app -- --template react

# 2. Move into the project folder
cd my-react-app

# 3. Install project dependencies
npm install

# 4. Start the local development server
npm run dev

The first command creates a Vite project with the React template. `cd` moves you into the project folder, `npm install` installs the required packages, and `npm run dev` starts the local preview server.

You should see
A URL like `Local: http://localhost:5173/` will appear in the terminal, and you'll be able to view the React starter page in your browser.

Info

You'll usually start writing React code in `src/App.jsx`. Once you make a change and save, the browser will refresh automatically.

Easy traps

  • A common mistake is running `npm install` without first entering the project folder. You need to run it inside the project folder that contains `package.json`.