kei615ykhm’s programming learning blog

プログラミングを0から学んでいる学生の備忘録

【学びの記録】React.jsという技術を知る

こんにちは。

Keiです。

 

今回は【React.jsというフレームワークを知る】というテーマで、

学んだことを自分の言葉で記していきます。

 

よろしくお願いします。

 

 

JavaScriptフレームワーク

React.jsの特徴は、ユーザーインターフェース(UI)の構築に優れていて、

UIを”宣言的”、”効率的”かつ”柔軟”に作ることが出来る。

 

開発効率を上げる考え方とされる”コンポーネント志向”という観点から見ると、

非常に相性が良いフレームワークといえる。

 

コンポーネント志向はモダンなWeb開発とも親和性が高いため、

その観点からも選ばれやすい。

 

▽関連記事▽

kei615ykhm.hatenablog.com

 

宣言的とは

プログラマーが「何を実現したいか」を記述することで、

フレームワークがそれらを実行するということ。

例えば、ユーザーがボタンをクリック・入力を行った際に、

それに応じてUIが動的に変化する。

ボタンをクリックするとカウンターが増加する(通販サイトの個数設定のような)

フォームに入力するとリアルタイムで画面に表示される(検索結果の反映)

 

効率的とは

Reactは「仮想DOM」という技術を使っている。

簡潔に言えば、変更が必要な部分だけを効率的にアップデートすることで、

Webページを素早く、スムーズに更新する手助けをしてくれる(読み込みが早い)

多くのデータが動的に変化する大規模な開発を行う場合はパフォーマンスを

大幅に向上させる。

 

柔軟性とは

他の多くのプログラミングツールやライブラリと一緒に使用が可能。

つまり、Reactが特定のプログラミング言語や技術に縛られずに開発者が必要な機能

を自由に選び、組み合わせることが出来るということ。

React単体では実現できない複雑で高機能なアプリを開発する場合、Reactはそれらを

効率的に開発するための「基盤(土台)」として優れている(カスタマイズしやすい)

 

欠点:柔軟性が仇になった

React.jsは非常に多くのプログラミングツールやライブラリとの併用が可能だが、

それは同時に様々なプログラミング言語の知識が必要とも言えるため知識がない

と使いづらい。

 

つまり、”何でもできる”からこそ使いこなすのが難しいというのが欠点だった。

 

まとめ

Reactは開発の自由度が高い柔軟性のあるフレームワークといえるが、

自由度ゆえの欠点がある。

しかし、モダンなWeb開発を行う上で重要なコンポーネント志向という考え方を

体現するかのような技術であるため、これら欠点を補佐できるNext.jsと合わせて

使うのが一般的な技術である。