当前位置: 首页 > news >正文

React入门准备

React是什么

React是一个用于构建用户界面的JavaScript框架,用于构建“可预期的”和“声明式的”Web用户界面,特别适合于构建那些数据会随时间改变的大型应用的用户界面。

它起源于Facebook的内部项目,因为对市场上所有JavaScript MVC框架都不满意,所以决定自行开发一套,用于架设Instagram的网站。React于2013年5月开源,它只负责应用的视图层,帮助开发人员构建快速且交互式的web应用程序。React使用组件的方式构建用户界面,这种设计提高了代码的复用率,降低了测试的难度和代码复杂度。React的核心组成部分是JSX,它使用XML标记的方式直接声明界面,与HTML、JS混写。虽然React不是JavaScript本身,但它是用JavaScript语言编写的一个库,这使得开发人员可以使用JavaScript编写简短、独立的代码片段,并通过React组合成复杂的UI界面‌。

React学习路线

React官方文档是最好的学习资料,但是在学习其之前,我们需要知道一下内容。

DOM

DOM(文档对象模型)是HTML和XML文档的编程接口。HTML文档加载到浏览器时,浏览器会解析HTML元素为DOM元素,构建DOM模型。这个模型将HTML文档视作树结构,即节点树。通过DOM,节点树中的所有节点都可以通过JavaScript进行访问和修改‌。DOM不是编程语言,而是一种标准,一个模型,它与编程语言相对独立。没有DOM,javascript无法操作页面元素,则网页只能是静止的。

HTML

HTML全称为HyperText Markup Language,译为超文本标记语言,是用于描述网页内容的一种标准标记语言。HTML不是编程语言,而是一种描述性的标记语言,它通过一系列标签(如<body><head><table><p><img><div>等)来定义网页内容的结构和格式,如文字、图形、动画、声音、表格、链接等。HTML常与CSS、JavaScript等技术一起使用,用于设计网页、网页应用程序以及移动应用程序的用户界面。浏览器可以读取HTML文件,并将其渲染成可视化网页‌。

CSS

CSS是层叠样式表,用于描述网页或应用程序的外观和样式‌。它是一种计算机语言,主要用于表现HTML或XML等文件的样式。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。它能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力,并能够进行初步交互设计。

JavaScript

JavaScript是一种用于构建交互式网页和Web应用程序的脚本语言。

JavaScript库&JavaScript框架

Javascript框架一定是javascript库,而库不一定是框架。

  • ‌JavaScript库‌通常是一组可重用的函数和方法,专注于执行特定任务。它们提供了一些可配置的选项,但不会对项目结构进行强制规定,允许开发者自由地引入库的单个功能,并在自己的代码中组织这些功能。例如,jQuery和Bootstrap就是典型的JavaScript库,它们提供了丰富的功能,如DOM操作、事件处理、Ajax请求等,但开发者可以根据需要选择使用其中的某些功能‌。

  • ‌JavaScript框架‌则是一种预先定义好的项目结构和代码组织方式,它们提供了一种“约定的优于配置”的开发方法。框架定义了软件应用程序的工作流程,并告知开发人员需要做什么,同时在必要时调用开发人员的代码。框架通常包含预构建的UI组件、布局管理器、事件处理机制、数据模型和存储等,这些都有助于简化开发过程。例如,React和Vue.js就是典型的JavaScript框架,它们提供了完整的解决方案,包括组件化开发、状态管理、路由等,开发者需要遵循框架的规则和约定来组织代码‌。

JSX

JSX是JavaScript的一种语法扩展,广泛应用于React中‌。它允许开发者在JavaScript代码中直接编写类似HTML的语法,使得构建用户界面变得更加直观和简洁。尽管JSX看起来像HTML,但它实际上是语法糖,最终会被转译为JavaScript对象,供React使用。

在学习react官网文档之前,我们对以上知识入门即可。不需要深入学习,不然就没不完了。:)。下一篇我们搭建react开发环境。

http://www.lryc.cn/news/448892.html

相关文章:

  • robomimic基础教程(四)——开源数据集
  • 胤娲科技:AI界的超级充电宝——忆阻器如何让LLM告别电量焦虑
  • 前端大模型入门:使用Transformers.js手搓纯网页版RAG(二)- qwen1.5-0.5B - 纯前端不调接口
  • K-means聚类分析对比
  • tar命令:压缩、解压的好工具
  • Mac电脑上最简单安装Python的方式
  • Linux基础命令cd详解
  • 【大模型对话 的界面搭建-Open WebUI】
  • 如何在算家云搭建text-generation-webui(文本生成)
  • 【Java SE】初遇Java,数据类型,运算符
  • XSS(内含DVWA)
  • 【SpringCloud】环境和工程搭建
  • 基于Java开发的(控制台)模拟的多用户多级目录的文件系统
  • tailwindcss group-hover 不生效
  • python环境配置问题(个人经验)
  • BERT训练之数据集处理(代码实现)
  • 一款辅助渗透测试过程,让渗透测试报告一键生成
  • 力扣最热一百题——颜色分类
  • 2024年工业制造企业CRM研究报告:需求清单、市场格局、案例分析
  • Spring MVC参数接收 总结
  • Docekrfile和docker compose编写指南及注意事项
  • VITS源码解读6-训练推理
  • 力扣 简单 104.二叉树的最大深度
  • 单片机长短按简单实现
  • 如何用好通义灵码企业知识库问答能力?
  • C语言自定义类型:联合体
  • 【JavaEE】——线程池大总结
  • 编程中为什么使用0和1表示状态
  • C++入门基础知识90(实例)——实例15【求两数的最大公约数】
  • 自动化办公-Python-os模块的使用