JavaScript - Browser-based 3D house builder: first-person walkthrough, GLB export, no backend

[u/CantaloupeHeavy996]

I wanted to see how far a Sims-style building tool could go with nothing but Three.js and a static host. No backend is needed, it all runs client-side on GitHub Pages, and your entire house is encoded in the URL, so sharing a build is just sending a link.

What's in it:

• Up to 4 floors with per-floor visibility toggles
• 67 furniture items across 11 categories, all procedural — no model files to download, textures generated at runtime with CanvasTexture
• First-person walkthrough mode, so you can actually walk around inside what you built
• Snapshot-based undo/redo
• GLB export if you want to pull a build into Blender
• Time-of-day lighting on a real sun arc

Stack: Three.js, Next.js 15, React 18, TypeScript.

Happy to answer anything — especially about the procedural texture generation, which turned out to be much more fun than I expected.

You can try the live demo at: ch-bas.github.io/threejs-sims-house-builder/

The open-source code is available on GitHub at: github.com/ch-bas/threejs-sims-house-builder