これからReactのこと勉強したい人に送るReact勉強法
Goodpatch Advent Calendar 2017 の21日目の記事です。
こんにちは。フロントエンドエンジニアをしてます杉原です。
私はAngularJSでここ2年ぐらいやってたのですが、今年になってReact + Reduxで開発することになりました。そこで今回はReact初心者の私がどうやって勉強していったのか紹介したいと思います。
React + Reduxのチュートリアル
まずはオーソドックスに公式サイトのチュートリアルをやっていきます
React
Tutorial: Intro To React – React
これをやれば、JSXや、props、stateなど、Reactでのアプリの作り方がなんとなくわかってきます。
Redux
お次はReduxです。
Reduxは考え方に慣れるのに時間がかかるので、とりあえず写経していってあまり深く考えずこんなものかーというかんじでやっていくのがいいと思います。
WEB + DB PRESS
約1年前のWEB+DB PRESS に「Reactでつくるシングルページアプリケーション入門」という記事があったのでこれを写経しました。
この記事ではReact + Fluxですが、より実践的なことが学べます。Webpackの設定仕方から、Reactへのfluxの導入まで丁寧に解説されてます。
なんとなくReactが分かる方はこれからはじめてもいいかもしれません。
egghead.io
いろんなReact Reduxのチュートリアルがやりたかったので、eggheadio にあるReactやReduxのコースをやりました。
英語ですが、動画でコードをみながら学習できるので、英語分からなくても問題ないと思います。
verekia/js-stack-from-scratch
最後により実践的にReact +ReduxでSPAをつくってみたかったので、verekia/js-stack-from-scratch というリポジトリのチュートリアルをやりました。
このチュートリアルのすごいところはReactだけでなくて、モダンなJS周りの技術に触れることができることです。
Yarn, ESLint, Flow, Jest, Webpack, SSRなどなど。
Reactだけでなくて、モダンなフロントエンド全般の知識をつけたい方にはこのチュートリアルはオススメです。
最後に
多分、これだけやれば基本的なReactの使い方や、Reduxの考え方はわかるようになると思います。
これからReact勉強しようと思っている人に参考になれば幸いです。
「作る」ことの障壁をなくし、「勝てる」に注力できる組織へ
このような方におすすめです
- ・AI駆動のプロダクト開発を、外注ではなく内製の力として定着させたい
- ・研修や勉強会を実施しても、現場の業務プロセスにAIが定着していない
- ・社内でAI活用が一部の人材に集中しており、組織全体に広げたい