UseState内で今のstateの値を使って(例えばカウントダウンとか)stateを更新したいときは第一引数で最新の値を受け取れる。型はstateの値に入れているものがそのまま廃いてくる。 例えば useState(10); setState(current => { console.log(current); // 10 re…

[Modal] has inline styles instead of classes. Breaks support of classes API · Issue #16442 · mui-org/material-ui · GitHub - Material-UIのModalはWithStylesが効かないという話。びっくり。インラインスタイルするしかないのがちょっと辛い。 youtu.…

Reactのref ChildAのrefをParent経由でChildBに渡したいときは普通にpropsとして渡して、ChildB内でuseStateに突っ込んでイベント時に更新して使うことになるのかなあ、HTML内で使おうと思うと最初にもらったやつそのままセットしたらnullのまま更新されない…

親コンポーネントで生成したrefを子コンポーネントに渡して、子をforwardRefにすることで子コンポーネントのDOMを操作できるようになる useImperativeHandleを使うと、親がrefを通して実行できる関数を定義することができる(安全になるという感じなのかな) …

わかってたけど、実際やってみてやっぱり本当にそうだよなと思ったこと：個人でプロジェクトやるのと、チームでのプロジェクト、特に実際にユーザーがつくことを想定されたプロジェクトでは参加した時の学習の勢いが全く違う。 () => useContext(XXXContext)…

Responsive Patterns Off canvasっていう縦割りしといてスマホでは一部だけを表示、横スクロールにするパターンは初めて見たな Reactのコンポーネント動的import React.LazyでDynamic importをする。 Dynamic importされたコンポーネントはSuspenseに包まれ…

zelda-botw-starter setStateで作った変数をcontext.Providerのvalueで指定して他の場所で使う。valueと言うのは何も文字通りvalueだけじゃなくてもいいので、setStateで生成した更新用の関数も合わせてObjectで渡すとバケツリレーを回避できる。取り出すと…

zelda-botw-starter 初Tailwind。チートシートあっても結構覚束ない。慣れたら便利そうだけど、慣れるまでに結構時間がかかるんじゃないのかな、そうでもないのかな。クラス名が多くなってしまった時に見にくくならないかがきになるけど、そのレベルまでいっ…

パフォーマンス修正の事例 リストコンポーネントはランタイムのパフォーマンスのボトルネックになりがち。React16からはパフォーマンス計測には公式モジュールを利用できるらしい。 Performance monitor is useful to detect any setTimeout() or setInterva…

GCPUG Spanner Day Spannerの新機能であるバックアップ、もともとexport/importを使えばできたといえばできたけどより手軽にできるようになった。ひっくり返すと、あくまでバックアップ/復元なので、export/importみたいに別のインスタンスに中身移したりに…

MySQL Relay log is created only in slave when replication is configured. I/O thread receives binary log from master and put it into relay log file. Then, SQL thread picks update info from the logs, apply for DB and delete that log. When th…

Gatsbyはmd以外のyamlなどもデータソースとして扱うことができる そもそも、静的サイトジェネレーターがわかってなかったけど、そういうのであれば一般的にはmdがほとんどのデータソースをいい感じにHTML/CSS/JSにしてくれるということなんだろうな Gatsbyは…