环境搭建好之后的项目结构（搭建环境方法可参照），利用VScode编辑器打开：这个是自动创建的初始结构，下面是各个文件的内容和作用。1.package.json这个文件是管理下载的依赖包,在项目中经常用到的是"react"库，“react-dom”（将jsx语法渲染到dom中）在项目中最重要的命令是“start”启动项目，"bulid"的作用就是将项目打包。2.public文件夹 &
转载
2023-11-29 20:23:35
182阅读
在使用 `yarn` 启动 React 项目时，许多开发者可能会面临一些问题。一般情况下，项目应该很容易启动，但有时会出现各种错误，让人倍感困扰。本文将详细说明如何解决“怎么用 yarn 启动 React 项目”的问题，包括可能的业务影响、错误现象、根因分析、解决方案、测试和预防优化措施。
## 问题背景
在现代Web开发中，React已经成为流行的前端框架。越来越多的企业开始使用React构
组件分类基础组件：指input、button这种基础标签，以及antd封装过的通用UI组件业务组件：对基础组件的二次封装，实现需要的功能区块组件：基础组件和业务组件的组合页面组件：最终展示给用户看的组件，和路由相对应React 组件的两种创建方式使用 JS 中的函数创建组件// 定义一个函数式组件 类似函数表达式的写法 用箭头函数写的
const Com1 = () => {
retu
最近在深入学习React的源码以及原理，这里将学到的知识记录下来。暂时只学到了基本过程，详细的内部函数原理后面有机会再记录下来。一、编译JSX首先，JSX本质其实是javascript的语法扩展，和模板语言非常接近，但是其充分具备javascript的能力。但是其要在javascript生效的话，需使用到 Babel 进行编译，JSX在被编译后，会变成一个针对 React.createElemen
入职新公司，这边打算采用RN来写界面，所以学习一波这一块的知识。 采用的是WebStorm来编译，据同事说，比他采用atom编译要多很多语法提示。 下载地址：https://www.jetbrains.com/webstorm/ 安装之后需要破解： 进入WebStorm，进行基础配置，诸如RN语法高亮等： 语法提示插件：https://github.com/virtoolswebpl
转载
2024-07-31 21:02:18
89阅读
title: 07-React路由的使用
publish: trueReact路由的使用使用React路由之前，我们需要先安装 react-router-dom这个包。比如：yarn add react-router-dom代码举例：（1）index.html<!DOCTYPE html>
<html lang="en">
<head>
<meta
转载
2023-08-10 12:57:30
0阅读
React自推出以来，改变了前端开发人员构建web应用程序的方式。使用虚拟DOM，React使UI更新更加高效，使web应用程序更加快速。但是，为什么中等规模的React web应用程序仍然表现不佳? 关键就在于你是如何使用React的。 像React这样的现代前端库并不能神奇地让你的应用程序更快。它要求开发人员了解React是如何工作的，以及组件在组件生命周期的各个阶段是如何生存的。
转载
2024-03-05 16:55:41
65阅读
# 如何在React项目中卸载React组件
## 一、流程概述
为了帮助你更好地理解如何在React项目中卸载React组件，我整理了以下流程步骤：
| 步骤 | 操作 |
| ---- | ---- |
| 1 | 打开终端，进入项目目录 |
| 2 | 使用Yarn命令卸载React组件 |
| 3 | 删除无用文件 |
接下来我将详细介绍每个步骤需要做的事情以及相应的代码。
##
原创
2024-05-28 03:52:29
154阅读
# 使用yarn安装一个React项目
作为一名经验丰富的开发者，你可以教会刚入行的小白如何使用yarn安装一个React项目。以下是整个过程的步骤表格：
| 步骤 | 描述 |
| ---- | ---- |
| 1. | 创建一个新的React项目 |
| 2. | 安装yarn |
| 3. | 使用yarn安装所需的依赖 |
| 4. | 运行R
原创
2023-09-23 14:23:25
650阅读
# 如何使用 Yarn 下载 React
作为一名新手开发者，学习如何使用工具和库是非常重要的第一步。Yarn 是一个现代的包管理工具，它为 JavaScript 和前端开发生态系统提供了快速、可靠和安全的依赖管理。本文将教会你如何使用 Yarn 下载 React，并详细介绍每一步需要做什么。
## 整体流程
在开始之前，我们先了解一下整个流程，如下表所示：
| 步骤 | 描述 |
|--
原创
2024-09-19 03:32:50
48阅读
# 使用 Yarn 安装 React 的完整指南
在现代前端开发中，React 已成为非常受欢迎的库，用于构建用户界面。而 Yarn 是一个流行的 JavaScript 包管理工具，因其快速性与简易性受到开发者的青睐。在这篇文章中，我们将探讨如何使用 Yarn 安装 React，并提供详细的步骤和代码示例。
## 什么是 Yarn？
Yarn 是 Facebook 开发的一个 JavaScr
# 使用 Yarn 创建 React 项目完整指南
欢迎来到前端开发的世界！如果你是新手，可能会觉得在开头搭建开发环境，尤其是创建一个新的 React 项目，十分困难。在这篇文章中，我将带你逐步了解如何使用 Yarn 创建一个 React 项目。我们将分解整个流程，并提供详细的代码及解释。
## 整体流程
首先，让我们看一下创建 React 项目的整体流程。下面的表格展示了所有的步骤：
|
一、介绍React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，用来架设Instagram 的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。由于 React的设计思想极其独特，属于革命性创新，性能出众，代码逻辑却非常简单。所以，越来越多的人开始关注和使用，认为它可能是将来 Web 开发的主流工具。官
# 使用 Yarn 安装 React 的指南
React 是一个用于构建用户界面的 JavaScript 库，因其高效的组件化开发模式而广受欢迎。在本篇文章中，我们将探讨如何使用 Yarn 安装 React，并且提供一些基本的代码示例来帮助你快速上手。
## 什么是 Yarn？
Yarn 是一个现代化的 JavaScript 包管理工具，它比 npm（Node 包管理器）更快，具有更好的依赖
# 安装node.js
安装node.js
安装前确保已经安装Homebrew,使用Homebrew安装Node.js这样就可以使用npm 命令 使用MAC终端
```
brew install node
```
# 安装webpack
```
$ npm install webpack --global //全局安装webpack
$ cd ~项目目录
$ npm init
$ npm ins
前言React Hooks API正式在 React V16.8 版本发布了。这篇博客，主要是介绍了其中 useReducer 的各种用法示例。在读之前，你确保你已经看过 React Hooks官方指南。useReducer hook 属于官方扩展的 hooks：是 useState 的另一种替代。它接受(state, action) => newState，并且返回了一个与当前state成
# 使用Yarn构建React应用的流程
## 1. 确保Yarn已安装
在开始构建React应用之前，需要确保已经安装了Yarn工具。如果尚未安装，请访问Yarn的官方网站（
## 2. 创建React应用
在开始构建React应用之前，我们需要创建一个新的React项目。可以通过以下命令使用create-react-app工具创建一个新的React应用：
```shell
npx cre
原创
2023-11-23 07:18:59
100阅读
导语：工作中常常和Spark on YARN, Hadoop on YARN打交道，经常在各种日志中摸爬滚打，为提升效率，总结一下YARN的知识点，希望能形成一个比较系统的方法论。本文由三问三答一例组成。1、为什么要使用YARN？为了提升集群的利用率、资源统一管理， 使用YARN为上层应用提供统一的资源管理和调度的平台。2、YARN的优势？资源的统一管理和调度：
转载
2023-10-05 22:28:35
172阅读
一、 使用create-react-app创建react应用1.1. react脚手架xxx脚手架: 用来帮助程序员快速创建一个基于xxx库的模板项目包含了所有需要的配置（语法检查、jsx编译、devServer…）下载好了所有相关的依赖可以直接运行一个简单效果react提供了一个用于创建react项目的脚手架库: create-react-app项目的整体技术架构为: re
转载
2024-07-30 14:49:09
544阅读
一、create-react-app 脚手架快速搭建 react 项目1、安装 create-react-app2、检测 create-react-app 是否安装成功3、创建 react 项目二、generator-react-webpack 脚手架搭建 react 项目1、安装 yeoman2、安装 generator-react-webpack3、创建 react 项目三、webpack 逐
转载
2024-01-27 20:42:02
154阅读
