React学習
202202 再開
確か以前はReactの公式チュートリアルを走ったあたりで止まったはず
ReactとTypeScriptの学習メモが充実している
blu3mo.icon🙏
-.icon
さくっとwebで動くものを作れる様になりたいなと
ただまあ世界が完全に変わっているよう
「持ってる全てのHTML/CSS/JSの知識と経験、常識をゼロリセットしろ。もっと分かりやすくいうとウェブ技術を全て例外なく忘れろ。そして公式ドキュメントを全部読んでアンラーンしろ」 実際にその頃のJavaScript（つまりES5以前）を触ったことがある人は何かしらJavaScriptには不満があったでしょう。RubyやScalaやGoといった他の言語よりも、明確に劣る言語だと認識していたでしょう。それは何も間違っていません。
ウェブフロントエンドは元々DOMを直接操作したり、おもちゃのようなスクリプトをやっていればそれで良いだけの世界でしたが、すでにそのような時代ではありません。石器時代とは異なり、仮想DOMなどといった抽象化が導入されました。
1から全部作ろうとすると、本質とは関係ないところでつまずいてわけが解らなくなる
Reactを使ってアプリを作りたいだけだったのに、なぜか環境構築で時間を溶かされる npm/yarnの使い方を学んで
package.jsonの書き方を学んで
webpackの設定方法を学んで
editorのeslintとpretterの設定をやって
ここまでやってようやく開発し始められる
一つ一つのステップで絶対設定ミスをおこすので、そのたびに原因をしらみつぶしていく必要がある
UserScript上なら、コピペするだけでも動く
例えば、
を適当なページにコピペしたあと、それを自分のページでimportすればすぐ使える
dynamic import構文で開発コンソールに書き込んでも実行できる
中身を書き換えればすぐに自作appを作り始められる
Preactのlibraryを外部projectからimportしたくない場合は、それらを自分のページにコピペすればいい
file sizeが小さいので簡単にコピペできる
アプリの基礎を実装しなくていいのも利点
サイトのUIやテキストエディタが用意されている
あとはそれに乗っかって自分が欲しい機能を実装するだけ
限界もある
Third Party libraryを使うのに工夫がいる
linterもformatterもない
F5で再読み込みを繰り返して、エラーがなくなるまでやる
あとは開発ツールのdebuggerでdebugしまくる
TypeScriptで書けない
脳内で型推論するしかない
環境構築が不要
TypeScriptで書ける
Third Party packageを何でも使える
編集するたびに勝手にアプリをbuildし直してくれる
GitHubと連携できる
Vercelにワンクリックでデプロイできる
iOSエンジニアとしての最短ルートを通りたいなと
これよさそう
🙏🙏blu3mo.icon
他のページも参考になる
適当なメモ
props と state があって、propsはJSX記法で<tag param=value>と書いたやつを指す
<tag value1={xxx} value2={yyy}>...</tag>の<...>の中に書いた属性のことですtakker.icon
<...>自体はただのHTMLタグ
stateに指定(setState)したものは、更新されるとrenderが呼ばれる
実際に全部renderし直すのではなく、仮想DOMを作った上で比較して必要なところだけ更新するからReactは価値がある ということかな