React Three Fiber (R3F)

pmndrs/react-three-fiber と drei を使った Web の 3D 表現スキル。Three.js を React 風に書ける。React/Next.js プロジェクトが前提。

発動条件

• 「3D入れて」「ヒーロー3D」「3Dモデル」「3Dシーン」
• 「R3F」「React Three Fiber」「Three.js」「WebGL」
• 「立体的なヒーロー」「GLTF読み込み」「3Dカード」
• ブランドサイト・プロダクトページで製品の3D表示を要求された時

必須インストール

npm install three @react-three/fiber @react-three/drei
npm install -D @types/three

基本テンプレ（コピペで動く）