- What Three.js and React Three Fiber are and what they're used for.
- Create an interactive 3D scene by describing it to Claude Code.
- Publish it to share with your students.
Key concepts
Step by step
cd ~/proyectos-ia mkdir simulacion-3d cd simulacion-3d claude
Describe the scene you want. Example (adapt it to your subject):
Run on your computer
npm install npm run dev
Open the local address and try rotating the scene with your mouse.
If something goes wrong
- Black screen — check for an error in the browser console (right-click, "Inspect"); copy it to Claude Code.
- Camera won't rotate — ask it to add orbit controls ("OrbitControls").
- Too heavy — reduce elements and texture size.
Practice challenge
Add buttons to "visit" each planet (so the camera travels to it) and a side panel with its info card. You'll have turned the simulation into a small interactive lesson.