こんにちは！
みなさんReact使ってますか？
Reactは特に初心者泣かせなライブラリだと思います。今までjQueryなどを使って開発してきた方たちにとっては馴染みのない概念が出てくるにも関わらず、様々な周辺ライブラリの知識が必要になってくるからです。
そういった方のために今回はReactの学習にオススメなUdemyの講座を紹介したいと思います。
オンライン学習は本一冊買うほどの値段でReactの概念→プロダクト開発→デプロイまで解説してもらえるため初心者にとってかなりお得な学習方法だと思います。
補足
もはやReactのチュートリアルをこなす→Reduxのチュートリアルをこなす→React Router → 認証について調べる → ...
と血の涙を流しつつ、チュートリアル地獄を経験する必要などないのです。
ただしUdemyの講義はかなりの数があるため、どれが良い講義なのか分かりづらいですよね。この記事でオススメの講義を紹介していきます。
こんな方におすすめ
- Reactを学びたい方
- Reactに挫折した経験のある方
- Udemyの講義を探している方
メモ
結論だけ知りたい方は「オススメのReact講義」セクションまでスクロールして下さい。
UdemyのReact講義は英語がオススメ
まず初めに言っておかなければならないのが、Udemyは英語の講義がオススメだということです。
Udemyは元々アメリカのサービスですし、英語は全世界で使われる言葉ですから講義数も圧倒的に多く、その分講義の競争も激しいです。良い講義でなければ見てもらえないのです。
英語の講義はメニュー右上のボタンから変更可能
そのため内容を見ても英語の講義の場合、ボリュームが多くアプリ開発〜デプロイまで踏み込んだ実践的な内容の物が多いです。価格が2000円弱(セール時)にもかかわらず、なんと50時間近くの講義もあります。
最低限の英語リスニングが出来る(ゆっくりなら聞き取れる、細かいニュアンスは分からなくても大体の意味は理解できる)方は英語の講義を受講することをオススメします。
また英語が理解できるか不安という方も30日返金保証もついているので安心です。
購入時の注意ポイント
Udemyを使ったことのない方は割引価格で購入することが出来るはずです。またすでにUdemyを使ったことのある方はセール時に購入することをオススメします。(セールは頻繁に行われます)
日本語の講義について
残念ながら日本語のReactの講義は数自体があまりありませんし、内容も実践的なものは少ない印象です。
どうしても日本語の講義がいい方は入門だけ日本語の講義を受け、その後英語の講義を受けると理解しやすいかもしれません。
モダンJavaScriptの基礎から始める挫折しないためのReact入門 
は日本語のReact講義の中でも人気の講義で「Reactの入門の入門」というレベルの講義です。講義時間は合計6時間ほどとかなり短めです。Reactを全く知らない人向けと言っていいかもしれません。
おすすめ度
おすすめポイント
- 日本語の講義なので分かりやすい
- 難易度が低めで基本的なWeb知識があればOK
- 講義内容がReactの「入門の入門」
今までReactで挫折してしまったという方は受講してみるといいかもしれません。
オススメのReact講義
ここからが本題です。
私が見てきたReactを扱った動画コンテンツの中で最も良かったのがReact - The Complete Guide (incl Hooks, React Router, Redux) 
です。なんと受講者は45万人いるそうです。凄まじい。
英語の講義ですが、日本人でも聞き取りやすい英語で、何より内容が質・量ともにトップクラスです。
頻繁にアップデートもされ、私の知る限り数年間で3回ほど大きなアップデートがされており、内容のメンテナンスがされています。
この講義を受けておけばReactに関してほぼ理解できると思います。
おすすめ度
おすすめポイント
- 英語の講義だが聞き取りやすい
- 約50時間のボリューム
- Reduxや認証,React Routerなども網羅
- 定期的に内容の更新もされる
当然ですが、ReduxやReact Router、周辺ライブラリの解説も含まれていますし、最近のアップデートでNext.jsの講義までReactの講義の中に組み込まれました。Reactでの認証やカスタムHooksなどつまづきがちなところも丁寧にカバーされています。
講義の方式としては「新しいことの解説→実践」を繰り返しながら学んでいくという分かりやすい構成です。
例えば以下のようなプロジェクトを作ったりします。
非常にボリュームのある講義なので興味のない、もしくは説明不要な箇所は飛ばしてもいいかもしれません。
補足
英語の講義になれていない特に初心者の方にオススメしたいのが、この講義の講師をしているMaximilian Schwarzmüllerという方で「Academind」としてYoutubeでも活動している方です。Udemy以外の媒体でも活動しているだけあって、説明がわかりやすいです。
どの講義の内容も全体像の説明・概念の説明・方法の説明・代替案の提示・サンプルの実装・より実践的なアプリの作成などなど.......抜かりがありません。
(逆に素早く学びたいという方や「上級者」には向いていません。)
ポイント
この講義でReactの概要が理解出来た方は次にNext.jsの講義を受講することをオススメします。
Next.jsの講義
Reactのことはわかったけれど、「プロダクト化するの大変じゃない？」という方にオススメなのがNext.jsです。
Next.jsは「The React Framework for Production」と言うだけあってプロダクションのために必要な機能が盛り込まれた「フルスタック」のReact Frameworkです。Next.jsの講義の中で最もオススメなのがNext.js & React - The Complete Guide (incl. Two Paths!) 
です。上で紹介したReactの講義と同じ講師で、こちらの講義も受講者2万2千人とNext.jsの講義の中では非常に多い受講者数(おそらくトップ)です。
おすすめ度
おすすめポイント
- 英語の講義だが聞き取りやすい
- 約25時間のボリューム
- SSG, SSRの違いを含め丁寧な解説
- Vercelでのデプロイまで解説
基礎的なルーティングの解説はもちろんのこと、分かりづらい概念であるSSR, SSGもしっかり説明されていますし、それらの使い所もきちんと説明があります。
実際のサービス開発で必要となる認証やデプロイ方法もきちんと解説されており、良心的です。
講義では以下のようなブログサイトを作成しながらNext.jsを学んでいくことが出来ます。
ポイント
ここまでReactを学んだ方は、モバイルアプリ開発もReactでやりたくなってくるはずです。そんな方にはReact Nativeがオススメです。
React Nativeの講義
Reactで学んだ知識を使ってモバイルアプリの開発をしたい方はReact Nativeの講義がオススメです。
React NativeはReactの技術を使ってモバイルアプリ開発ができるFacebookがリリースしたフレームワークです。React Nativeの講義の中ではReact Native - The Practical Guide [2021 Edition] 
が最もオススメです。こちらの講義も上で紹介したReactと同じ講師で、こちらの講義も受講者12万5千人と驚異的な数です。
おすすめ度
おすすめポイント
- 英語の講義だが聞き取りやすい
- 約33時間のボリューム
- ミニアプリ作成を通じて学べる
アプリ開発に必要な基本的な機能について一通り学ぶことが出来ますし、React, Next.jsの講義と同様にミニアプリを作成しながら学んでいくことが出来ます。例えば以下のようなショップアプリを作成したりします。
モバイルアプリ開発に関してはSwiftなどネイティブアプリ専用の開発言語、手法を用いることが主流だと思いますし、クロスプラットフォーム開発についてもFlutterなど様々な手法が存在します。そういった意味も込めておすすめ度は星4つとしました。
まとめ
今回はReact関係のUdemyオススメ講座を紹介しました。Udemyを初めて使う方や、セール時には2000円弱で購入できるので本一冊程度の価格ということになります。そう考えるとかなりお得だと思います。
特にReact - The Complete Guide (incl Hooks, React Router, Redux) は本当にオススメです。オンライン講義や動画は数多くありますが、ライブラリのアップデートで古くなっているコンテンツも数ある中で継続的にアップデートしてくれている良いコンテンツですよ。
ぜひお試しあれ！