By: Arpit Mohanty

Buy online The Complete Developer: Master the Full Stack with TypeScript, React, Next.js, MongoDB, and Docker

Hi All , Welcome to my blog on creating a React Application using Vite and a node runtime so npm .

Before we jump into any more detail , let’s know a bit more about REACT JS.

What is React ?
React is Javascript Library that is incredible for creating Single Page Application (SPA) and is a pretty good library for both beginners and experienced Web Developers . The popularity can be hugely attributed to facts like 
- Ease of Use 
- Supporting libraries 
- Fast Render with Virtual DOM 
- Easier to learn 

Why Vite ?

While Create-React-App (CRA ) is quite a famous tool for setting up a React App Template , but Vite is faster in contrast to CRA and much more flexible as well , as of now this would suffice we can go to a CRA VS Vite comparision in a separate blog.

Pre-Requisite
1. Node js >=14
    - Check your npm version npm -v
    - Check your node version node -v
    - The above two commands will ensure that node and npm are available. 
2. An IDE of your Choice (I am using Visual Studio Code)
3. Basic knowledge of Javascript 
4. Stable Internet connection (LOL)

Step by Step Instructions to Start Building a React APP

1. Open your IDE
2. Open the Terminal in your IDE We will use the terminal in order to run our node commands , like the npm command 
3. To install Vite and create a react project - npm create vite@latest- Press enter or y to confirm to proceed- Enter the project name - When asked to select between Typescript and Javascript you can go with either we will go with Javascript for the time being- Once selected the project structure will be created

5. Starting the Application
 - cd react-project-with-vite  —> We enter the project folder
 - npm install   —> Before the app is able to run we need all the libraries (hence the internet Duh!!)
 - npm run dev —> To run the application in your localhost- Once it runs successfully, navigate to the url provided to see your application
6.   The Screen would look like this 

This would sum up on how to create a react app sample project using vite in npm. I will publish more blogs on using vite to create more comprehensive application .Please let me know your thoughts in the comment section .