チュートリアルの内容

Reactを使って三目並べのアプリを作るチュートリアル。

Reduxとかルータの話題は出ない。

感想

無料だし最初のとっかかりとしてよかった。

Reactは前に Udemyの講座を受けてみたことがあったけど、先にこっちのチュートリアルやってからの方がよかった気がする。

Udemyの方は

とかで充実はしていたけど当時の前提知識だと重く感じた。

あと動画が配信されてから日が経っていてライブラリとかAPIの情報が古くて自分で色々デバッグするはめになったりはしていた。

一昔前は日本語ドキュメントの多さでVueがだいぶ有利だったかもしれないけど、色々ググってみてReactの方も十分日本語の情報揃ってる感はあった。
「React」っていうとフレームワーク扱いされるけど、ReactもVueと同じでそれ単体だとjQueryの問題を踏まえて作ったフロントエンド開発の保守性を高めるライブラリであって、Reduxとかルータとか後付けて色々足してくとフレームワークっぽく使える
「コンポーネント」という再利用可能なUI部品を組み合わせて開発する
コンポーネント間で「状態」（三目並べでいうと◯×とか）を受け渡す
stateに状態を保持して親コンポーネントから渡ってきたものをpropsに受け渡す
最終的にコンポーネントから受け取った状態をrenderメソッド内のHTMLで描画する
renderメソッドは初回の描画でこの中では状態とかDOMを変更してはいけない。コンポーネント間で状態受け渡し→renderで描画のルールがある

この後またReact深掘りしようと思った時に何しようか、思いつくまま書いてみると

Railsと連携させてみる（RailsからAPI飛ばしてReactと受け渡しさせる）
Reduxとかルータの話題は出なくてその辺の理解まだいまいちなので深掘りする
Reactベースで開発に必要な機能全部入りのNext.jsとかいうやつも気になる
javascriptの復習する。今回のチュートリアル内でこのサイトがjavascriptのおすすめおさらい教材として紹介されてたので読んでみたい
リントとかテスト触る
「Reactは関数型言語っぽい」らしいけどよくわかってないので調べる。今の理解だと関数型言語は「関数の中の変数の状態を変えずに、関数そのものを他の関数の引数にする」的な組み方をするのでその辺が状態→renderメソッドの流れに似てるとかかと思ってるけど知らない。

キャリアプラン的には当面バッグエンドよりかと思ってるし、 Githubの有名なロードマップみると道のりは険しいというかそんなに簡単にキャッチアップはできないのかもしれんけど、フロントエンドもできるようになれればいいな。。

入門記事としてはこれ読めば良いのでは