Giải Phẫu Cấu Trúc Thư Mục Dự Án React & Vòng Đời Bootstrapping

Khám phá vai trò của từng file và folder (index.html, package.json, src/, public/, main.tsx, App.tsx) và cách ReactDOM gắn kết ứng dụng vào trình duyệt.

Môi trường thực hành:

React v19.2 (Client Sandbox)

ESM CDN · Hot Reload

React Playground

React v19.2

Interactive Client Sandbox · Live Hot Reload

6 files

src/main.tsx

Entry File

Instructions:Khám phá cấu trúc dự án React thực chiến: Nhấn vào từng file và folder (index.html, src/main.tsx, src/components/) để xem vai trò và quy tắc sử dụng. Thử chỉnh sửa tiêu đề trong file src/App.tsx và xem Live Preview cập nhật tức thì!

File Tree:

index.html

src/main.tsxmain

src/App.tsx

src/components/FolderCard.tsx

src/data/structure.ts

src/index.css

Supports React, Lucide Icons, TypeScript & Hot-Reload.

React Core Foundations

beginner

15 phút

#React Basics

#Project Anatomy

#Folder Structure

#Bootstrapping

#index.html

#main.tsx