Loading Animated Characters in React Three Fiber

Learn how to import an animated character that was created in Blender to React and Three.js using React Three Fiber.

We will use a pre-rigged and animated character from Mixamo so don't worry if you don't know how to model and animate in Blender.

Get pre built models and animations.
https://www.mixamo.com

Download Blender
https://www.blender.org/download/

React Three Fiber Starter Project on Code Sandbox
https://codesandbox.io/s/react-three-...


Completed Project Code Sandbox
https://codesandbox.io/s/importing-sc...

0:00 Intro
0:55 Finding Free Characters and Animations on Mixamo
5:05 Installing Blender
5:40 Importing the Character in Blender
8:10 Importing an Animation in Blender
9:46 Attaching an Animation to a Character
12:48 Exporting an Animated Character as GLTF
13:45 Use GLTFJSX to generate a React Component Wrapper
15:50 Using the GLTF export in React Three Fiber
20:11 Playing the animations in React Three Fiber