自動取得後の大量データ確認を一日半から2時間に短縮した、ワークキュー型UIの設計
2026.09.12
自動取得後の大量データの確認・補正作業を題材に、管理画面をワークキュー型UIへ改善した事例を紹介します。少数件のキュー、自動補充、解決済み項目の非入力化、例外の別レーン化、unknown_resultや楽観的ロックなど、人間が大量データを安全かつ効率的に処理するための設計をまとめます。
LaravelのViteプラグインでfontaine未導入警告が出たときの判断と対応
2026.09.09
Laravelの公式ViteプラグインでWebフォントを設定した際に表示される、fontaine未導入警告について解説します。fontaineはWebフォント自体に必須のパッケージではなく、代替フォントの大きさを調整し、フォント切り替え時の画面移動を抑えるためのビルド時パッケージです。警告とビルド失敗の違い、fontaineを導入する場合とoptimizedFallbacks: falseで無効化する場合の判断基準、CLSの確認方法を整理します。
ViteのJavaScriptチャンクサイズ警告が出たときの判断基準：コード分割・閾値変更・現状維持
2026.09.08
ViteのビルドでJavaScriptチャンクサイズ警告が出たときに、ビルドエラーとの違い、非圧縮サイズとgzipサイズの見方、静的importによるチャンク肥大化の原因を整理する。動的importや依存ライブラリの見直し、警告閾値の変更、現状維持について、一般ユーザー向けサービス・社内管理画面・自分専用の管理画面ごとの判断基準と本番運用上の注意点を紹介する。
Vue.jsで一覧画面の無限スクロールを実装する：サンプルJSONから一覧データを取得
2026.09.03
Vue.js単体のViteプロジェクトで、サンプルJSONからデータを取得し、IntersectionObserverで画面下部の監視要素を検知して5件ずつカード表示する無限スクロールを実装します。fetchのエラー処理や再読み込み、全件表示後の監視解除も扱い、サンプルJSONを一括取得するモックと、実際のAPIによるページングの違いも説明します。
Laravel 13＋Vue.jsで画像・CSVを非同期アップロードする：FormData・ファイル検証・非公開保存
2026.08.31
Laravel 13のBladeに組み込んだVue.jsから、FormDataを使って画像またはCSVを非同期で送信する方法を解説します。JPEG・PNGの画像検証、CSVの文字コード変換と簡易的な内容確認、20MBのサイズ制限、非公開ディスクへの保存、CSRF・バリデーションエラー処理を実装し、fetchを基本にaxiosとの違いも整理します。
Laravel 13＋Vue.jsで登録・編集フォームを非同期化する：fetchとaxiosを比較
2026.08.26
Laravel 13のBlade画面にVue.jsを組み込み、membersテーブルのnameとemailを登録・編集するフォームを作ります。Vue.jsからLaravelのWebルートへJSONを送信し、CSRFトークン、バリデーションエラー、送信中・通信失敗の状態を扱います。リクエスト送信にはfetchとaxiosを使う方法を比較し、追加パッケージの有無やエラー処理の違いを整理します。
CodeIgniter 4のViewにVue.jsを組み込む
2026.08.20
CodeIgniter 4のView全体はサーバー側で描画したまま、一部分だけVue.jsを組み込む方法を解説します。Viteの開発サーバーからJavaScriptを読み込む方法、本番ビルドしたアセットをmanifestから取得してApacheで配信する方法、ControllerからViewへ渡したデータをVue.jsで検索する方法を確認します。
Laravel 13のBladeにVue.jsを組み込む
2026.08.18
Laravel 13のBlade画面にVue.jsを部分的に組み込み、Controllerから渡した商品データを使って商品名を検索する方法を解説します。Viteの設定、BladeからVue.jsへの初期データの渡し方、Js::fromとdata-*属性の比較、npm run devによる確認方法、ブラウザ内検索とサーバー側検索の使い分けを扱います。
ViteでVue.jsを始める：プロジェクト作成から構成確認・デプロイまで
2026.08.17
Windows 11のPowerShellからVue公式のcreate-vueを使って、JavaScript構成のVue.jsプロジェクトを作成します。Viteの役割、srcやApp.vueなどのファイル構成、開発サーバー、プロダクションビルド、静的ホスティングへのデプロイまでを解説します。
MarkdownをHTMLへ変換する方法とXSS対策：PHP・JavaScript・Vue.jsの実装例
2026.08.12
PHP のleague/commonmarkと、Node.js のMarked・DOMPurifyを使い、MarkdownをHTMLへ変換する方法を紹介します。ユーザー入力やAI生成Markdownを未信頼入力として扱い、Vue.js のv-htmlへ安全に表示するための設定と注意点も整理します。