Getting start with ReactJS + Vite (Video Tutorial)

Started with ReactJS and Vite in VS Code (Video Khmer Language)

Today, I will share how to get setup a project with ReactJS using Vite. Getting Started with ReactJS and Vite Today, I will share how to get setup a project with ReactJS using Vite.

What is ReactJS?

ReactJS is a JavaScript library for building user interfaces fast with reusable components, making it easy to build interactive web applications quickly.

Why Vite? What is Vite?

Vite is a modern build tool that makes development easier. Vite is fast and easy to use.

More ReactJS playlist 1.Getting start with ReactJS + Vite (Video Tutorial)
2.Understand Functional/Class Component & Props
3.Basic Events Handling in ReactJS plus Form Event
4.React State Management: Functional vs. Class Components and Handling Multiple States
Basic Routing with React Router

How to create ReactJS project step by step

Step 1: Install Node.js

If not installed, go to Node.js website and download.
If you have Node.js. Run this command in your command prompt: node -v

Watch How to download, Install and verify NodeJS on Windows

Step 2: Create a New Project

Command to create a new Vite project:
npm create vite@latest my-react-app

Replace my-react-app with your project name.

Step 3: Navigate to Project

Change directory to your project:
cd my-react-app

Step 4: Install Dependencies

Run this command to install all packages: npm install
Video how to setup and run reactjs project (khmer)


Step 5: Start Development Server

Now, start your app: npm run dev
Open your browser and go to http://localhost:5173.

Step 6: Edit Your App Open

Open your project in your favorite code editor (VS Code, WebStorm). You will see src/App.jsx. This is main file. Change text and save. The page updates automatically!
Get to know ReactJS structure and hello world

Step 7: Build project

if you want to buil your project for production you can deploy by run: npm run build
Your app is ready in the dist folder.

👉 Next:Understand Functional/Class Component & Props in ReactJS speak khmer
Previous Post Next Post