どうも、とがみんです。
この記事では、Webアプリケーションのユーザーインターフェースを構築するための「React」について紹介します。
Reactとは?
「React」とは、Webアプリケーションのユーザーインターフェースを構築するためのJavaScriptライブラリで、Facebookとそのコミュニティが開発しているものです。
コンポーネントを組み合わせて開発を行うことで、保守性の高いアプリケーションを実現することができ、また、優れたUIを提供するライブラリでもあります。
「React」はXHPというPHPのフレームワークのJavaScriptライブラリへの移植として開発が始められました。
XHP:サーバーサイドのPHPフレームワーク
Reactの特徴
仮想DOM
「React」は、仮想DOMを生成し、変更を反映する際は、実際のDOMと仮想DOMの差分だけを、描画する仕組みになっています。
これにより、変更があるたびに、毎回ページ全体を書き換える必要がなく、差分だけを再描画するので、高速に変化を反映させることができます。
DOM:Document Object Modelの略。Webページを表すHTMLのように、文書の構造をメモリに表現することで、Webページとスクリプトやプログラミング言語を接続するもの。
コンポーネント指向
「React」は部品単位でコードを書き、それを組み合わせることで、アプリケーションを作成します。
これにより、保守性の高いアプリケーションを開発することができ、コンポーネントの再利用性が高いです。
一度学習すれば、どこでも使える
「React」は、Nodeを使ったサーバー上でもレンダリングが可能で、「React Native」を利用することで、モバイルアプリケーション中でも動作させることができます。
一度「React」を勉強してしまえば、Webだけでなく、スマホアプリにも生かすことができます。
あらゆる場面で「React」を利用することが可能です。
豊富なUIライブラリ
「React」には様々なUIライブラリがあり、それらを利用することで、開発をより早く、それなりのデザインのものを作成することができます。
>早く・それなりの UI を実現する React コンポーネントセット 16 選
React Nativeとの違い
「React Native」は、「React」をiOS、アンドロイドといったスマホのアプリ開発に使えるようにしたものです。
「React Native」を使用することで、「React」をモバイルアプリケーションの中でも動けるようにします。
まとめ
「React」について紹介しました。