![[Next.js #17] R3Fでドラッグ操作可能なルービックキューブを実装する](https://humanxai.info/images/uploads/nextjs-17-r3f-rubiks-cube-drag-physics.webp)
[Next.js #17] R3Fでドラッグ操作可能なルービックキューブを実装する
2026-02-15 | lain
配列データの管理から物理ベースの設計へ。R3Fでドラッグ操作、角丸の高級マテリアル、そして動的なグループ化を用いたルービックキューブの実装プロセスを解説します。
カテゴリ：React Three Fiber
![[JavaScript] Three.js Snippets 完全ガイド - 効率的な開発を加速するVSCode拡張](https://humanxai.info/images/uploads/javascript-threejs-snippets-guide.webp)
[JavaScript] Three.js Snippets 完全ガイド - 効率的な開発を加速するVSCode拡張
2025-12-16 | lain
Three.jsの開発を高速化するためのVSCode拡張「Three.JS Snippets」の完全ガイド。スニペットによるコード生成で効率的な開発を実現！
![[Next.js #16] R3FでGLTFモデルを横スライド切替する3Dビューアを実装する](https://humanxai.info/images/uploads/nextjs16-r3f-gltf-viewer.webp)
[Next.js #16] R3FでGLTFモデルを横スライド切替する3Dビューアを実装する
2026-02-14 | lain
React Three Fiberで複数のGLTFモデルを横スライド切替できる3Dビューアを実装。モデルの自動センタリング、スケール正規化、Box3による接地処理、lerpによるスムーズ移動、ドラッグ操作の仕組みまで整理する。