What is vite JS
Vite (French word for "fast") is a build tool that aims to provide a faster and leaner development experience for modern web projects.
Why we use Vite
Today most people use CRA
npx create-react-app
for starting a react project. Its very time consuming because it install many unused packages to the project.
Here, we use Vite for creating a react project. its less time consuming, because it only install necessary packages for the project.
When comparing to CRA, vite only take less time to start the server and updation.
So, here we start...
- Install react app using vite
npm init @vitejs/app my-react-app
- Choose the variant
Here vite asked for the app and varient. These are the technologies installed using vite js
- vanilla
- vanilla-ts
- vue
- vue-ts
- react
- react-ts
- preact
- preact-ts
- lit-element
- lit-element-ts
- svelte
- svelte-ts
Then Choose a variable and hit enter.
It create a folder named
my-react-app
and create the template files.
- change the directory
cd my-react-ap
- Intsall dependencies
npm install
or
npm i
- Run development server
npm run dev
Now we completed the installation.
Now you can open a editor and start the work.
Top comments (2)
Hello Dev,
I'm looking for a beginner-friendly React project tutorial most especially vite project using react in PDF format. If anyone has a resource or a project they've worked on using React for beginners, please share the PDF with me.
I'm specifically looking for a PDF document, so if you have a link or a file, please send it my way.
Thanks in advance for your help!
adebayoadetayo284@gmail.com
Need a guide to setup testing in ReactApp created by Vite