React 是一个用于构建用户界面的 JavaScript 库。它允许开发者使用声明式编程方法来构建高效且响应迅速的 UI。

快速开始

  1. 安装 Node.js 和 npm 确保您的计算机上安装了 Node.js 和 npm。您可以从 Node.js 官网 下载并安装。

  2. 创建新项目 使用 create-react-app 工具可以快速创建一个新的 React 项目。

    npx create-react-app my-app
cd my-app

  3. 启动开发服务器 使用以下命令启动开发服务器。

    npm start

  4. 编写组件 在 src 目录下，您可以开始编写 React 组件。例如，创建一个简单的组件 HelloWorld.js。

    function HelloWorld() {
  return <h1>Hello, world!</h1>;
}

export default HelloWorld;

  5. 使用 JSX React 使用 JSX 来描述 UI 的结构。JSX 是 JavaScript 的语法扩展，看起来与 HTML 非常相似。

实例：计数器

以下是一个简单的计数器组件示例。

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

export default Counter;

资源

React Logo