Reactjs学习笔记
- 本篇是关于React的简介
ReactJS是Facebook推出的一款前端框架,2013年开源,提供了一种函数式编程思想,拥有比较健全的文档和完善的社区,在React16的版本中对算法进行了革新,称之为React Fiber。
- 开发环境搭建
需要nodeJS解析器,以及npm(node的包管理工具) - 如何引用React
1. 使用.js来引入(js文件引入容易遗忘,不推荐)
2. 借助脚手架工具( 方便维护,推荐)
react当前最新版本是18,16和17版本基本推荐Create-react-app框架来搭建项目,在最新的18版本中,则推荐了NextJS, Remix, Gatsby,Expo(原生应用)这几个框架来搭建项目
我们可以来看一下用不同框架搭建的项目的工程目录
1. 这是用Create-react-app搭建的

其中 node_modules 是当前项目用到的所有依赖模块包
public文件夹中是一些静态文件( image / font / ico,html)
src 文件夹中是我们的源代码文件(程序入口文件index.js ,js和css )
package.json 文件对当前脚手架安装的项目有介绍,比如项目名称,项目依赖
yarn.lock 文件对项目依赖的安装包做了限制( 轻易不要动)
gitignore是当你用Git版本控制工具时,上传代码需要忽略的一些文件
2. 这是用NextJS搭建的
Reactjs学习笔记的更多相关文章
- ReactJS学习笔记(三)
需要注意的问题: 1.组件名称开头字母一定要大写.(PS:原因是 React 的 JSX 里约定分别使用首字母大.小写来区分本地组件的类和 HTML 标签.) 2.this.props.childre ...
- ReactJS学习笔记(二)
1.Ajax: componentDidMount 方法设置 Ajax 请求,等到请求成功,再用 this.setState 方法重新渲染 UI. /*demo1*/ var Demo1Box=Rea ...
- ReactJS学习笔记(一)
1.依赖的资源: <script type="text/javascript" src='../asset/react.js'></script> &l ...
- reactjs 学习笔记
1.安装 npm install -g create-react-app create-react-app my-app cd my-app npm start
- 【原】redux异步操作学习笔记
摘要: 发觉在学习react的生态链中,react+react-router+webpack+es6+fetch等等这些都基本搞懂的差不多了,可以应用到实战当中,唯独这个redux还不能,学习redu ...
- react学习笔记1--基础知识
什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...
- The Road to learn React书籍学习笔记(第二章)
The Road to learn React书籍学习笔记(第二章) 组件的内部状态 组件的内部状态也称为局部状态,允许保存.修改和删除在组件内部的属性,使用ES6类组件可以在构造函数中初始化组件的状 ...
- React入门基础(学习笔记)
这篇博客是我通过阅读React官方文档的教程总结的学习笔记,翻译可能存在误差,如有疑问请参见http://reactjs.cn/react/docs/tutorial.html . 一.所需文件 在编 ...
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- PHP-自定义模板-学习笔记
1. 开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2. 整体架构图 ...
随机推荐
- PyG 图神经网络依赖环境安装(Anaconda)
1.默认用户在Anaconda的虚拟环境中已安装Pytorch 2.打开anaconda prompt命令窗, activate "你的虚拟环境名称" 3.在激活后的虚拟环境下输入 ...
- .NET实现解析字符串表达式
一.引子·功能需求 我们创建了一个 School 对象,其中包含了教师列表和学生列表.现在,我们需要计算教师平均年龄和学生平均年龄. //创建对象 School school = new School ...
- .Net8的快速JIT,分层编译,R2R的设置
前言 本篇通过一些简单的JIT设置,比如快速JIT,适用于循环的快速 JIT,分层编译,R2R等核心内容设置,快速进入.Net8核心区域. 概括 1.快速JIT 什么是快速JIT,顾名思义,被Rosy ...
- ts中抽象类、继承、多态
ts中类抽象类.多态: 抽象类: abstract 修饰, 里面可以没有抽象方法.但有抽象方法(abstract method)的类必须声明为抽象类(abstract class) 多态:父类定义一个 ...
- TypeScript FromData添加数组
本文解决的是,如何向FromData添加对象数组. 在FormData中添加数据并使用Axios向后台请求数据,参数是列表对象File[] 结果接口请求时,数据变成了字符串: 试试直接使用File[] ...
- 【有问必答】搭建uniapp项目流程手把手教学
前言 缘由 博友有问,狗哥必答 前段时间,博友加本狗微信,询问uniapp的学习方法.本狗资历浅薄,没有专门学过uniapp,只能将自己日常开发uniapp的基本流程和步骤进行分享,希望可以略尽绵薄之 ...
- 【配置教程】撑起月6亿PV开源监控解决方案
上次分享过<一个.Net Core开源监控解决方案,支持Redis.Elasticsearch.SqlServer>,这是Stack Overflow 开源的监控产品,基于.Net Cor ...
- selenium IDE插件的配置使用
开头 Selenium提供了一个可以自动录制脚本的插件 叫selenium IDE 让我们一起看看如何安装使用 安装 因为google扩展商城大多数人用不了,所以我们选用的是edag来下载seleni ...
- 音视频八股文(7)-- 音频aac adts三层结构
AAC介绍 AAC(Advanced Audio Coding)是一种现代的音频编码技术,用于数字音频的传输和存储领域.AAC是MPEG-2和MPEG-4标准中的一部分,可提供更高质量的音频数据,并且 ...
- 2020-09-15:java里的wait()和sleep()的区别有哪些?
福哥答案2020-09-15:#福大大架构师每日一题# 1.线程状态.wait()的线程状态是TimedWaiting和Waiting.sleep()的线程状态是Waiting.2.指定时间.wait ...