
ReactはJavaScriptに活用されるオープンソースWebアプリケーションフレームワークです。コンポーネントベースで宣言的なView、一度学習すれば、どこでも使えるという特徴があります。この記事ではReactを理解するために初心者でも分かる歴史、特徴、基礎知識などを簡単に解説していきます。
ReactとはJavaScriptに活用されるジョーダン・ウォーク(Jordan Walk)氏によって開発されたオープンソースWebアプリケーションフレームワークです。2011年にFacebook社のプログラマンーであるジョーダン・ウォーク氏が同社のサービスであるFacebookにて使用し、2013年にオープンソース化されました。特徴としてUI/UXを意識した開発に向いていることやAndroidとiOSの両プラットフォームに対応していることなどが挙げられます。またReact.jsは数々の有名なサービスにて採用されております。代表的なものとしてFacebook、Instagram、Yahooなどが挙げられます。
JavaScriptとはネットスケープコミュニケーションズ社によって1995年に誕生したプログラミング言語の一種でその中でもオブジェクト指向スクリプト言語に区分されます。主な目的として動的な機能をWebページに生成するためのプログラミング言語として開発されました。Webサイト、Webアプリ、ゲームなど様々な用途に活用できるため注目を集めております。名称にJavaが含まれるためJavaの仲間と誤解を生むこともありますがJavaScriptは全く異なるプログラム言語です。開発当時サン・マイクロシステムズ社が開発したプログラミング言語『Java』が大きな注目を集めていたことや同社との業務提携を行った背景もありJavaにちなんだ名称が付けられました。
JavaScriptのメリット・基礎知識について解説された記事はこちら>>
『JavaScriptにおけるシステム開発を簡単に行えるように用意された枠組みのこと』
JavaScriptフレームワークとはJavaScriptにおけるシステム開発のプログラミングを効率的に実施するために汎用的な機能群をまとめ、システムの骨組みとなるテンプレートまで用意してくれる枠組みのことです。フレームワークを活用することでプログラミングにおける記述コードを最小限に抑えることが出来ます。JavaScriptフレームワークの代表的な種類としてjQuery、Angular、Vue.jsなどが挙げられます。
JavaScriptフレームワーク人気どころ6選ついて解説された記事はこちら>>
Reactの読み方は『リアクト』です。名前の由来は『Reactive Programming(リアクティブプログラミング)』からきていると言われております。
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ではUIに対しアプリの内部状態に応じて、表示内容の指示を宣言することができます。このように条件(内部状態)と結果(表示内容)が明確にソースコードへと記載されているため、第三者がソースを読んでも理解しやすい仕組みが実現できます。
Reactはコンポーネントベースという特徴があります。コンポーネントベースとはレイアウト構造とスタイル定義と状態管理をまとめたコンポーネントを定義し、これらを組み合わせることで複雑なUIを構築できるという仕組みです。Reactではコンポーネントを部分ごとに分けることでカスタマイズをしやすいという環境を実現しております。
Reactは一度学習すれば、どこでも使えるという特徴があります。Reactは新しい機能を追加する場合でも、既存のソースコードを書き換えることなく、追加開発をすることができます。またWebアプリケーションの開発のみらず、React Nativeを通じたモバイル向けのアプリケーションの作成や、Node.jsサーバー上でのHTMLレンダリングにも利用できます。このようにReactは一度学習すれば、どこでも使えるということが実証されております。
React以外のJavaScriptによるシステム開発に用いられる代表的なフレームワークを紹介させていただきます。
jQueryとはJavaScriptに活用されるジョン・レシグ(John Resig)氏によって開発されたクライアントサイドスクリプトを簡易化するためのライブラリです。2006年8月に誕生し、基本理念を『write less, do more(少ない記述で、もっと多くのことをする)』を掲げております。特徴として非常に簡単でかつ少ない記述でHTMLとCSSを操作することができます。またjQueryを利用する世界中の方々が様々なプラグインの作成を行っていることから拡張性が高いことも特徴として挙げられます。jQueryはJavaScirptの発展に大きく影響を与えたライブラリと言えるでしょう。
Vue.jsとはJavaScriptに活用されるエヴァン・ユー(Evan You)氏によって開発されたオープンソースのオブジェクト指向Webアプリケーションフレームワークです。2014年2月に誕生し、GoogleにてAngularJSを使用した開発に携わっていたエヴァン・ユー氏がAngularJSをモデルに本当に好きな部分だけを抽出してVue.jsの作成を行ったという経緯があります。特徴として、
スクリプトタグを一行書くのみで使い始めることが出来る手軽さやAngularJSと比較して規模が小さい分学習コストが低いなどが挙げられます。
AngularJSとはJavaScriptに活用されるGoogle社によって開発されたオープンソースWebアプリケーションフレームワークです。2009年に誕生し、ミシュコ・へブリー(
Mishko Hebley)氏とアダム・アブロンズ(Adam Ablons)氏が主軸となって開発がなされました。特徴としてフルスタックなフレームワークと呼び声が高く、AngularJSが用意する機能を全て使いこなすことができればその他の技術は不要と言えるほど多機能で充実しております。AngularJSとAngularJS2が存在し、AngularJS2についてはGoogle社とマイクロソフト社の協力の下で作成されました。
Reactを理解するために初心者でも分かる歴史、特徴、基礎知識などを簡単に解説させていただきました。Reactを一言で表すと『Facebook社とコミュニティによってユーザインタフェース構築のためのJavaScriptライブラリ』です。Reactには「宣言的なView」「コンポーネントベース」「一度学習すれば、どこでも使える」という特徴が挙げられます。Reactについてこの記事に書かれている最低限の内容は理解をしておくようにしましょう。