【React】初心者向け入門講座・サンプル豊富でわかりやすさ重視【v18対応・Hooks・MUIデザイン】

フロントエンド界隈において、『React』はどんどんとシェアを伸ばしています。

生成AIが作成するコードもReactの方が精度が高いということもあり、

改めてReactの講座を作成することになりました。

個人的にVue.jsから習得していたということもあり、

Vue.jsでできた事をReactならどうやるか、という視点で、

Vue.jsと比較しながら講座を作成しました。

Vue.jsの時と同様に、

はじめはちょっとずつ、

jQueryでもできることから取り組んで、

『できる！』と思えるように時間をかけて進めるような構成にしています。

初心者の視点で、

ちょっとでも『ん？』と思う箇所はできるだけ掘り下げ、

スッキリした状態で先へ進めるように解説しています。

簡単でもいいのでできるだけ手を動かしてアプリをつくりつつ、

知識だけでなく実際に使えるようになるような構成を意識しております。

■講座内のサンプル

タブメニュー

モーダルウィンドウ

カルーセル(スライドショー)

フォーム

フォーム(Ajax + API)

簡易読書管理アプリ(GoogleBooksAPI + create-react-app + ReactRouter + MUI)

■講座で扱っている内容

JSX、コンポーネント、GoogleChrome開発ツール、props、children、Reactフック(useState, useRef, useEffect)

フォーム、Ajax(promise, async/await, fetch)、create-react-app、styped-component, emotion, react-router, Link, NavLink,

Reactフック(useNavigate, useParams)、Outlets、MUI、localStorage, googleBooksAPI, etc...

■収録時のバージョン

・セクション1～8

React 18.2.0

MUI 5.11.1

react-script 5.0.1

react-router-dom 6.6