React 教程

React 为创建现代用户界面提供了结构化的学习路径。我们的教程涵盖 React 组件、状态管理和钩子等内容,适合初学者和有经验的前端开发者。通过实践实验室和实际示例,你将积累构建动态响应式 UI 的经验。我们的交互式 React 代码沙箱让你可以测试 React 特性并即时看到结果。

React 列表和 Keys

React 列表和 Keys

在本次实验中,你将学习如何在 React 中渲染数据列表以及使用 keys 处理列表项的重要性。
React
React JSX 基础

React JSX 基础

在本实验中,你将学习 JSX 语法的基本知识,包括编写元素、嵌入表达式和使用属性。
React
React 表单基础

React 表单基础

在本实验中,你将学习 React 中处理表单的基础知识,包括受控组件、状态管理和事件处理。
React
React 事件处理

React 事件处理

在本次实验中,你将学习 React 事件处理的基础知识,例如点击事件,通过将事件处理器附加到 JSX 元素并定义相应的函数。
React
React 条件渲染

React 条件渲染

在这个实验中,你将学习 React 中条件渲染的基础技术,包括使用三元运算符、逻辑 &&、变量和 state 来动态显示组件。
React
React Hooks 状态管理

React Hooks 状态管理

在本实验中,你将通过构建一个简单的计数器应用,学习使用 `useState` Hook 在 React 中管理组件 state 的基础知识。
React
React 组件入门

React 组件入门

在本实验中,你将通过创建、导出和导入一个简单的函数式组件来学习 React 组件的基础知识。
React
React 设置与首个应用

React 设置与首个应用

在本实验中,你将学习使用 Vite 设置新 React 项目并运行你的第一个 React 应用的基础步骤。
React
React Props

React Props

在本次实验中,你将学习 React props 的基础知识,包括如何将数据从父组件传递到子组件、访问 props、使用解构以及设置默认值。
React
使用 React 创建像素艺术动画制作器

使用 React 创建像素艺术动画制作器

在本项目中,我们将引导你使用 React 构建一个简单的像素艺术动画制作器。在本指南结束时,你将拥有一个基本的像素艺术编辑器,在其中你可以绘制像素艺术并查看生成的动画。这个项目对初学者很友好,是深入了解 React 和像素艺术世界的有趣方式!
ReactCSS
使用 React 创建一个笔记应用程序

使用 React 创建一个笔记应用程序

在这个项目中,我们将使用 React 创建一个简单的笔记应用程序。该应用程序将允许用户添加、编辑和删除笔记。我们将把开发过程分解为几个步骤,确保每个步骤都满足特定要求并添加基本功能。
JavaScriptReact
使用 React 构建圣诞愿望清单应用

使用 React 构建圣诞愿望清单应用

本项目指导你使用 React 构建一个节日氛围浓厚的圣诞愿望清单生成器 Web 应用程序。该应用具有美丽的全屏圣诞主题背景和迷人的降雪动画,增强了节日气氛。用户可以将愿望添加到半透明的愿望墙上,每个愿望都以明信片的形式呈现。我们将使用 React 构建前端,并使用 CSS 进行样式设计和动画制作。
ReactCSS
构建交互式 React 组件

构建交互式 React 组件

在本项目中,你将学习如何使用 React 创建一个简单的显示/隐藏功能。你将实现一个按钮,用于切换页面上图像的可见性。
JavaScriptReact
使用 React 创建响应式名片

使用 React 创建响应式名片

在本项目中,你将学习如何使用 React 创建个人名片。该项目涉及构建一个响应式且交互式的 Web 应用程序,允许用户输入个人信息并生成定制名片。
JavaScriptReact
实现 React 导航功能

实现 React 导航功能

在这个项目中,你将学习如何在 React 应用程序中实现导航功能。你将创建一个带有导航栏和可通过链接导航到的页面的简单应用程序。
JavaScriptReact
React 颜色过滤器应用程序

React 颜色过滤器应用程序

在本项目中,你将学习如何使用 React 构建一个颜色过滤器应用程序。该应用程序将允许用户通过输入他们正在寻找的颜色名称来过滤颜色列表。本项目将帮助你理解如何在 React 中进行状态管理、事件处理和条件渲染。
JavaScriptReact
使用自定义 React Hook 实现响应式导航

使用自定义 React Hook 实现响应式导航

在本项目中,你将学习如何创建一个名为 useWindowSize 的自定义 React Hook,以获取当前窗口大小,并使用它来有条件地在 Web 应用程序中渲染导航栏。
JavaScriptReact
你的第一个 React 实验

你的第一个 React 实验

你好,欢迎来到 LabEx!在第一个实验中,你将学习经典的 React 'Hello, World!' 程序。
React
  • 上一页
  • 1
  • 2
  • 下一页