概要 React.jsでの開発において、jsconfig.json（TypeScriptの場合はtsconfig.json）のcompilerOptionsにbaseUrlを指定すると、import文を絶対パスで記述でき […]

概要 ReactのuseStateフックを使って管理している多次元の配列やオブジェクトを更新する場合、元の配列・オブジェクトをディープコピーしなければならない。 シャローコピーだと破壊的変更となってしまい、Strictモ […]

概要 WordPressのブロックエディタにて、元々は画面の一番下にあったSEOパネルの位置が右に移動して戻せなくなってしまったが、以下の手順で元の位置に戻すことができた。 おそらく、カスタムフィールドを有効にすることで […]

メモアプリの作成 カスタムフック化前 カスタムフック化 touch src/hooks/useMemoList.ts

カスタムフック カスタムフックとは カスタムフックとは任意の処理をまとめた自作のフックのことで、ロジックをコンポーネントから分離したり、複数のコンポーネントからロジックを再利用したりすることが可能となる。 カスタムフック […]

TypeScript propsの型定義 型定義の管理 複数の場所で使う型はtypesディレクトリにまとめる。 mkdir src/typestouch src/types/car.ts 利用時 importの後にtyp […]

TypeScript 環境構築 基本的な型 配列とオブジェクト 配列 const arr: number[] = [11,22]またはconst arr2: Array<number> = [33,44] オ […]

グローバルState バケツリレーのデメリット Propsのバケツリレーには以下のデメリットがある。 ContextでのグローバルState グローバルStateを管理するライブラリはいくつかあるが、Reactが持ってい […]

再レンダリング 再レンダリングの条件 再レンダリング（関数コンポーネントの先頭から処理が実行）が起きるパターン 注意したいのは3の場合で、例えばApp.jsのStateを更新すると全てのコンポーネントが再レンダリングされ […]

CSS ReactでのCSSの書き方 6種類くらい書き方がある。 CSS Modules Styled JSX npm install styled-jsxでインストール styled components npm in […]