概要 APIキーなどをコードに埋め込むのはセキュリティ上好ましくないため、環境変数として用意するのが一般的である。 Next.jsで使うAPIキーを管理するだけであれば、.env.localを用意すれば良い。 値の参照は […]

概要 Next.jsでFont Awesomeを使うための手順をまとめました。 インストール 以下のアイコンパッケージは必要な分だけインストール。 コンポーネントでインポートする場合 _app.jsでグローバルにインポー […]

概要 Nuxt.jsはデフォルトでサーバサイドレンダリングが有効になっているため、サーバサイドでは存在しないwindow, localStorage, sessionStorageなどのオブジェクトを参照しようとするとエ […]

概要 Next.jsで外部のCSSやJavaScriptを使う場合、通常はnpmパッケージをインストールしたものをimportする。何らかの事情でCDN版を使いたい場合は、linkタグやscriptタグをNext.jsの […]

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

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

概要 useEffectの第2引数を指定しないとレンダリングの度に処理が実行されるが、それは関数コンポーネント内に直接書いた処理と何が違うのか。 例えば、以下の処理ではinitializeとupdateは初回のレンダリン […]

概要 reactのuseEffectフックは第2引数によって実行されるタイミングが異なる。 サンプル 実行結果 読み込み時 mounted, updatedmountedvariable changed num++ボタン […]

kindle本「はじめてつくるReactアプリ with TypeScript」のまとめ。 点数 82点 感想 とてもわかりやすかった。 作成するアプリは簡単なものだが、ひとつひとつの説明が丁寧で理解しやすい内容だった。 […]

kindle本「React学習挫折経験者による挫折しないReact基礎学習」のまとめ。 点数 50点 感想 CDNを使って関数コンポーネントで実装する、という内容だった。 Props, Stateを少し使って終わりのため […]