月: 2023年4月の記事一覧
-
[React] import文を絶対パスで記述できるようにする方法
概要 React.jsでの開発において、jsconfig.json(TypeScriptの場合はtsconfig.json)のcompilerOptionsにbaseUrlを指定すると、import文を絶対パスで記述でき […]
-
[React] 多次元配列(オブジェクト)のsetStateが2回実行されてしまう原因
概要 ReactのuseStateフックを使って管理している多次元の配列やオブジェクトを更新する場合、元の配列・オブジェクトをディープコピーしなければならない。 シャローコピーだと破壊的変更となってしまい、Strictモ […]
-
[WordPress]SEOパネルなどの位置を右から下に移動する
概要 WordPressのブロックエディタにて、元々は画面の一番下にあったSEOパネルの位置が右に移動して戻せなくなってしまったが、以下の手順で元の位置に戻すことができた。 おそらく、カスタムフィールドを有効にすることで […]
-
「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録8
メモアプリの作成 カスタムフック化前 カスタムフック化 touch src/hooks/useMemoList.ts
-
「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録7
カスタムフック カスタムフックとは カスタムフックとは任意の処理をまとめた自作のフックのことで、ロジックをコンポーネントから分離したり、複数のコンポーネントからロジックを再利用したりすることが可能となる。 カスタムフック […]
-
「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録6
TypeScript propsの型定義 型定義の管理 複数の場所で使う型はtypesディレクトリにまとめる。 mkdir src/typestouch src/types/car.ts 利用時 importの後にtyp […]
-
「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録5
TypeScript 環境構築 基本的な型 配列とオブジェクト 配列 const arr: number[] = [11,22]またはconst arr2: Array<number> = [33,44] オ […]
-
「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録4
グローバルState バケツリレーのデメリット Propsのバケツリレーには以下のデメリットがある。 ContextでのグローバルState グローバルStateを管理するライブラリはいくつかあるが、Reactが持ってい […]
-
「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録3
再レンダリング 再レンダリングの条件 再レンダリング(関数コンポーネントの先頭から処理が実行)が起きるパターン 注意したいのは3の場合で、例えばApp.jsのStateを更新すると全てのコンポーネントが再レンダリングされ […]
-
「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録2
CSS ReactでのCSSの書き方 6種類くらい書き方がある。 CSS Modules Styled JSX npm install styled-jsxでインストール styled components npm in […]