2022年前端React杂记

news2025/4/16 12:06:53

以下记录的是,我在学习中的一些学习笔记,这篇笔记是自己学习的学习大杂烩,主要用于记录,方便查找

1、学习概述

React 是当下最火的前端三大框架之一。之前一直没有时间来学习,国庆得空来快速消掉这一块的盲点。

学习react 需要学习了解一些前端的发展历史: 如html ,jsp ,jq , vue ,react ,agular ,一直到现在的 微前端技术。

知道了前端历史,学习react 很简单,你需要知道一个万能公式:

React新版本+函数组件&Hooks优先+团队协作=高效进阶

React是Facebook在2013年开源的一款前端框架 ,发展到现在2022年 已经有 9年的历史了 。

React 官方网站:https://zh-hans.reactjs.org/https://github.com/facebook/react/releases

截止2022年10月4日,最新的版本是18.2.0

最新的版本18.2 的最新版本学习方式:

在掌握基础概念的同时,优先学习函数组件和Hooks,必要时再补充类组件的知识。

2、React hello 从零到1

##1、 脚手架快速搭建 react 项目

安装脚手架:sudo npm install -g create-react-app

检验版本:create-react-app -V // 注意:V 是大写的

创建项目:npx create-react-app <项目名称>// 注意:名字不能包含大写字母。我的是 my-app。

运行项目:npm start

3、React相关知识

不要去做重复的状态保存。

http://rekit.js.org/

https://codesandbox.io/dashboard

https://ant.design/components/table-cn/ (强烈推荐 )

https://mui.com/zh/material-ui/react-button/

https://react.semantic-ui.com/collections/table/

学习课程:

https://ke.qq.com/course/5348785#term_id=105528541 React18全家桶+Hooks+项目实战-coderwhy 王红元

https://time.geekbang.org/column/intro/100119601现代 React Web 开发实战

https://github.com/TanGuangZhi/yeah-my-kanban

https://time.geekbang.org/column/intro/100079901 React Hooks 核心原理与实战

https://github.com/TanGuangZhi/react-hooks-geekTime

https://time.geekbang.org/course/intro/100009301 React 实战进阶 45 讲

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/185085.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

python 字典 小白笔记

字典反映的是一种映射关系。1.定义用花括号括起来&#xff0c;每个元素包括键值对&#xff0c;键必须是可以用哈希值计算的对象&#xff0c;通常是数字或者字符串。值可以是任何类型的对象。键和值之间用“&#xff1a;”分割。zidian{jian:zhi,jian1:zhi,}2.查找字典可以用键获…

python采集某所有数据,从此不用money

前言 大家早好、午好、晚好吖 ❤ ~ 基本思路流程: <通用的> 一. 数据来源分析: 明确需求: 明确采集的网站是什么? 明确采集的数据是什么? 通过开发者工具<浏览器自带的工具(谷歌浏览器)>, 进行抓包分析 先分析一章内容, 然后再分析如何采集多章内容 打开开发…

ubuntu docker 安装rocketmq记录

安装链接参考该博客 上面的是非ubuntu安装的docker&#xff0c;下面记录ubuntu安装docker遇到的问题及解决 1 创建挂载目录 ─── rocketmq├── conf│ └── broker.conf└── data├── broker│ ├── logs│ └── store└── namesrv├── logs└── st…

ch1_3计算机硬件的技术指标

机器字长&#xff1a; CPU一次能够处理 数据的位数&#xff1b; 与CPU中的寄存器位数有关&#xff1b; 1. 运算速度 不同的指令&#xff0c;执行的频率不同&#xff1b; 部分指令&#xff0c; 执行起来很慢&#xff0c; 但是很少执行&#xff0c;出现的次数低&#xff0c;对…

gf-v1项目结构及目录说明

文章目录1. gf版本2. 项目结构3. 目录说明1. gf版本 2. 项目结构 / ├── app │ ├── common │ │ ├── adapter │ │ ├── api │ │ ├── dao │ │ ├── service │ │ ├── model │ │ ├── … │ ├── system │ │ ├── api │ │ ├── dao │…

MySQL的14个小技巧

我最近几年用MYSQL数据库挺多的&#xff0c;发现了一些非常有用的小玩意&#xff0c;今天拿出来分享到大家&#xff0c;希望对你会有所帮助。 1.group_concat 在我们平常的工作中&#xff0c;使用group by进行分组的场景&#xff0c;是非常多的。 比如想统计出用户表中&…

C++ 设计模式 外观模式 The Facade Pattern

C 设计模式 外观模式 The Facade Pattern 介绍 Facade Pattern 为一组复杂的子系统提供了一个统一的简单接口&#xff0c;它是一种结构型设计模式。 它隐藏了子系统的复杂性&#xff0c;并向客户端提供了一个简单的接口来访问子系统。通过使用 Facade 模式&#xff0c;客户端…

