JavaScriptの備忘録。調査結果を忘れないように記載。
ESLintとPrettierを競合させずに共存させる設定入門新着!!
ESLintとPrettierを同じプロジェクトに入れると、保存のたびに整形結果が行ったり来たりしたり、npm run lint が「直したはずの箇所」でエラーを出し続けたりすることがあります。これは両者の役割分担を整理しないまま、同じ対象…
webpackの画像最適化：image-minimizer-webpack-pluginで配信サイズを削減する新着!!
画像はフロントエンドの転送量の大半を占めることが多く、ビルド時に圧縮をかけるだけで配信サイズを大きく減らせます。本記事では webpack 5 で image-minimizer-webpack-plugin（内部で sharp / ima…
Framework7 + Reactで作るモバイルWebアプリ入門新着!!
モバイルWebアプリで「ネイティブアプリのような操作感」を実現しようとすると、ページ遷移アニメーション・タブバー・スワイプバック・プルトゥリフレッシュといった要素を自前で実装することになり、想像以上の工数がかかります。
core-jsとbabel/preset-envで理解するトランスパイルとポリフィル新着!!
モダンなフロントエンド開発では、最新のJavaScript構文を書いても古いブラウザで動く。これを支えているのがBabelだ。しかし「Babelを使えば全部よしなに変換してくれる」と理解していると、asyncは動くのにArray.proto…
Twilio SDKでSMS送信機能を実装する入門新着!!
アプリケーションから SMS を送りたい場面は意外と多いものです。予約リマインド、二要素認証（2FA）のコード通知、配送ステータスの連絡など、メールよりも到達率と即時性が求められるシーンで SMS は強みを発揮します。
ESLint + Prettier + TypeScript が競合しない設定術新着!!
ESLint・Prettier・TypeScript を同じプロジェクトに入れると、「保存のたびに整形が暴れる」「npm run lint と npm run format が逆方向の修正を出す」「eslint --fix が延々と差分を生…
ESLint + Prettier + TypeScript が競合しない設定術新着!!
ESLint・Prettier・TypeScript を同じプロジェクトに入れると、「保存のたびに整形が暴れる」「npm run lint と npm run format が逆方向の修正を出す」「eslint --fix が延々と差分を生…
ESLint + Prettier + TypeScript が競合しない設定術新着!!
ESLint・Prettier・TypeScript を同じプロジェクトに入れると、「保存のたびに整形が暴れる」「npm run lint と npm run format が逆方向の修正を出す」「eslint --fix が延々と差分を生…
TanStack Query のキャッシュ戦略と staleTime 入門新着!!
React でサーバーの状態（サーバーから取ってくるデータ）を扱うとき、useState と useEffect で自前実装すると、ローディング・エラー管理・再取得・キャッシュ・重複リクエストの排除などを毎回書くことになります。TanSta…
@react-google-maps/apiでReactに地図とマーカーを表示する
React アプリに Google Maps を組み込み、地図上にマーカーと情報ウィンドウを表示するところまでをハンズオン形式でまとめます。素の Google Maps JavaScript API を命令的に操作する方法もありますが、Re…