
【Reactマスターへの道】基礎of基礎編
おはようございます、こんにちは、こんばんは。
今現在、Web開発に欠かせない技術の一つでもある React を基礎から学びたいと思い、開始し始めた段階です。
自分のモチベーション、そしてアウトプットの場の1つとして、これから【Reactマスターへの道】として更新していければと思っている所存でございます。
今回はまだ始めた段階なので基礎中の基礎の内容になります。
具体的にはReactの誕生から進化、関連するNode.jsやパッケージマネージャーについてまとめます。
Reactの誕生
Reactは、2013年にFacebookのエンジニアによって開発されました。当時、Facebookは動的で複雑なUIを効率的に構築する方法を模索したようで、その中で生まれたのがReactです。
Reactの最大の特徴は、「コンポーネント指向」という考え方に基づいている点です。これにより、UIを小さな再利用可能な部品(コンポーネント)に分割することが可能になり、大規模なアプリケーションでも管理しやすくなったようです。
Reactの主な歴史
2015年:React Nativeの登場
Reactのコンセプトはウェブだけでなく、モバイルアプリにも応用されました。2015年に登場したReact Nativeは、Reactの思想を活かしながら、iOSやAndroid向けのネイティブアプリを開発できるフレームワークです。一つのコードベースで複数のプラットフォームに対応できる点が大きな魅力となっているみたいです。
2017年:React Fiberへの移行
React Fiberは、Reactのコアアルゴリズムを大幅に改善したアップデートです。従来のバージョンでは処理が重くなるケースもありましたが、Fiberの導入により、複雑なアプリケーションでもスムーズなユーザー体験を提供できるようになりました。また、非同期レンダリングが可能になり、パフォーマンスの最適化がさらに進みました。
2019年:フック(Hooks)の導入
フックはReactの使い方を大きく変えた革新です。それまでのクラスコンポーネントを使用した状態管理に加え、関数コンポーネントでも状態やライフサイクルを簡単に扱えるようになりました。特にuseStateやuseEffectといった基本的なフックは、現在のReact開発において欠かせないツールです。
Node.jsとReact
Reactでの開発には、Node.jsの知識が不可欠です。Node.jsはJavaScriptをサーバーサイドで実行するためのランタイム環境であり、Reactアプリの依存関係を管理したり、開発サーバーを立ち上げたりする際に利用されます。
npmとYarn
Reactプロジェクトの管理において、npm(Node Package Manager)やYarnといったパッケージマネージャーが重要な役割を果たします。
npmはNode.jsの公式パッケージマネージャーで、豊富なライブラリを簡単にインストールできるのが特徴です。
Yarnは、Facebookが開発したパッケージマネージャーで、npmに比べて高速な処理と堅牢な依存関係の管理が魅力です。
まとめ
これからReactマスターを目指すにあたって、逐一学んだことを更新していきたいと思っております。
今回はReactの技術ではなく、基礎となる歴史などについてでした。正直これまでは、言語やフレームワークを学ぶにあたって、実務で慣れていって技術面を覚えていき、基本的な部分はほったらかしということが多かったですが、やはり基本は知っていて損はないと思いました。
これからも学んでいくよ!