Build: the showroom after Phase 3 (all files in one example)
Local imports cannot run in the preview, so this example has the code of every project file inline, each under a comment with its path. The files below are the same code, split.
Split the showroom's single main.js into small modules (renderer, scene, camera, lights, loop), add the stand module and the bike's seat tube, and make the canvas follow its container.
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 5 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Give createLoop a way to remove an updatable. Write the new method.
Make the turntable turn at one full turn per 10 seconds.
Explain it without notes
Why do renderer.js and camera.js each export a resize function instead of one shared resize()?
What does the loop's add(updatable) buy compared with calling stand.rotation.y += ... in the loop itself?
Console
Nothing logged yet.Expected console output
bike parts: down-tube, top-tube, seat-tube
draw calls: 5 | triangles: 460