案件評判
Reactを理解する!初心者でも分かる歴史、特徴、基礎知識などを簡単に解説!

Reactを理解する!初心者でも分かる歴史、特徴、基礎知識などを簡単に解説!

最終更新:2021/05/21 投稿:2020/11/07
Reactを理解する!初心者でも分かる歴史、特徴、基礎知識などを簡単に解説!

ReactはJavaScriptに活用されるオープンソースWebアプリケーションフレームワークです。コンポーネントベースで宣言的なView、一度学習すれば、どこでも使えるという特徴があります。この記事ではReactを理解するために初心者でも分かる歴史、特徴、基礎知識などを簡単に解説していきます。

Reactとは

ReactとはJavaScriptに活用されるジョーダン・ウォーク(Jordan Walk)氏によって開発されたオープンソースWebアプリケーションフレームワークです。2011年にFacebook社のプログラマンーであるジョーダン・ウォーク氏が同社のサービスであるFacebookにて使用し、2013年にオープンソース化されました。特徴としてUI/UXを意識した開発に向いていることやAndroidとiOSの両プラットフォームに対応していることなどが挙げられます。またReact.jsは数々の有名なサービスにて採用されております。代表的なものとしてFacebook、Instagram、Yahooなどが挙げられます。

Reactとは
▼正式名称
React(リアクト)
▼起源
2013年3月
▼開発元
ジョーダン・ウォーク(Jordan Walk)氏
(Facebook社)

Reactの公式サイトはこちら>>

JavaScriptとは

JavaScriptとはネットスケープコミュニケーションズ社によって1995年に誕生したプログラミング言語の一種でその中でもオブジェクト指向スクリプト言語に区分されます。主な目的として動的な機能をWebページに生成するためのプログラミング言語として開発されました。Webサイト、Webアプリ、ゲームなど様々な用途に活用できるため注目を集めております。名称にJavaが含まれるためJavaの仲間と誤解を生むこともありますがJavaScriptは全く異なるプログラム言語です。開発当時サン・マイクロシステムズ社が開発したプログラミング言語『Java』が大きな注目を集めていたことや同社との業務提携を行った背景もありJavaにちなんだ名称が付けられました。

JavaScriptのメリット・基礎知識について解説された記事はこちら>>

JavaScriptフレームワークとは

『JavaScriptにおけるシステム開発を簡単に行えるように用意された枠組みのこと』
JavaScriptフレームワークとはJavaScriptにおけるシステム開発のプログラミングを効率的に実施するために汎用的な機能群をまとめ、システムの骨組みとなるテンプレートまで用意してくれる枠組みのことです。フレームワークを活用することでプログラミングにおける記述コードを最小限に抑えることが出来ます。JavaScriptフレームワークの代表的な種類としてjQuery、Angular、Vue.jsなどが挙げられます。

JavaScriptフレームワーク人気どころ6選ついて解説された記事はこちら>>

Reactの読み方・名前の由来

Reactの読み方は『リアクト』です。名前の由来は『Reactive Programming(リアクティブプログラミング)』からきていると言われております。

Reactの歴史

ReactはFacebook社とコミュニティによってユーザインタフェース構築のためのJavaScriptライブラリとして2013年にリリースされました。Facebook社のエンジニアであるジョーダン・ウォーク氏によって開発されたものです。初めて使用が確認されたのは2011年のことで、Facebookのニュースフィード上でした。翌年2012年にはInstagramでも使用されるようになります。オープンソースとして世に広まったのは冒頭でも記載の通り2013年のことです。2015年にReactNativeをリリースし、その後も数々のアップデートや新形態のリリースを行っております。簡単に以下の年表にまとめておりますのでご覧ください。

年代 内容
2011年 ジョーダン・ウォーク氏によって開発
Facebookのニュースフィード上で使用
2012年 Instagramでも使用
2013年 ・初版リリース
・オープンソース化
2015年 ReactNativeをリリース
2017年 ReactFiberの発表

Reactの特徴

Reactの特徴を見ていきましょう。

宣言的なView

Reactは宣言的なViewという特徴があります。ReactではUIに対しアプリの内部状態に応じて、表示内容の指示を宣言することができます。このように条件(内部状態)と結果(表示内容)が明確にソースコードへと記載されているため、第三者がソースを読んでも理解しやすい仕組みが実現できます。

コンポーネントベース

