IndexedDB

[Lain Clock(仮)] Three.js と MMD を使って制作した Web 時計アプリ

2026-03-12 | lain

Three.js と MMD を使って制作した Web 時計アプリ。壁紙、時計色、床シェーダー、MotionAssets を設定UIから変更し、localStorage / IndexedDB で保存・復元できます。

カテゴリ： Featured

タグ： #webclock#threejs#mmd#indexeddb#localstorage#webgl

【JavaScript 応用講座】：[WebRTC/P2P] ZIPアセットをWebRTCで双方向送受信

2025-07-25 | lain

JavaScriptとWebRTC（simple-peer）を使って、ゲームのアセットZIPファイルをP2Pで双方向送受信する仕組みを構築しました。チャンク分割による転送、Blob生成、ZIP展開、IndexedDBへの保存まで、実装手順を完全公開。デモ付きで応用可能な設計思想を解説。

カテゴリ： JavaScript

タグ： #JavaScript#WebRTC#P2P#simple-peer#IndexedDB#Blob#ゲーム開発#ファイル送受信#フロントエンド

【JavaScript 応用講座】：[P2P通信入門] simple-peerでシグナリングと接続を理解する

2025-07-20 | lain

Webアプリ上でのP2P通信にチャレンジ！「WebRTCは難しそう…」と思っていたけれど、simple-peerを使えば意外とシンプルに実装できました。この記事では、実際の接続手順、initiator問題、シグナリングの中身までを丁寧に解説し、将来的な分散アプリ構想まで視野に入れたP2Pの可能性を探ります。

カテゴリ： JavaScript

タグ： #JavaScript#学習記事#P2P#WebRTC#P2P通信#simple-peer#JavaScript#フロントエンド開発#分散アプリ#IndexedDB#リアルタイム通信#Webアプリ#シグナリング

【JavaScript応用講座】なぜ画像が表示されない？BlobとcreateObjectURLの落とし穴

2025-07-11 | lain

この記事では createObjectURL() の仕組みと、BlobとFileの違い、IndexedDBとの相性、そして「なぜ画像が表示されないのか？」という問題に対する本質的な解決策を、実体験ベースで解説します。

カテゴリ： JavaScript

タグ： #JavaScript#Blob#IndexedDB#File API#Web開発#バグ事例

【JavaScript応用講座】localStorage卒業、IndexedDBでゲームデータを保存する

2025-07-10 | lain

Webゲーム開発で素材の保存に悩んだら？localStorageからの卒業、IndexedDBの導入でZIPデータやサムネイルを自在に管理する方法を実例で紹介。

カテゴリ： JavaScript

タグ： #IndexedDB#idb#Webゲーム開発#localStorage#フロントエンド#ブラウザストレージ#HTML5#GameDev#ZIP管理

[Next.js #35] MMD時計アプリの設定UIを実装 — 壁紙・時計色・床シェーダー・MotionAssets保存対応

2026-03-12 | lain

Three.js製MMD時計アプリに設定UIを実装。アナログ時計・デジタル時計・壁紙・床シェーダー・MotionAssetsの各種設定をGUIから変更し、localStorage と IndexedDB で保存・復元できる構成を整備しました。

カテゴリ： Next.js

タグ： #Three.js#MMD#IndexedDB#localStorage#WebGL#GLSL#Shader#UI

[Next.js #32] Three.js MMDアプリにモデルZIP / 壁紙 / IndexedDB管理を実装 — ローカルアセット基盤の整備

2026-03-10 | lain

Three.js + MMD + WebXR系アプリに、モデルZIPのドラッグ＆ドロップ取込、Blob変換、IndexedDB保存、モデル一覧、壁紙サムネ一覧、削除UIを実装。ローカルアセット管理基盤を整備した記録。

カテゴリ： Next.js

タグ： #Next.js#Three.js#MMD#PMX#IndexedDB#JSZip#Blob#WebXR#Quest2#Asset Management

[JavaScript] IndexedDBのエラーとその解決方法: TransactionInactiveError

2025-11-20 | lain

IndexedDBのエラー「TransactionInactiveError」の原因とその解決方法を解説。トランザクション管理のコツと非同期処理の適切な使い方について学びます。

カテゴリ： JavaScript

タグ： #IndexedDB#エラー解決#非同期処理#Web開発

[JavaScript] IndexedDB: ネイティブ実装の基本と応用

2025-11-12 | lain

IndexedDBをネイティブAPIで実装する方法を解説。非同期処理、データベース管理、パフォーマンス最適化の基本を学びましょう。

カテゴリ： JavaScript

タグ： #IndexedDB#WebStorage#JavaScript#データベース

カテゴリ：IndexedDB