React初心者向けにおすすめ勉強法を現役エンジニアが紹介【2020年版】

プログラミング勉強中

悩む人
Reactの勉強がしたいけど、どう進めたらいいの？

そんな悩みに答えます。

どうも、Reactアプリを実務で3件開発、React歴1年半ほどの現役エンジニアです。
この記事では、React初心者向けにおすすめの勉強法を紹介します。

 

本記事の狙い

  • Reactを効率良く勉強できる方法がわかる
  • 無料で学ぶ方法がわかる
  • 有料で学ぶ方法がわかる

Reactおすすめの勉強法

勉強のステップとしては、下記の順で学習すると良いでしょう。

勉強ステップ

  • HTML/CSS/Javascriptの書き方を覚える
  • Node.jsの存在を知る
  • Javascript ES2015(ES6)の記法を覚える
  • Reactの学習コンテンツで勉強する
  • 実際に何かを作る

Reactを扱うには、そもそものWEB画面を作るための前提知識がやや多めに必要となります。
それらを知っていないと、Reactの使い方を覚える以前のところで、
つまずきまくってしまいますので気を付けてください。

 

私の場合は、海外の方が作ったオープンソースのReactアプリをカスタマイズするという案件に体当たりして、
3ヶ月間、土日や勤務時間後のプライベート時間を犠牲にして、一人で悩みながら改修した経験があります。
皆さんはそうならないように効率的に勉強して無理しないようにしてください。

 

ステップ４までは、学校の勉強と同じでスムーズに行くと思います。
ステップ５に関しては、「知っている」から「できる」状態になるものですので、ここの壁は厚いです。
ただ、一番学習効率が良いのがステップ５になるので、自分に負けずに取り組んでください。

 

ステップ５の先には、下記のような知識も必要になってくると思いますので、
上記クリアできたら、挑戦してイケてるフロントエンドエンジニアを目指しましょう。
・Typescriptでの実装
・Next.jsでの実装

 

Reactを無料で学ぶ方法

Reactを無料で学ぶ方法としては、3つです。

  • 学習サイトで学習する
  • Youtubeで学習する
  • ひたすらググる、無料サイトを活用

 

学習サイトで学習する

学習サイトはたくさんあるので、ここでは2つだけ紹介します。

メリット

  • 情報が整理されているので順を追って勉強しやすい

デメリット

  • ちょくちょく有料に誘導される

 

Youtubeで学習する

学習するために役立つYoutubeチャンネルを　2つ紹介します。

ステップ１～３は、しまぶーさん動画で学習できると思います。
ステップ４以降は、トラハックさんの動画が良コンテンツです。

 

メリット

  • 無料
  • シリーズで整理されているチャンネルは順を追って勉強しやすい

デメリット

  • 長めの動画だと飽きてくる
  • 広告やおすすめ動画など学習に関係ない情報に誘惑される

 

ひたすらググる、無料サイトを活用

ググったら最近はほぼQiitaが検索上位に上がってきますが、
それ以外のブログサイトも見つかるので、情報量は多いです。
時間に余裕のある人ならこのやり方でもいいでしょう。

Zennで無料で本を出している人もいるので、覗いてみてもいいかもしれません。

メリット

  • ピンポイントに知りたい情報に行きつきやすい
  • 情報量が多い

デメリット

  • 自分の悩みを解決できる記事を探す時間がかかる
  • ものによっては情報の質が悪い

 

Reactを有料で学ぶ方法（時短）

Reactを使えるようになるための有料の方法としては、２つです。

  • 有料学習サイトで学習する
  • 書籍で学習する

 

有料学習サイトで学習する

有料学習サイトでオススメは、Udemyです。

理由は

  • スクールや研修会社の研修を受けるより比較的安価（セール時書籍1冊分程度の価格）
  • 動画教材なので繰り返し復習しやすい
  • 細かく動画が区切られているので少しずつ進めやすい

という3点です。

 

ReactでオススメのUdemy動画は、この3本です。

ステップ１－２までは無料コンテンツで済ませてしまって、
ステップ３ー５はこちらの有料コンテンツで、済ませればいいと思います。
（もちろん、ステップ１－２に当てはまる動画もありますのでそちらを購入してもいいと思います。）
また、Q&Aサポートもついているので、わからないところは聞くことができます。

 

じゃけぇさんは大阪のフリーランスエンジニアで、
若手エンジニアのためにノーマウント勉強会を開催されている方です。
はむさんは元シリコンバレーエンジニアで、
プログラミング講師として、Udemyで多くの研修動画を出しています。
どちらもわかりやすいと評判で、信頼できるエンジニアなのでオススメします。

 

Udemyはセール期間中でないと高いので、セール期間中を狙って購入しましょう。

 

メリット

  • 目的の知識を一気に学べる
  • セール期間だと書籍1冊ほどの価格で買える
  • 勤務先が「udemy for business」を契約してくれたら学び放題

デメリット

  • セール期間でないと高い
  • 中には10時間以上かかるものもある
  • 有料でも質の悪いものがある
    （図で説明でなく、口頭だけの説明で済ますものがある）

 

書籍で学習する

書籍でオススメなのは、出版社が出しているものではなく、
個人で出している下記のものです。

技術書典で技術同人誌として頒布されているものですが、人気が高くシリーズ累計１万部売れているそうです。
Reactや関連ライブラリはバージョンアップでどんどん更新されてるため、
出版社の書籍より、こちらの技術同人誌の方が情報が更新されており、実践向きなのでおすすめできると思います。
大岡由佳さんはフリーランスエンジニアだそうです。

 

メリット

  • いつでも購入しやすい価格

デメリット

  • 本嫌いな人にはつらい、積読状態になりやすい
  • 出版社の書籍には、情報が古いものが多いので注意

 

まとめ

おすすめの勉強方法ステップ

勉強ステップ

  • HTML/CSS/Javascriptの書き方を覚える
  • Node.jsの存在を知る
  • Javascript ES2015(ES6)の記法を覚える
  • Reactの学習コンテンツで勉強する
  • 実際に何かを作る

Reactを無料で学ぶ方法

  • 学習サイトで学習する
  • Youtubeで学習する
  • ひたすらググる、無料サイトを活用

 

Reactを有料で学ぶ方法（時短）

  • 有料学習サイトで学習する
  • 書籍で学習する

 

皆さんもReactを学んでイケてるシステムをどんどん開発していきましょう。

 

以上です。
読んでくださった方ありがとうございました。

-React
-, , ,

© 2020 tako-xyz