【React,Jest, testing library】ReferenceError: fetch is not definedエラーの解消方法【vite,webpack】

JavaScript TypeScript React

今回はReactアプリを作成する際にReferenceError: fetch is not definedエラーが出た際の解消方法をエントリーします。ケースとしてはcreate react appではなくwebpackやviteでアプリを作成しアプリ内でfetchを使いAPIなどを利用したケースをJest + Testing…

2022-08-29

TypeScript + Express + ESLintの導入

TypeScript JavaScript Express Node.js

今回はTypeScript + Express + ESLintの導入をしたので備忘録としてエントリーしたいと思います。インストール開発環境のみで利用するためnpmの場合は--save-dev、yarnの場合は-Dのオプションをつけます npmの場合 npm install --save-dev eslint yarnの場…

2022-07-21

「JavaScript」Array.prototype.reduce()の利用例

Array.prototype JavaScript TypeScript

今回はArray..prototype.reduce()の利用例についてエントリーしたいと思います。足し算 1から5を足す計算例（initialValueとして0をaccに渡す） const arr = [1,2,3,4,5] const initialValue = 0 const result = arr.reduce((acc,cur) => acc += cur,initia…

#JavaScript

2022-07-18

「JavaScript(TypeScript)」Array(配列)に格納されているオブジェクトを特定のプロパティで抽出「filter」

JavaScript TypeScript Array.prototype

今回はArray(配列)に格納されているオブジェクトを特定のプロパティで抽出をArray.prototype.filter()を用いて行いますサンプルデータ type ArrayObj = { id: number name: string category: 'a' | 'b' } const arrayObj = [ { id: 1, name: 'taro', catego…

2022-07-18

「JavaScript(TypeScript) 」Array(配列)に連番でnumberの初期値設定方法「map,for」

JavaScript TypeScript Array.prototype

今回はJavaScript(TypeScript) Arrayに連番でnumberの初期値の設定方法をmapとforを使って解説します。解説では0オリジンで0から9までの10個の連番、1オリジンで1から10までの10個の連番を例で解説しています。 Array.prototype.map() 0オリジン const arra…

#JavaScript #TypeScript #map

2022-07-17

Viteのテンプレートを用いてReact + TyepScriptアプリ開発環境の構築

Vite JavaScript TypeScript React

次世代フロントエンドツールと言われているViteのテンプレート機能を利用しReact + TypeScriptの開発環境の構築例前提 node.js,npmが利用できること node -v v16.15.0 npm -v 8.5.5 環境構築任意のディレクトリでviteで初期化 npm init vite@latest 設定は…

#vite #react

2022-03-06