React入门#1 〜React的基础知识〜

首先

我编写了一篇关于标题的文章。
以下是我在这篇文章中得到的内容。

・关于React的基础知识
→ React是什么，React用于做什么，以及React的特点等

React 是什么东西？

这是由Facebook社开发的JavaScript库。

在React中做什么？

设计网页界面

UI可以分为外观（视图）和功能（控制器）两部分。
组件是外观和功能成套的元素，React就是用来创建这些组件的。

※ 补充说明
不是基于框架或单页面应用（SPA）
※ SPA (单页面应用)是指在不刷新页面的情况下进行内容切换的一种Web应用程序。

React的特点

– 虚拟DOM

使用React进行管理的是DOM。通常的DOM通过渲染来进行管理，而Virtual DOM则是通过另外一种方式进行管理，因此可以高效地操作DOM。

render(
  <div id='hoge'>fuga</div>
)
// renderというメソッドを使い、"hoge"のid属性を持つdiv要素を、fugaという中身で作る

・文档对象模型（DOM）

这是一种解析HTML并将解析数据以树状结构表示的机制。您可以操作解析后的数据来修改HTML的结构、外观和内容等。

document.getElementById("hoge").innerText='fuga'

// "hoge"のid属性を持つ要素の中のテキストが'fuga'に変える
// これではブラウザのレンダリングに影響を与えるので、パフォーマンスが良くありません

・分差绘图

只需重新绘制变更的部分，就可以高效地改变网站的外观。

JSX -> JSX 是 JavaScript 语法扩展

由于JavaScript可以像HTML一样进行编写，因此对于习惯使用HTML的人而言，它具有很高的易用性。

ReactDOM.render(
  <div className={hoge}/>
    <h1>Hello World!</h1>
  </div>
)

以下是下一篇文章

React 入门＃2 〜 关于 JSX 〜 的内容：