How to Run a React App

What you’ll build or solve

You’ll start a React development server and open your app locally. By the end, your project will be running at a localhost URL and ready for editing.

When this approach works best

This method works best when:

• You just cloned a React project and want to see it in the browser.
• You created a new app with Create React App or Vite.
• You are actively developing features and need live reload while coding.

This is not the right approach for deploying to production. Running locally is for development only.

Prerequisites

Before running the app, you need:

• Node.js installed (16+ recommended)
• A React project folder on your machine
• Project dependencies already installed with npm install, yarn install, or pnpm install
• node -v and npm -v return version numbers in your terminal

No advanced React knowledge is required.

Step-by-step instructions

Step 1: Start the development server

Open your terminal and navigate to your React project folder:

cd my-react-app

Check the scripts section inside package.json to see which command starts the app.

A typical scripts section looks like this:

{
  "scripts": {
    "start":"react-scripts start",
    "dev":"vite"
  }
}

Now run the appropriate command.

For Create React App projects:

npmstart

For Vite projects:

npm run dev

If the project uses Yarn:

yarnstart

or

yarn dev

If it uses pnpm:

pnpmstart

or

pnpm dev

After running the command, the terminal will show a local URL, usually:

http://localhost:3000

or

http://localhost:5173

Open that URL in your browser.

What to look for

• The browser displays your React app.
• The terminal shows a message like “compiled successfully” or similar.
• If you edit a file inside src and save it, the browser reloads automatically.

If the port is already in use, the terminal may suggest another port. You can accept it or set a different one.

Set a custom port (macOS or Linux)

PORT=4000npmstart

Set a custom port (Windows PowerShell)

$env:PORT=4000;npmstart

To stop the server, press Ctrl + C in the terminal.

Examples you can copy

Example 1: Run a new Vite project

cd my-react-app
npm install
npm run dev

Then open the URL shown in the terminal.

Example 2: Run a Create React App project

cd my-app
npm install
npmstart

The browser should automatically open at http://localhost:3000.

Example 3: Run a project that uses a custom script name

Check package.json:

{
  "scripts": {
    "dev-server":"vite"
  }
}

Run:

npm run dev-server

Always use the exact script name defined in package.json.

Common mistakes and how to fix them

Mistake 1: Running the command outside the project folder

What you might do:

npmstart

from your home directory.

Why it breaks:

There is no package.json file there, so npm does not know which script to run.

Correct approach:

cd my-react-app
npmstart

Mistake 2: Forgetting to install dependencies

What you might do:

Run npm start immediately after cloning a project.

Why it breaks:

The required packages are missing because node_modules has not been created yet.

Correct approach:

npm install
npmstart

Mistake 3: Using the wrong script name

What you might do:

npmstart

in a Vite project that only defines dev.

Why it breaks:

There is no start script defined in package.json.

Correct approach:

Open package.json and run the correct script:

npm run dev

Troubleshooting

If you see command not found: npm, install Node.js and restart your terminal.

If you see EADDRINUSE, another process is using the port. Stop that process or choose a different port.

If the browser shows a blank page, check the terminal for compilation errors.

If changes do not trigger a reload, stop the server with Ctrl + C and start it again.

If you see “Missing script: start,” open package.json and run the script that actually exists.

Quick recap

• Make sure Node.js and dependencies are installed.
• Open your React project folder in the terminal.
• Check the scripts section in package.json.
• Run npm start or npm run dev.
• Open the local URL shown in the terminal.
• Stop the server with Ctrl + C when finished.