Install React App

Install React App

To work with React first, you need to install node.js on your local computer.

Install Node.js it on your computer.

Go to nodejs.org website, and install the recommended version of node

Install Node js from nodejs.org

Once the node is installed on your computer, check the node version in CMD by using node --version a command. If you want to check the node package version use node --v the command. Now we can install our React app

How many ways to create a React app

I will show you two different ways to install the React app.

  1. Install the react app with npx

  2. Install the react app with Vite

How to install react app with npx

This is the default method to create a React app which is documented in my React documentation.

React Doc: https://react.dev/learn/start-a-new-react-project

  1. Open the folder where you want to create the React app.

  2. Now open your PowerShell cmd by clicking shift+right click

  3. To create a react app using this command npx create-react-app your-react-app-name

After running this command it will create your React app.

Note: It will take some time to create a React app.

Here is the Demo, I have created the first react app with a named first-react-app

Create react app command npx create-react-app your-react-app-name

After you create your react app on this app in your code editor, after opening in your code editor also open your code editor terminal to run this react app in your browser.

To run the react app in the browser use npm start

You will be redirected to http://localhost:3000/

to start react app use command "npm start"

Final Look in the browser

Final Look in browser

How to create a React app with Vite

Vite is a faster way to create a React app. To create React app with Vite follow these steps

  1. Open the folder where you want to create the React app

  2. Open your PowerShell cmd by clicking shift+right click

  3. Use command npm create vite@latest and press Enter

  4. After using this command npm create vite@latest it will ask for your project name as shown below image

    GIve your project name

    After entering your project name, press Enter .

  5. Now it will ask you to select your framework. As we are creating create React app we will select React. To move the arrow use the up & down key

    select your framework "React"

    Select React and press enter

  6. Now it will ask you to select a variant.

    select a variant "javascript"

    Select javascript and press enter

  7. Now you have successfully created your first React app using Vite.

    successfully created your first React app

  8. Open your React app which is created with Vite in a code editor and also open the terminal to install the React dependencies node modules

    created react app with vite but missing modules

  9. Use npm i or npm install command to install the React dependencies node modules

    "npm install" command to install the React modules

    We have successfully installed node modules.

  10. To run the Vite React app use npm run dev command

     use npm run dev command

    It will redirect to http://localhost:5173/

  11. Final Look

    final look in browser

These are the two ways to create a React app.

Vite Doc: To create a React app with Vite

Thank you reading