上尾市のWEBプログラマーによるブログ

[Next.js] CDN版のCSSやJavaScriptを使う方法

概要 Next.jsで外部のCSSやJavaScriptを使う場合、通常はnpmパッケージをインストールしたものをimportする。何らかの事情でCDN版を使いたい場合は、linkタグやscriptタグをNext.jsのルールに則った場所に記述する必要がある。 linkタグ pages/_document.js（拡張子はjsx, ts, tsxなど環境に依存）内に記述する。 import { He...

2023.05.02

React

[React] import文を絶対パスで記述できるようにする方法

概要 React.jsでの開発において、jsconfig.json（TypeScriptの場合はtsconfig.json）のcompilerOptionsにbaseUrlを指定すると、import文を絶対パスで記述できるようになる。 { "compilerOptions": { // 省略 "baseUrl": "." } } これによりimport Header from '../../../...

2023.04.30

React

[React] 多次元配列(オブジェクト)のsetStateが2回実行されてしまう原因

概要 ReactのuseStateフックを使って管理している多次元の配列やオブジェクトを更新する場合、元の配列・オブジェクトをディープコピーしなければならない。シャローコピーだと破壊的変更となってしまい、StrictモードではsetStateが2回呼び出されてしまう。例検証用コード import {useCallback, useState} from 'react' export defa...

2023.04.28

React

[WordPress]SEOパネルなどの位置を右から下に移動する

概要 WordPressのブロックエディタにて、元々は画面の一番下にあったSEOパネルの位置が右に移動して戻せなくなってしまったが、以下の手順で元の位置に戻すことができた。おそらく、カスタムフィールドを有効にすることでSEOパネルをドロップする場所が作成されたのだと思われる。手順 1. 右上の縦三点リーダー「︙」をクリック 2. 「設定」をクリック 3. 「パネル」をクリック 4. 「カスタム...

2023.04.26

WordPress

「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録8

モダンJavaScriptの基本から始める　React実践の教科書posted with ヨメレバじゃけぇ（岡田　拓巳） SBクリエイティブ 2021年09月18日頃楽天ブックス楽天koboAmazonKindle 「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録7の続きメモアプリの作成カスタムフック化前 npx create-react-app memo-...

2023.04.24

React(書評)

「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録7

モダンJavaScriptの基本から始める　React実践の教科書posted with ヨメレバじゃけぇ（岡田　拓巳） SBクリエイティブ 2021年09月18日頃楽天ブックス楽天koboAmazonKindle 「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録6の続きカスタムフックカスタムフックとはカスタムフックとは任意の処理をまとめた自作のフックのこ...

2023.04.22

React(書評)

「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録6

モダンJavaScriptの基本から始める　React実践の教科書posted with ヨメレバじゃけぇ（岡田　拓巳） SBクリエイティブ 2021年09月18日頃楽天ブックス楽天koboAmazonKindle 「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録5の続き TypeScript propsの型定義 type Company = { name: s...

2023.04.20

React(書評)

「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録5

モダンJavaScriptの基本から始める　React実践の教科書posted with ヨメレバじゃけぇ（岡田　拓巳） SBクリエイティブ 2021年09月18日頃楽天ブックス楽天koboAmazonKindle 「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録4の続き TypeScript 環境構築 npx create-react-app my-app2 ...

2023.04.18

React(書評)

「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録4

モダンJavaScriptの基本から始める　React実践の教科書posted with ヨメレバじゃけぇ（岡田　拓巳） SBクリエイティブ 2021年09月18日頃楽天ブックス楽天koboAmazonKindle 「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録3の続きグローバルState バケツリレーのデメリット Propsのバケツリレーには以下のデメリッ...

2023.04.15

React(書評)

「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録3

モダンJavaScriptの基本から始める　React実践の教科書posted with ヨメレバじゃけぇ（岡田　拓巳） SBクリエイティブ 2021年09月18日頃楽天ブックス楽天koboAmazonKindle 「モダンJavaScriptの基本から始めるReact実践の教科書」の感想・備忘録2の続き再レンダリング再レンダリングの条件再レンダリング（関数コンポーネントの先頭から処理が実...

2023.04.13

React(書評)