![[Next.js #07] R3FでglTF/VRMを扱うための“橋渡し”基礎まとめ](https://humanxai.info/images/uploads/nextjs-07-r3f-gltf-vrm-bridge.webp)
[Next.js #07] R3FでglTF/VRMを扱うための“橋渡し”基礎まとめ
2026-02-07 | lain
Three.jsを理解している前提で、R3FでglTF/VRMを扱うための本質だけをまとめる。Three.jsとR3Fの思想の違い、glTF読込みの仕組み、VRM特有の落とし穴、モデルビューアー設計の基礎を効率的に整理する。
カテゴリ：ReactThreeFiber
![[Next.js #03] React Three Fiber（R3F）導入：Three.js を Next.js と正しく統合する](https://humanxai.info/images/uploads/nextjs-03-r3f-introduction.webp)
[Next.js #03] React Three Fiber（R3F）導入：Three.js を Next.js と正しく統合する
2026-02-02 | lain
Next.js(App Router) と Three.js を安全に統合するための必須レイヤー、React Three Fiber（R3F）の基礎と構造を整理する。ヴァニラ Three.js と R3F の対応関係、Canvas / useFrame / useThree の最低限の理解、コンポーネント境界（use client）など、Next.js で 3D を扱うための“地図”を作る回。