网站建设维护的职位响水专业做网站的公司
React入门 – 1. 学习React的预备知识
Prepared Knowledge to Learn React Development
By Jackson@ML
众所周知，React是Meta开发的Web UI框架（库），以便实现动态Web站点。真因为是这样，学习React之前，需要储备一定的知识和技能。
本文简要介绍学习和实践React需要具备的知识及技能，以备有兴趣的读者学习借鉴。
首先，面向互联网和Web开发，React功能强大。既然是面向Web，那么基于Web网页设计的三要素（HTML，CSS和JavaScript）就必须先打好基础。
其次，动态网页基于静态网页，也就是说，JavaScript语言是在HTML，CSS基础上添加到网页文件中的，它是脚本语言。充分利用React做好基础开发，则应该首先了解JavaScript基本概念和方法。
同时，React是一个须声明的、高效的和灵活的JavaScript库，用于构建用户界面（UI），它也允许由所谓的“组件”的小而精的代码片段组成复杂的用户界面。
React使用现代JavaScript语言功能搭建，因此通常使用其ES6版本，由此，开发者可以使用React编程开发出Web应用程序；同时，也可以用React Native开发移动应用程序。
因此，要想开发出好用、高效的Web应用程序，就必须先学习HTML，CSS及相关知识技能，切实打好基础;
只有凭借扎实的JavaScript知识，并加强JavaScript ES6语言和实践技能，快速协同React代码，最终方能实现React在Web端和移动端的产品开发。
学好React需要具备的知识技能如下。
1. HTML
HTML(Hypertext Markup Language，超文本标记语言)，用于描述Web页面结构和内容。开发人员需要使用带有开始和结束的一对标签（尖括号< >），作为HTML元素（Elements）来标记HTML文档。
同样，用户需要能够与网页上的元素进行交互。这意味着 HTML 文档必须以 JavaScript 代码可以查询和更新的方式表示。这就是 DOM（Document Object Model， 文档对象模型） 的功能。它是 HTML 文件中对象的模型。
Web 开发人员通过 JavaScript 与 DOM 交互，以更新内容、设置事件和为 HTML 元素添加动画。
以下是HTML语言针对不同用途而需要掌握的主要标签：
1） 设计和风格
- <html></html>
- <head></head>
- <body></body>
- <div></div>
2） 文本格式化
- <h1></h1>
- <h2></h2>
- <h3></h3>
- … …
- <h6></h6>
3） 列表
- <ul><li></ul></li>
- <b><i>
4） 图像
- <img src=” ”>
5） 链接
- <a href=” ”>
6） 语义
- <header>
• 可参考HTML学习指南。
2. CSS
Cascading Style Sheets（CSS）即层叠样式表。
CSS用于设置HTML样式，在学习React之前，也需要掌握必要的CSS概念和方法；由于React也涉及到设置组件样式，因此，基本的CSS知识无疑对掌握React大有裨益。
需要率先熟悉的CSS样式有：
- 字体样式（字体大小、颜色等等）
- Flex Box设计（用CSS条目设计Flex Box方案）
- CSS选择器（Selectors）
- 位置，padding, margin和显示
- 颜色，背景色和图标等
• 可参考：CSS样式表基础(CSS Styling Basics)。
3. Java Script
React是基于JavaScript的，它用JavaScript语言编写完成，并使用ES6版本；因此，学习React之前，有必要了解JavaScript基本知识和方法。
另外，JavaScript是Web开发使用的编程语言，而React是一个JavaScript UI库；因此，学好 React，势必要精通JavaScript。
必要的Java Script相关学习条目有：
- 数据类型
- 变量类型(var, let和const)
- 条件语句
- 循环语句
- 对象、数组和函数
- ES6箭头函数
- 内置函数（例如：map( ), forEach( )以及其它）
- 解构数组和对象
- 错误处理
*可参考：现代JavaScript指南
4. 包管理器(Node, npm)
React作为JavaScript的UI库，平常开发时会遇到向React应用程序添加其它包；JavaScript标准库的包包含模块所需全部文件。
如果需要有效管理这些有用的包以及依赖项(dependencies)，因此，可以使用JS后端NPM(Node Package Manager) 包管理器。
以下是开发前必备NPM的工作：
- 用命令行安装npm模块
- 安装包（作为dependency）
- 启动命令
- 更新npm版本
- 在package.json文件中搜索
有了上述的知识和技能基础，React应用开发将迎刃而解。接下来，让我们逐步深入探讨React开发Web应用程序吧。
*供参考：npm官方文档
技术好文陆续推出，欢迎持续关注和点赞。
您的认可，我的动力！😃
相关阅读：
- React简介
- Python网络爬虫爬取图片实战
- 用Django创建一个Web项目
- 2025最新版MySQL安装使用指南
- JavaScript编程基础 - 对象
- 用Visual Studio Code搭建JavaScript开发环境