Build a 3D product viewer with react-three-fiber and Framer motion 3D. Learn how to work with Glb Models with React.js and React-three-fiber
Intro (00:0:00)
Project setup (00:4:33)
Setup Framer Motion 3, Three.js and React-three-fiber (00:9:49)
Test React-three-fiber (00:12:22)
Import GLB File with gltfjsx utility and create Laptop component (00:19:04)
Framer Motion 3d (00:32:53)
Starter files : https://github.com/ui-code-tv/starter...
Final code on Github : https://github.com/ui-code-tv/framer3...
Laptop 3d model - GLB File:
https://github.com/ui-code-tv/laptop-...
NOTE: Click on download button to download the GLB file from the above link. The download button is not that easy to see