未分類

JestでTypeScriptをテストする方法

JestでTypeScriptのテストを実施する場合には、まずはそれらのTypeScriptをJavaScriptに変換する必要がある。この変換の仕組みとして、babel-jestを使用する方法を記載する。 環境 Windows 11 Ho...
React

Jest、React Test Renderer、React Testing Libraryの違い

Reactのテストで使用する以下について、違いを本記事に整理する。 Jest React Test Renderer React Testing Library Jest Jestは、Facebook社(Meta社)によって開発・メンテされ...
React

Viteを使用して、TypeScriptによるReact開発を始める

Viteを使用して、TypeScriptによるReact開発を始める方法について記載する。 環境 Windows 11 Home 23H2 Node.js v20.12.2 npm v10.5.0 Viteとは? Viteとは、Web開発の...
問題の解消方法

開発者ツールのデバイスエミュレーション機能を使用すると、開発中のHTMLが縮小表示される

現象 開発者ツールのデバイスエミュレーション機能を使用すると、開発中のHTMLが縮小表示される現象の解決方法を記載する。なお、ブラウザでの通常表示(デバイスエミュレーション機能を使用しない)時は、本現象は発生しない。 キャプチャ画像 デバイ...
QGIS

国土地理院のシェープファイルで、都道府県単位の重心を求める方法

やりたいこと 前回の記事で作成した都道府県単位のシェープファイルにおいて、各都道府県の重心を求める方法について記載する。本記事では都道府県の重心についてまとめるが、同様の手順で様々な地物の重心を求めることも可能。 環境 Windows 11...
QGIS

国土地理院の日本地図のシェープファイルを、市町村ではなく都道府県単位にする方法

現象 国土地理院の日本地図のシェープファイルの情報粒度は下図のように市町村単位となっており、見づらいという問題がある。本記事では、QGISを使用して、このシェープファイルを市町村単位から都道府県単位に変更する方法について記載する。 環境 W...
QGIS

国土地理院のシェープファイルからGeoJSONファイルを作成する方法

ブラウザ上で地理空間情報を扱うにはGeoJSONが都合が良いが、国土地理院が日本地図として公開しているのはシェープファイルのみとなっている。今回は、QGISを使用し、国土地理院が公開している日本地図のシェープファイルからGeoJSONファイ...
Playwright

VS CodeにPlaywrightの拡張機能をインストールする方法

こちらの記事で、Playwrightのインストール方法について記載した。今回は、VS CodeにPlaywrightの拡張機能をインストールし、PlaywrightをVisual Studio Code(VS Code)に統合する方法を説明...
Playwright

Playwrightのインストール方法

仕事で複数端末/OSを対象にしたWebアプリ開発することになったので、Playwrightについて調査。今回は主にインストール方法をまとめ、後日詳しい使用方法について記載する。 環境 Windows 11 Home 23H2 Node.js...
VS Code/Extension

VS CodeでJSONを編集する方法

JSONはキーと値のペアでデータを保持するファイルフォーマットで、設定ファイルやサーバとのデータ送受信などでよく使用される。今回は、VS CodeでこのJSONファイルを編集する方法について記載する。 環境 Windows 11 Home ...