React
Reduxとは？Reactで使う意味・不要なケース・Redux Toolkitを解説
Reduxとは何か、Reactで使う意味を初心者向けに解説します。Reduxが不要・必要なケース、useState・useReducer・Contextとの違い、Redux Toolkit、RTK Query、Next.jsでの注意点まで整理します。
ARCHIVE
月: 2023年1月
React
React useEffectを初回だけ実行する方法｜Strict Modeで2回動く理由も解説
ReactのuseEffectを初回マウント時だけ実行する方法を解説します。空の依存配列、Strict Modeで開発時に2回動く理由、cleanup、setInterval・fetchの正しい例、依存配列と無限ループ、useRefで抑止してはいけない理由まで整理します。
React
【React 19.2対応】カスタムフックの作成方法・使い所・実例をわかりやすく解説
Reactのカスタムフックは、useState、useEffect、useContextなどのReact Hooksを組み合わせて、コンポーネント間で再利用しやすくするための仕組みです。React 19.2時点でも、カス…
React
【React】Redux toolkitの使い方(Slice作成、Redux Dev Toolsでstateを確認)
ReactでReduxを使う方法を紹介します。 ReactでReduxを使う方法 公式の手順は以下にあります。 https://react-redux.js.org/introduction/getting-starte…
React
【React】SVGアイコンを使用する方法
Reactで独自で作成したSVGアイコンや無料のアイコンサービスなど使用する方法を紹介します。 ReactでSVGアイコンを使用する方法 他にも以下のように手軽に使えるやり方を紹介しています。 【React】Font A…
React
【React】Reduxの仕組みを1分で理解する
Reduxを理解するために、まずは仕組みを理解しましょう。 Reduxの仕組みを３分で理解する 引用: https://redux.js.org/tutorials/essentials/part-1-overview-…
wordpress
【wordpress】自作ブロックの背景色と文字色をクラスのある場合とインラインの場合で切り替える方法
wordpressでReactを使ってブロックエディタ「Gutenberg」の自作ブロックを作成したときに、 背景色と文字色をクラスのある場合とインラインの場合で切り替える方法を紹介します。 カラーピッカーで自由に選択さ…
wordpress
【wordpress】ブロックサイドバーのカスタマイズ方法(自作ブロック)
wordpressのブロックエディタ「Gutenberg」でReactを使って自作したブロックのサイドバーをカスタマイズする方法を紹介します。 wordpressでReactを使って自作したブロックのサイドバーをカスタマ…
wordpress
【wordpress】ブロックツールバーのカスタマイズ方法(自作ブロック)
wordpressのブロックエディタ「Gutenberg」でカスタムブロックを作成した際のブロックツールバーのカスタマイズ方法を紹介します。 ブロックツールバーのカスタマイズ方法(自作ブロック) edit.jsを作成しま…
React
【React】useEffectとuseLayoutEffectの違い
ReactのuseEffectとuseLayoutEffectの違いを紹介します。 ReactのuseEffectとuseLayoutEffectの違い まず、前提として、useEffectとuseLayoutEffec…
React
【React】useEffectの第二引数の使い方と活用事例と無限ループの注意点
ReactのuseEffectの第二引数の使い方と活用事例と無限ループになってしまう注意点を紹介します。 useEffectの第二引数の役割 useEffectの第二引数は、依存配列と呼ばれます。 useEffectの第…