😃
React100本ノック 2本目「Counter」(解説付き)
Reactのお題を消化していく、React100本ノック。
Reactの実力向上のため始めました。
ノック2本目:Counter
React100ノックの本家
実装
カウントを作成するお題。
プラスのボタンで数字を増やし、マイナスのボタンで数字を減らす。
利用技術
- React
- TypeScript
- tailwindcss
画面
コード
解説
本家ではとくに制限はなかったのですが、私が実装したときには最大値を100、最小を0としています。
制限がない場合、とても大きな値になったとき表示崩れが生じないかテストする必要があります。
このお題で「useState」「useCallback」の使い方を理解できると思います。
余力があれば、ボタンを長押ししたらカウントをより早くできるような機能を実装するのも勉強になると思います。
React本
本で勉強したい人にはこちらをオススメ
Discussion