たかし君、そういえばこの間、「フリーランスエンジニアとして活躍して月収100万円以上稼ぎたい」って言ってたっけ。そんなたかし君は、Reactを勉強するといいかもしれない。たかし君がReactを勉強すると、こんないいことがあるよ。
- 近年のフロントエンド開発のトレンドはReact
- Reactの案件は高単価なものが多い
- Reactができると案件がとりやすくなる
とはいえ、「どうやってReactを勉強すればいいんだ???」って思ってるよね。たしかに、いきなりReact始めろっていわれても、どこから手を付けていいかわからないと思うから、この記事でたかし君のReact学習の進め方について紹介していこうと思うよ。
さらっと読んでいたReactの公式ドキュメントからリンクが引いてあったとあるサイトが、初心者にもわかりやすくReactの導入について書いていそうだったから紹介しようと思う。僕もこれから勉強していくクチだけど、このサイトをベースに勉強を進めていけば、導入はできそうな予感がする。
Tania Rasciaさんという方のサイトで、まださらっとしか覗いていませんがかなりわかりやすく解説していただいている印象。英語のサイトですが、Chromeの翻訳機能つかえば英語の読めないたかし君でも問題なく進めていけると思う。(翻訳精度のせいか、分かりにくい部分があったら教えてね。)
— かわい@WEB制作 (@kawai_de_gozaru) February 26, 2022
Reactマスターへの道
一歩ずつ進めていきます。。
【済】(Reactの前に)Vanilla JavascriptでAPI接続をする
Reactを始める前に、まずはJavaScriptのおさらいをするのが良さそうです。Vanilla JSでAPIへの接続を試みます。
— かわい@WEB制作 (@kawai_de_gozaru) February 26, 2022
こちら、作りました。ちゃんとお手本通りに作れました。👏
JSでAPIからデータ取得して表示する方法について学べました。
VSCodeのテーマのインストール
タニア信者になるのでテーマも入れちゃうhttps://t.co/ZOmRpSATsF
— かわい@WEB制作 (@kawai_de_gozaru) March 1, 2022
タニアさんのテーマを入れます。React Optimizedされてるっぽい。ちなみにこれまで使ってたテーマはKTRZさんのKTRZ Monokai。(これも結構いいのでおすすめ)
CDNでReactをちょっぴりはじめる
次はこちら、まずはCDNでReact動くことを確認します。https://t.co/H0HH5VFHeO
— かわい@WEB制作 (@kawai_de_gozaru) March 1, 2022
↓できた。Hello Worldした
React環境を作る(CDN使わない)
npxで普通にはいった。ということでこちら進めていきます。
フォームデータの送信までできた
一応作ったけど途中で写経になった。どっからか理解が追いつかなかったから復習します