Physics in React Three Fiber
@react-three/rapier 2.2.0 (built against Rapier 0.19.2) running on the course's Rapier 0.21.0: that mismatch is why the init warning appears. onSleep fires once per crate when it comes to rest.
The physics world and the three.js scene are two separate copies of the world. After every step, copy each body's position and rotation into its mesh, and never move the mesh by hand: the body owns the transform. In React Three Fiber, @react-three/rapier does this for you.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 4 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Write syncAll(pairs) that copies every body's pose into its mesh.
Make a moving platform: a kinematic body that slides back and forth 1 m, carrying a crate.
Explain it without notes
Who should own an object's transform in a physics scene, and what goes wrong otherwise?
How do you move a dynamic body, a kinematic body and a fixed one?
Console
Nothing logged yet.Expected console output
THREE.Clock: This module has been deprecated. Please use THREE.Timer instead.
using deprecated parameters for the initialization function; pass a single object instead
the crate that started at y 1 fell asleep
the crate that started at y 2 fell asleep