首先

我学习React已经有大约两年的时间了，但我仍然记得第一次看到React时的震撼。
因为它与我之前所了解的JavaScript完全不同。

而且，由于React拥有许多独特概念，所以学习成本较高。对于刚入门现代JS开发的初学者来说，除了需要掌握JSX、虚拟DOM和声明式UI等概念之外，还需要学会使用诸如node.js和webpack这样的工具。

因此，我写了一篇文章，专门为刚开始学习JavaScript的人准备，以帮助他们对React有个大致的理解。
如果你对React感兴趣但还没有开始学习，那么请务必在这里开始大致地理解一下。

尚、現在的這篇文章有些地方缺乏準確性，僅為了讓您大致了解，所以請在實際學習時加以補充。請謹遵。

React是什么样的库？

简单来说，这是一个根据数据自动更新HTML的库。
React主要提供“检测变量变化并自动创建、更新、删除元素”的功能。
这使得创建复杂动态UI变得简单。

可以充分运用想象力提升创造力。

我认为，即使是一瞥之间也可以看出描述的数量减少了。

React有哪些优点

自動同步數據的更改

过去，为了反映数据的更改，需要使用JavaScript调用元素，并创建将变量分配给元素的处理过程。

在React中，一旦声明了“在这个元素内使用这个数据！”，React会自动检测变量的更改并重新渲染屏幕。这通常被称为数据绑定。建议把这个概念牢记于心。

然而，要实现这一点，需要遵循React的规范（语法），即JavaScript和HTML结合的语法叫做“JSX”。

关于JSX语法的内容

使用JSX语法，根据绑定数据变量的状态，React会在后台自动执行之前需要通过JavaScript直接编写的「getElementBy~」和「createElement」。

换句话说，这意味着在实施时就不需要编写DOM元素的变更处理了。

可以按部件对UI进行管理。

在应用程序开发中，存在一些需要在多个画面中使用的共享组件，希望能够动态添加的组件，以及用于显示列表的组件等等，这些组件希望与常规的HTML分开管理。
但是，用HTML+JS进行分割管理相对来说比较麻烦。

然而，如果使用React，可以轻松地分割UI组件。

总的来说 / 总之 / 简单来说

如今，在开发现代化的web应用时，我们经常会使用React。这是因为React具有许多方便的功能，可以动态地操作JavaScript和HTML。不仅如此，React还被一些知名公司如Netflix和Uber Eats等广泛采用。

哎？这个可以用吗？

听到这样的故事，初学者可能会想到一个问题：“React 到底如何在浏览器中加载呢？”这个疑问非常合理。因为最终在浏览器上显示的只有用 HTML 语法编写的内容，而目前浏览器还无法解释 React 的语法(JSX)。

因此，需要使用编译器将用React编写的文件转换为JavaScript，然后通过HTML进行加载。

如何使用React？

这是一个需要一种选项的问题，因为”コンパイル”是一个日文词汇。如果需要翻译成中文，可以这样表达：编译。

由于浏览器无法直接加载JSX代码，因此需要使用编译器将JSX转换为JavaScript语言。
通常情况下，我们会在本地PC上进行编译。(当然，也可以使用