Create Project

In this tutorial, you will learn how to use the engine by organizing your own game.

We will use the features within the engine as much as possible to construct the scene of the 2d topdown game with minimal code.

Overview

The game we're going to make looks like this. it used tile maps, collision maps, event maps, animated sprites, player grid movements, pathfinder, and we'll soon find out how to use all of these elements.

Create Project

First, follow the Installation Guide in Getting Started/Installation to create a project.

And make a bootstrapper skeleton.

src/index.ts

import { Game } from "the-world-engine";

import { Bootstrapper } from "./asset/Bootstrapper";

const game = new Game(document.body);
game.run(Bootstrapper);
game.inputHandler.startHandleEvents();

src/asset/Bootstrapper.ts

import {
    Bootstrapper as BaseBootstrapper,
    Camera,
    SceneBuilder
} from "the-world-engine";

export class Bootstrapper extends BaseBootstrapper {
    public override run(): SceneBuilder {
        const instantiater = this.instantiater;

        return this.sceneBuilder
            .withChild(instantiater.buildGameObject("camera")
                .withComponent(Camera))
        ;
    }
}

Now you're ready to make a scene. Most of our journeys will take place at Bootstrapper.ts.

Then let's get started!