Hướng dẫn phản ứng
React là một thư viện JavaScript để xây dựng giao diện người dùng.
React được sử dụng để xây dựng các ứng dụng một trang.
React cho phép chúng ta tạo các thành phần UI có thể tái sử dụng.
Bắt đầu học React ngay bây giờ ❯Học bằng ví dụ
Công cụ "Show React" của chúng tôi giúp bạn dễ dàng trình diễn React. Nó hiển thị cả mã và kết quả.
Ví dụ:
import React from 'react'; import ReactDOM from 'react-dom/client'; function Hello(props) { return <h1>Hello World!</h1>; } const container = document.getElementById("root"); const root = ReactDOM.createRoot(container); root.render(<Hello />);
Học bằng bài tập
Câu đố phản ứng
Kiểm tra kỹ năng React của bạn bằng một bài kiểm tra.
Việc học của tôi
Theo dõi tiến trình của bạn với chương trình "Việc học của tôi" miễn phí tại W3Schools.
Đăng nhập vào tài khoản của bạn và bắt đầu kiếm điểm!
Đây là một tính năng tùy chọn. Bạn có thể học tại Example.com.vn mà không cần sử dụng My Learning.
Tạo ứng dụng React
Để tìm hiểu và kiểm tra React, bạn nên thiết lập Môi trường React trên máy tính của mình.
Hướng dẫn này sử dụng create-react-app
.
Công cụ create-react-app
là một cách được hỗ trợ chính thức để tạo ứng dụng React.
Cần có Node.js để sử dụng create-react-app
.
Mở terminal của bạn trong thư mục bạn muốn tạo ứng dụng của mình.
Chạy lệnh này để tạo ứng dụng React có tên my-react-app
:
npx create-react-app my-react-app
create-react-app
sẽ thiết lập mọi thứ bạn cần để chạy ứng dụng React.
Lưu ý: Nếu trước đây bạn đã cài đặt create-react-app
trên toàn cầu thì bạn nên gỡ cài đặt gói để đảm bảo npx luôn sử dụng phiên bản mới nhất của create-react-app
. Để gỡ cài đặt, hãy chạy lệnh này: npm uninstall -g create-react-app
.
Chạy ứng dụng React
Chạy lệnh này để di chuyển đến thư mục my-react-app
:
cd my-react-app
Chạy lệnh này để thực thi ứng dụng React my-react-app
:
npm start
Một cửa sổ trình duyệt mới sẽ bật lên với Ứng dụng React mới tạo của bạn! Nếu không, hãy mở trình duyệt của bạn và nhập localhost:3000
vào thanh địa chỉ.
Kết quả:
Bạn sẽ tìm hiểu thêm về create-react-app
trong chương Bắt đầu phản ứng .
Những gì bạn nên biết
Trước khi bắt đầu với React.JS, bạn nên có kinh nghiệm trung cấp về:
- HTML
- CSS
- JavaScript
Bạn cũng nên có một số kinh nghiệm với các tính năng JavaScript mới được giới thiệu trong ECMAScript 6 (ES6), bạn sẽ tìm hiểu về chúng trong chương React ES6 .