logo

Babylon.js Market

By Lawrence

5 minutes

You want to build a twin-stick shooter, but right now there's nowhere to play. No floor under the ship. No camera looking down at it. No cover to hide behind. The arena has to exist before any bullet flies. It needs lights, a camera to frame it, and a floor to stand on. So that's where we start: an empty stage. Every piece is a real shipped component. We add a debug overlay too, so you can see the world the moment it loads.

The pieces: entities, components, systems

The next nine lessons all build on one idea. Let's cover it first. It only takes thirty seconds. In this framework, a game is data. An entity is a named thing in the scene, like the floor, the camera, or the ship. Components are plain data attached to an entity, like a position, a color, or a pool of hit points. A System is code that reads one kind of component and acts on it every frame. The World holds them all. It updates every System about sixty times a second. That repeating update is called the render loop. A component never draws anything on its own. Its System calls the 3D engine (Babylon, here) and gets back an opaque handle. A handle is a renderer-side reference to the real mesh (the 3D shape you can see), light, or camera. You write entities and components as JSON, and the shipped Systems do the work.

Continue reading

Unlock the Full Course

Every lesson, the runnable examples, and the finished build — yours to keep.

$9one-time

Was this page helpful?

We read every note — tell us what's working and what isn't.

↑↓ NavigateEnter SelectEsc CloseCtrl+K Open Search