Working with GLB models and Framer Motion 3D: Build a product viewer with react-three-fiber

Опубликовано: 05 Сентябрь 2026
на канале: ui-code-tv
8,148
195

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