WEB講座

Reactって何？

2022.12.31

最近、ReactやVue.jsという言葉を聞くようになったんですが、普通のJavaScriptとは違うものなんですか？

どんどん新しいものが出てくるから、たしかに疑問に思うかもしれぬのう。
では、今日はReactについて説明するぞよ。

できるだけ簡単な感じで、説明お願いします～！

Reactのウェブサイトを見ると、下記のように書いています。

ユーザーインターフェース構築のためのJavaScriptライブラリ

しかし、これだけでは何ができるか、パッとイメージできないですよね^^;

Reactは、Facebook社（Meta）が開発した、Webサイト上のUIパーツを構築するためのJavaScriptライブラリです。
※オープンソースとして公開されているため、常に改良が行われ品質も保たれています。

AngularJS（アンギュラージェイエス）やjQuery（ジェイクエリー）等と比較されることがありますが、Reactはフレームワークでなく、UIを構築するためのライブラリです。

「Facebook」や「Instagram」の他、「Yahoo!」や「Slack」「Netflix」など、世界中で数多く採用されているライブラリです。

ライブラリとは？: 再利用可能なプログラムを、特定のコンセプトに従って1つのファイルに集めたもの。
アプリケーション開発をする際にライブラリを使うと、ライブラリの中から適宜必要なプログラムを取り出して使うことが出来るため、プログラムをする手間を省けるメリットがあります。

フレームワークとは？: フレームワークとは、新しいプログラムを開発する際に使える枠組みです。
フレームワークを使えばプログラムの枠組みまで用意される分だけライブラリより効率的ですが、決まった枠組みに従わないといけないため、ライブラリより自由度は低くなります。

Reactはコーディングコストが少なく、開発規模が大きくなっても管理しやすいため、これまでのフレームワークやライブラリとは異なる特徴が注目されています。

Reactの需要が高まってきている理由は、Reactならではの特徴が優れているからだと思います。
Reactの公式サイトに掲載されえちる大きな3つの特徴は下記になります。

「宣言的なView」を簡単に説明すると、「この記述ではこういう動きをする」ということが、コードの中で宣言された状態のことです。

そのため、他の人がそのソースコードを見ても中身を理解しやすくなっています。
開発担当者ではない者が見ても中身を理解しやすいため、不具合が発生しても原因を調査しやすいのがメリットです。

プログラムを小さな機能ごとの部品（コンポーネント）に分け、必要に応じて組み合わせて開発する仕様のため、カスタマイズしやすくやっています。

コンポーネントベースでないjsでは、一部だけ変更したい場合でも全体的な変更が余儀なくされましたが、Reactは後から改良・拡張したい部分が発生しても、対象のコンポーネントだけ変更すれば済むのが大きな魅力です。

公式サイトでも「React と組み合わせて使用する技術に制限はありません」と公言している通り、既存のソースコードを書き換えることなく開発ができるのがReactの魅力です。

WebサイトやWebアプリだけでなく、Reactはそれ以外の分野でも活用されています。

スマートフォンのアプリ開発をする場合、以前までは複数のプログラム言語を使い分ける必要がありましたが、Reactなら1つの開発環境でiOS・Android両方のアプリを開発することが可能です。

Reactを使えるようになる前提として、JavaScriptの基本的な知識が必要になります。

Reactの基本から、Reactを使って簡単なゲームを作る方法まで解説しています。
React 公式チュートリアル▶

初心者でもReactを理解しやすいように、図解などを使いわかりやすくまとめた入門書です。手順に関しても詳しく説明されています。
書籍の詳細▶

ふぇ～、難しかった～T T

できるだけ簡単に話したつもりじゃがすまないのぅ。
必要に迫られた際に、勉強してみる感じでよいと思うぞよ。

でも、概要だけはわかったので、ありがとうございました！