Tag和Untag相关知识科普

欢迎来到东用知识小课堂&#xff01;端口的出和入是针对交换机而言的&#xff0c;即数据帧进入交换机即为进入某个端口。接下来我们就以PEC系列工业级交换机为例&#xff0c;来给大家详细讲解一下1.Access&#xff1a;接入链路&#xff1a;1&#xff09;.入方向&#xff1a;收到…

c++11 标准模板(STL)(std::forward_list)(十三)

定义于头文件 <forward_list> template< class T, class Allocator std::allocator<T> > class forward_list;(1)(C11 起)namespace pmr { template <class T> using forward_list std::forward_list<T, std::pmr::polymorphic_…

湖仓一体电商项目(一):项目背景和架构介绍

文章目录 项目背景和架构介绍 一、项目背景介绍

vue iframe展示pdf请求接口

<iframe:src"pdfUrl"style"border: none; width: 100%; height: calc(100% - 10px)"frameborder"0">iframe是一个非常好用的标签&#xff0c;用于文件的展示src地址可以一个访问后端的一个地址&#xff08;https://mp.csdn.net/mp_blog/cr…

day25|51.N皇后、37.解数独

51.N皇后 按照国际象棋的规则&#xff0c;皇后可以攻击与之处在同一行或同一列或同一斜线上的棋子。 n 皇后问题 研究的是如何将 n 个皇后放置在 nn 的棋盘上&#xff0c;并且使皇后彼此之间不能相互攻击。 给你一个整数 n &#xff0c;返回所有不同的 n 皇后问题 的解决方案…

sylixos input子系统学习、调试记录

Input 子系统框架图&#xff1a; Xinput设备驱动层&#xff1a; 将所有设备抽象成xmes、xkbd设备&#xff0c;上层程序&#xff08;如Qt&#xff09;就可以像操作普通字符设备一样操作它们。 Xinput核心处理层&#xff1a; 从物理设备取得输入事件&#xff0c;然后通过消息队…

校招失败后,在小公司熬了 2 年终于进了字节跳动,竭尽全力....

其实两年前校招的时候就往字节投了一次简历&#xff0c;结果很明显凉了&#xff0c;随后这个理想就被暂时放下了&#xff0c;但是这个种子一直埋在心里这两年除了工作以外&#xff0c;也会坚持写博客&#xff0c;也因此结识了很多优秀的小伙伴&#xff0c;从他们身上学到了特别…

【软件测试面试】国企6年测试经验大D佬分析总结测试团队面试问题......

目录&#xff1a;导读前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09;前言 国企测试大佬测试面…

一起自学SLAM算法:11.5 强化学习与自主导航

连载文章&#xff0c;长期更新&#xff0c;欢迎关注&#xff1a; 强化学习&#xff08;Reinforcement Learning&#xff0c;RL&#xff09;[21]属于机器学习领域的一个分支&#xff0c;其学习目标是获得最大回报。在10.3.1节中已经讨论过&#xff0c;机器学习过程主要涉及四个要…

【Java并发详解】

参考书目&#xff1a; 堆和方法区中的数据是可以被共享的 堆中的数据是被栈中的变量所持用的&#xff0c;栈是线程隔离的&#xff0c;每个线程私有一个栈&#xff0c;所以栈中的数据不共享 调用a方法时&#xff0c;jvm会给a方法创建一块内存区&#xff0c;让其入栈&#xff…

UIRecorder安装、录制、回放

Github地址&#xff1a;https://github.com/alibaba/uirecorder/blob/master/README_zh-cn.md 支持 android ios 和pc端的自动化脚本录制。无线native app(Android, iOS)录制是&#xff0c;是基于macaca实现的&#xff1a;https://macacajs.com 整体组成架构 UIRecorder录制功…

Dubbo服务开发和运行流程【java面试】

(1)问题分析&#xff1a;考官主要想考核dubbo的原理&#xff0c;还有dubbo在项目中的使用。(2)核心答案讲解&#xff1a;dubbo服务开发流程&#xff1a;maven工程中pom文件先导入dubbo依赖jar包搭建zookeeper注册中心写好服务端工程并配置dubbo服务端配置&#xff0c;并关联上z…

Spring概览——最佳入门实践

1、Spring Framework Spring 基础框架&#xff0c;可以视为 Spring 基础设施&#xff0c;基本上任何其他 Spring 项目都是以 Spring Framework 为基础的。 1.1、Spring Framework特性 建议新手先看完的最佳实践&#xff0c;再回头看这一段。 非侵入式&#xff1a;使用 Spri…