1.3. Tạo dự án đơn giản với create-react-app

Create React App là một công cụ do Facebook phát triển để tạo dự án React nhanh chóng mà không cần cấu hình phức tạp.

1. Cài đặt

Cài đặt Create React App bằng lệnh:

npx create-react-app ptit_react_app

ptit_react_app là tên của app khi tạo ra. Bạn có thể sử dụng tên khác tùy ý. Mặc định tên folder chứa code sẽ trùng tên với tên project

Bạn sẽ mất 1-2 phút cho quá trình tự động cài đặt và tạo ra một ứng dụng mẫu đơn giản bằng React.

Quá trình cài đặt và tạo ứng dụng React

Sau khi cài đặt thành công, bạn sẽ nhận được 1 thư mục chứa code như hình dưới

Cấu trúc thư mục dự án React vừa tạo

2. Chạy ứng dụng

Sau khi tạo được dự án từ mục 1, bạn di chuyển vào thư mục dự án bằng lệnh sau:

cd ptit_react_app

Sau đó chạy ứng dụng bằng lệnh sau:

npm start

Khi này ta thấy ứng dụng React sẽ tự động mở một trang chạy trên trình duyệt với đường dẫn: http://localhost:3000/, kết quả hiển thị như bên dưới là bạn đã cài đặt thành công.

Giao diện này chính là giao diện gọi từ /public/index.html, tuy nhiên nội dung được "lấy" từ file /src/App.js thông qua id="root". Ở các phần sau, chúng ta sẽ hiểu rõ hơn về nguyên lý hoạt động của chúng.

Phần này, các bạn có thể thay đổi một số nội dung đơn giản từ fiel src/App.js và xem kết quả.