React 教程

通过示例学习

Our "Show React" tool makes it easy to demonstrate React. It shows both the code and the result.

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 />);

在练习中学习

Many chapters in this tutorial end with an exercise where you can check you level of knowledge.

See all React Exercises

React 测验

Test your React skills with a quiz.

React 测验

我的学习

在 W3Schools 使用免费的“我的学习”计划来跟踪你的进度。

登录你的账户，开始赚取积分！

这是一个可选功能。你可以在 W3Schools 学习，而无需使用“我的学习”。

Create React App

To learn and test React, you should set up a React Environment on your computer.

This tutorial uses the create-react-app.

The create-react-app tool is an officially supported way to create React applications.

Node.js is required to use create-react-app.

Open your terminal in the directory you would like to create your application.

Run this command to create a React application named my-react-app

create-react-app will set up everything you need to run a React application.

Run the React Application

Run this command to move to the my-react-app directory

Run this command to execute the React application my-react-app

A new browser window will pop up with your newly created React App! If not, open your browser and type localhost:3000 in the address bar.

结果

您应该已经了解的内容

Before starting with React.JS, you should have intermediate experience in

• HTML
• CSS
• JavaScript

You should also have some experience with the new JavaScript features introduced in ECMAScript 6 (ES6), you will learn about them in the React ES6 chapter.