Reactはコンポーネントベースという特徴があります。コンポーネントベースとはレイアウト構造とスタイル定義と状態管理をまとめたコンポーネントを定義し、これらを組み合わせることで複雑なUIを構築できるという仕組みです。Reactではコンポーネントを部分ごとに分けることでカスタマイズをしやすいという環境を実現しております。

一度学習すれば、どこでも使える

Reactは一度学習すれば、どこでも使えるという特徴があります。Reactは新しい機能を追加する場合でも、既存のソースコードを書き換えることなく、追加開発をすることができます。またWebアプリケーションの開発のみらず、React Nativeを通じたモバイル向けのアプリケーションの作成や、Node.jsサーバー上でのHTMLレンダリングにも利用できます。このようにReactは一度学習すれば、どこでも使えるということが実証されております。

その他のJavaScriptフレームワーク

React以外のJavaScriptによるシステム開発に用いられる代表的なフレームワークを紹介させていただきます。

jQuery

jQueryとはJavaScriptに活用されるジョン・レシグ(John Resig)氏によって開発されたクライアントサイドスクリプトを簡易化するためのライブラリです。2006年8月に誕生し、基本理念を『write less, do more(少ない記述で、もっと多くのことをする)』を掲げております。特徴として非常に簡単でかつ少ない記述でHTMLとCSSを操作することができます。またjQueryを利用する世界中の方々が様々なプラグインの作成を行っていることから拡張性が高いことも特徴として挙げられます。jQueryはJavaScirptの発展に大きく影響を与えたライブラリと言えるでしょう。

jQueryとは
▼正式名称
jQuery(ジェイクエリー)
▼起源
2006年8月
▼開発元
ジョン・レシグ(John Resig)氏

jQueryの公式サイトはこちら>>

jQueryの歴史やできること、基礎知識について解説された記事はこちら>>

Vue.js

Vue.jsとはJavaScriptに活用されるエヴァン・ユー(Evan You)氏によって開発されたオープンソースのオブジェクト指向Webアプリケーションフレームワークです。2014年2月に誕生し、GoogleにてAngularJSを使用した開発に携わっていたエヴァン・ユー氏がAngularJSをモデルに本当に好きな部分だけを抽出してVue.jsの作成を行ったという経緯があります。特徴として、
スクリプトタグを一行書くのみで使い始めることが出来る手軽さやAngularJSと比較して規模が小さい分学習コストが低いなどが挙げられます。

Vue.jsとは
▼正式名称
Vue.js(ヴュージェイエス)
▼起源
2014年2月
▼開発元
エヴァン・ユー氏(Evan You)

Vue.jsの公式サイトはこちら>>

Vue.jsの歴史や特徴、基礎知識について解説された記事はこちら>>

AngularJS

AngularJSとはJavaScriptに活用されるGoogle社によって開発されたオープンソースWebアプリケーションフレームワークです。2009年に誕生し、ミシュコ・へブリー(
Mishko Hebley)氏とアダム・アブロンズ(Adam Ablons)氏が主軸となって開発がなされました。特徴としてフルスタックなフレームワークと呼び声が高く、AngularJSが用意する機能を全て使いこなすことができればその他の技術は不要と言えるほど多機能で充実しております。AngularJSとAngularJS2が存在し、AngularJS2についてはGoogle社とマイクロソフト社の協力の下で作成されました。

AngularJSとは
▼正式名称
AngularJS(アンギュラージェイエス)
▼起源
2009年
▼開発元
Google社
・ミシュコ・へブリー氏(Mishko Hebley)
・アダム・アブロンズ氏(Adam Ablons)

AngularJSの公式サイトはこちら>>

Angularの歴史や特徴、基礎知識について解説された記事はこちら>>

まとめ

Reactを理解するために初心者でも分かる歴史、特徴、基礎知識などを簡単に解説させていただきました。Reactを一言で表すと『Facebook社とコミュニティによってユーザインタフェース構築のためのJavaScriptライブラリ』です。Reactには「宣言的なView」「コンポーネントベース」「一度学習すれば、どこでも使える」という特徴が挙げられます。Reactについてこの記事に書かれている最低限の内容は理解をしておくようにしましょう。

案件評判
常駐する会社が、実際どんな会社で、どんな案件が動いているか詳しく知りたい。
これは常駐形態で働く方なら誰もが感じていることだと思います。 常駐の働き方をされている方は是非一度「案件評判」で案件についての評判をチェックしてみてください。