1. 本篇是关于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学习笔记的更多相关文章

  1. ReactJS学习笔记(三)

    需要注意的问题: 1.组件名称开头字母一定要大写.(PS:原因是 React 的 JSX 里约定分别使用首字母大.小写来区分本地组件的类和 HTML 标签.) 2.this.props.childre ...

  2. ReactJS学习笔记(二)

    1.Ajax: componentDidMount 方法设置 Ajax 请求,等到请求成功,再用 this.setState 方法重新渲染 UI. /*demo1*/ var Demo1Box=Rea ...

  3. ReactJS学习笔记(一)

    1.依赖的资源: <script type="text/javascript" src='../asset/react.js'></script>   &l ...

  4. reactjs 学习笔记

    1.安装 npm install -g create-react-app create-react-app my-app cd my-app npm start

  5. 【原】redux异步操作学习笔记

    摘要: 发觉在学习react的生态链中,react+react-router+webpack+es6+fetch等等这些都基本搞懂的差不多了,可以应用到实战当中,唯独这个redux还不能,学习redu ...

  6. react学习笔记1--基础知识

    什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...

  7. The Road to learn React书籍学习笔记(第二章)

    The Road to learn React书籍学习笔记(第二章) 组件的内部状态 组件的内部状态也称为局部状态,允许保存.修改和删除在组件内部的属性,使用ES6类组件可以在构造函数中初始化组件的状 ...

  8. React入门基础（学习笔记）

    这篇博客是我通过阅读React官方文档的教程总结的学习笔记,翻译可能存在误差,如有疑问请参见http://reactjs.cn/react/docs/tutorial.html . 一.所需文件 在编 ...

  9. js学习笔记：webpack基础入门（一）

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  10. PHP-自定义模板-学习笔记

    1.  开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2.  整体架构图 ...

随机推荐

  1. C++11强制类型转换

    C++ 强制类型转换有四种关键字:static_cast.const_cast.reinterpret_cast和dynamic_cast.它们用于不同的情况和目的,比C语言的强制类型转换更清晰和安全 ...

  2. Disruptor-源码解读

    前言 Disruptor的高性能,是多种技术结合以及本身架构的结果.本文主要讲源码,涉及到的相关知识点需要读者自行去了解,以下列出: 锁和CAS 伪共享和缓存行 volatile和内存屏障 原理 此节 ...

  3. Vue中实现数据列表无缝轮播

    类似这种滚动轮播效果 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta char ...

  4. Vue中关于keep-alive的使用

    keep-alive是Vue提供的一个抽象组件,用来对组件进行缓存,从而节省性能,由于是一个抽象组件,所以在v页面渲染完毕后不会被渲染成一个DOM元素 当组件在keep-alive内被切换时组件的ac ...

  5. [ZJOI2020] 序列 线性规划做法/贪心做法

    线性规划做法 同时也作为线性规划对偶的一个小小的学习笔记. 以下 \(\cdot\) 表示点积,\(b,c,x,y\) 是行向量. \(A\) 是矩阵,对于向量 \(u,v\) 若 \(\forall ...

  6. 2022-09-24：以下go语言代码输出什么？A：1；B：3；C：13；D：7。 package main import ( “fmt“ “io/ioutil“ “net/

    2022-09-24:以下go语言代码输出什么?A:1:B:3:C:13:D:7. package main import ( "fmt" "io/ioutil" ...

  7. 2021-08-21：给定一个数组arr，长度为N ＞ 1，从中间切一刀，保证左部分和右部分都有数字，一共有N-1种切法，如此多的切法中，每一种都有:绝对值(左部分最大值 – 右部分最大值)。返回最大

    2021-08-21:给定一个数组arr,长度为N > 1,从中间切一刀,保证左部分和右部分都有数字,一共有N-1种切法,如此多的切法中,每一种都有:绝对值(左部分最大值 – 右部分最大值).返 ...

  8. ModuleNotFoundError: No module named 'flask_sqlalchemy'

    ModuleNotFoundError: No module named 'flask_sqlalchemy' 解决: pip install flask_sqlalchemy

  9. JavaWeb概念

    1 基本概念 1.1 前言 web开发: web,网页的意思,类如:www.baidu.com 静态web: html,css 提供给所有人看到的数据始终不会改变! 动态web: 几乎所有的网站:类如 ...

  10. Ubuntu 对比 CentOS 后该如何选择？

    大家阅读完以上文章觉得如何选择更适合自己?欢迎留言哦~ 本文章转载自 Linux 就该这么学(ID: linuxprobe),文章图片与文字版权属源公众号所有,未经允许,禁止二次转载. 我要投稿 本公 ...