見出し画像

【良い】React公式チュートリアルに手を出してみたら想像の10倍面白そう

プログラミングを学習しはじめて、仕事終わりや休日に学習しています。
そろそろ3ヶ月になります。
Ruby(Rails)、HTML、CSSを一通り触ったあと、JSを最低限やって、今はReactに挑戦中です。

一般的なカリキュラムの弱点

いま、受講中スクールのカリキュラムの「アドバンス」なるコースを触っています。
如何せんアドバンスなせいで全員が取り組むわけではないコースなわけで、メンテ間隔がちょっと長め(オブラート)なのかな?
という感じのカリキュラムです。

一応書き添えておくと、別にスクールをディスっているわけではありません。
ビジネスでやる以上、影響範囲が広くてメンテナンスが必要な優先事項はもっとあるでしょうし、そっちを優先するのは当たり前です。
自分が過疎地に踏み込んでいることも自覚していますから、多少荒れてても気にしません。git cloneしたコーディング問題が、問題見る前の起動段階でエラー吐くとか、いい実戦訓練じゃないですか。
なんなら実務で会社に入ったら古いドキュメントしかなくて最新情報は常にコードを読んだり自分でキャッチアップしなきゃならない、みたいなこともあるでしょう。嫌ですけど現実的には全然ありそうです。

そんなわけで、ちょっと古いドキュメントを自分でキャッチアップしながら読み進めて、問題として出てくるコードを最新の環境で動くようにアップデートしながら学習したわけです。

進歩が早い分野を学習するということ

Reactという技術に限らず、特に進化の早い技術については、こういったスクールのような二次資料がアップデートされるまでのタイムラグの影響が大きくなることは普通にありそうです。

ということは、今後いわゆる「モダンな技術」を学び続けると仮定したとき、わかりやすくまとめてくれる誰かの登場を待っている状態であること自体が、技術者として根本的な弱点になる。と言える気がします。

YouTubeでわかりやすくまとめてくれる人はたまにいますが、それでも「その人が学んで、噛み砕いて、その人がわかりやすいと思う形に整形して、世に出すまで」には、やはり時間がかかるでしょう。
ということは、やはり最新の一次情報に触れていける技術者の方が強いと考えられます。

という高尚な考えがあったわけでは全くなく、単にオススメされたのでReact公式のチュートリアルに挑戦してみることにしました。

React公式チュートリアル

結構しっかりと基礎の基礎からReactを学ぶことができます。
一応、前提知識は「HTMLが書ける」「JavaScriptがちょっとわかる」ぐらいあればなんとか進められそうな気がします。
そもそも「HTMLとJavaScriptを合体させて扱いやすく高機能にしよう、さらに簡単に記述できるようにしよう」という技術だと理解しているので、それはまぁそうでしょう。

麻婆豆腐のレシピに「豆腐売り場への行き方」が書いてないのと同じだと思いましょう。

最新の技術から入門できる

この公式の親切なところは、最新のReact環境から入った人も学習しやすくしてくれている点です。

2018 年に React フック (hook) をリリースした際、フックのドキュメントはクラスコンポーネントに精通していることを前提としていました。これにより、コミュニティは非常に迅速にフックを採用することができましたが、しばらくすると古いドキュメントは新しい読者に対応できなくなりました。新しく React を学ぶ人は、クラスコンポーネントを使った学習とフックを使った学習の 2 回に分けて React を学ばなければなりませんでした。

新しいドキュメントでは、最初からフックを用いて React を学びます。ドキュメントは主に 2 つのセクションに分かれています。

https://ja.react.dev/blog/2023/03/16/introducing-react-dev

古い技術も分かる方が良いそうだけれど

実際には現場で取り組む際は、古いバージョンで書かれたクラスコンポーネントを関数コンポーネントに書き換えたり、両方が読める人の方が重宝されるそうです。

そりゃまぁ、片方しかわからない人より両方わかる人の方がいいでしょう。

しかし今や、クラスコンポーネントから関数コンポーネントへの移行や、古いコードの「読解」の部分は、生成AIにコピペするだけで大量のコードを読み込んで解説までできてしまう時代です。

そんな中で、古い技術を「念の為」学んでおくことの価値は、無いとまでは言いませんが「これができればメッチャ強みになる」とは言いづらくなっている部分はありそうです。

※繰り返しになりますがプログラミング歴自体3ヶ月の人が想像で書いているだけなので鵜呑みにしないようにしてください

実際にやってみた

実際にReact公式のlearnページをやってみました。
ページは全部英語ですが、Chromeの機能でページ全体を日本語に翻訳しておけばスムーズに読むことができます。
最初から日本語で書かれたような自然な文言で、親しみやすい文章です。

ブラウザの翻訳機能で日本語にしたところ。自然に読める

環境構築なしで、とりあえずコードを学べる

React公式チュートリアルの良い点は、ブラウザ上でコードが書かれているものを操作するとリアルタイムで結果が返ってくるので、環境構築やディレクトリの作成などすっ飛ばして、とりあえず書き始められます。

左側のコードを書き換えると右側のプレビューも変わる。楽しい

説明が結構わかりやすい

おそらく、全ての公式チュートリアルがそうではないのですが、Reactの公式記事はとてもわかりやすいです。(特に、一度実際に触って、書いてみてから読むとさらにわかりやすいです)

下手をすると、基礎知識がある一般プログラマの解説よりもプレーンでわかりやすいかも知れません。

一見わかりにくいけど、一度コードを書いてから読むとメッチャ分かる

敬遠せず公式にアタックしよう

というわけで、今日初めて「公式チュートリアル」なるものに着手してみて、これまで敬遠していたことを後悔するくらい分かりやすく面白かったので、これからしばらくしっかり取り組んでみようと思います。

他の言語や技術を学ぶシーンは今後ずっとあります。
今回の教訓を活かして、一次情報にアタックしてみるようにしたいと思いました。

Reactやるぞー。

この記事が気に入ったらサポートをしてみませんか?