Bài 2: Cài đặt môi trường chạy ReactJS

Cập nhật lần cuối vào ngày 29/11/2024

1. Điều Kiện Tiên Quyết

  • Máy tính đã cài đặt NodeJS (phiên bản 14.0 trở lên)
  • Trình soạn thảo code (VSCode, Sublime Text, WebStorm)
  • Kết nối Internet ổn định

2. Cài Đặt NodeJS

2.1 Tải NodeJS

Truy cập trang chính thức: https://nodejs.org và tải phiên bản LTS

2.2 Kiểm Tra Cài Đặt

# Kiểm tra phiên bản NodeJS
node --version

# Kiểm tra phiên bản npm
npm --version

3. Tạo Dự Án ReactJS

3.1 Phương Pháp 1: Create React App

# Tạo ứng dụng React mới
npx create-react-app my-react-project

# Di chuyển vào thư mục dự án
cd my-react-project

# Khởi chạy dự án
npm start

3.2 Phương Pháp 2: Vite (Khuyên Dùng)

# Tạo dự án React với Vite
npm create vite@latest my-react-project -- --template react

# Di chuyển vào thư mục dự án
cd my-react-project

# Cài đặt dependencies
npm install

# Chạy dự án
npm run dev

4. Cấu Trúc Thư Mục Dự Án

my-react-project/
├── node_modules/     # Thư viện và dependencies
├── public/           # Tài nguyên tĩnh
├── src/              # Mã nguồn chính
│   ├── App.js        # Component gốc
│   ├── main.js       # Entry point
│   └── index.css     # Stylesheet toàn cục
├── package.json      # Quản lý dependencies
└── vite.config.js    # Cấu hình Vite

5. Các Lệnh Quan Trọng

  • npm start: Chạy ứng dụng ở chế độ phát triển
  • npm run build: Biên dịch ứng dụng cho production
  • npm test: Chạy test

6. Lưu Ý Quan Trọng

  • Luôn cập nhật NodeJS và npm
  • Sử dụng phiên bản LTS ổn định
  • Kiểm tra và quản lý dependencies
  • Sử dụng ESLint và Prettier để đảm bảo chất lượng mã

Bình luận