Babylon Template allows you to build Babylon.js games. See demo:
Motivation
This template gives you a ready-to-use foundation for browser-based 3D games. It handles the rendering setup, build tooling, and deployment plumbing so you can focus on building the game.
Tech Stack
- Babylon.js for 3D rendering
- Vite for fast development and production builds
- TypeScript for type-safe game code
- Tailwind CSS for styling
- GitHub Actions to build, test, and deploy to GitHub Pages
Architecture
The template uses a lightweight ECS-style setup with core, systems, and scenes folders. The entry point wires up the engine, scene, and systems:
import { createEngine, createScene } from './core';
import { InputSystem, RenderSystem } from './systems';
const canvas = document.querySelector<HTMLCanvasElement>('canvas');
if (!canvas) {
throw new Error('Game canvas not found');
}
const engine = createEngine(canvas);
const scene = createScene(engine);
new InputSystem(scene);
new RenderSystem(scene);
Babylon.js modules are imported selectively to keep bundle sizes small.
Quick Start
Clone the repository:
git clone https://github.com/remarkablegames/babylon-template.git mygame
cd mygame
Install the dependencies:
npm install
Run the game in development mode:
npm start
Build the game for production:
npm run build
Demo
See Endless Runner, a game built with this template. Dodge obstacles and keep moving forward using the arrow keys or WASD.