Game Dev Journey #1

My Journey of Fabricating Game using C++, Raylib, and Flecs

Photo by Lorenzo Herrera on Unsplash

Hello! I have a whole new world in my story here. In all of the previous stories, I gave it as a tutorial that you can follow and reproduce. However, here, I’ll try to do something different. Instead of writing a tutorial, I want to create some sort of a documentation of my learning. And my learning this time will be Game Development. Bear with me that I’m completely new in this field, and because of that, critiques are open, but please, no judge.

So here’s what I want to say in this first part. I will tell you all the tech stack I use to create a simple “Ping-pong” game. Then, I moved on to explain how to set up all of the dependencies. Finally, test if it works. Without further do, let’s get into it.

[1] Tech Stack ⚙️

The techs that I use for this project are:

• C++: as the programming language
• CMake: for the build generator
• Conan: as the package manager and helping us resolve all of our depedencies
• Raylib: Easiest “game engine”
• Flecs: ECS pattern. Not necessereliy need to use ECS, but I’m here to learn.

Using CMake is torture, but it is the “universal” and most famous build system for the C/C++. So no other options suit this. Conan helps us manage all of our dependencies. Even though it is only two (for now). We can download all of our deps manually, but using Conan really help us a lot. To help us draw images to the screen, we use our favorite library, Raylib (not lie, this one is perfect IMO). To “ increase” the knowledge we gain, we can learn ECS patterns in our code using Flecs. Even though we know ECS using help from the library, it’s still a good start. For the operating system, I use Windows.

[2] Installing Conan 📦

Conan installation guide can be found HERE. I use Conan version 2, precisely 2.0.14, for this project and installing it using pip.

pip install conan

Make sure to reopen your terminal before use the Conan. Then check if it’s successfully installed.

conan --help

Create conanfile.py and add this code.

from conan import ConanFile
from conan.tools.cmake import CMakeToolchain, CMakeDeps, CMake, cmake_layout

class MyGame(ConanFile):
    name = "mygame"
    settings = "os", "compiler", "build_type", "arch"
    generators = "CMakeToolchain", "CMakeDeps"
    description = "My Game"

    def requirements(self):
        self.requires("raylib/4.0.0")
        self.requires("flecs/3.2.8")

    def build_requirements(self):
        self.tool_requires("cmake/3.26.4")

Create folder named build and go into it. Then run the CMake command. If the config Release doesn’t work, you Debug instead.

cmake .. -DCMAKE_TOOLCHAIN_FILE=conan_toolchain.cmake && cmake --build . --config Release

Make sure you already setup a Conan profile first. Basically, just follow the Conan tutorial documentation first. The executable of this project will be located inside build/Release/mygame.exe

[3] Preparing CMake 🍀

On Windows, you can install CMake from the CMake download page, or you can use the CMake that comes with the MinGW. The CMake configuration runs automatically and its done by CLion (IDE that I use).

Make sure to add this code in order to grab the dependencies. The rest of the CMake configurations is up to you.

#######################
# Raylib
#######################
find_package(raylib REQUIRED)
target_link_libraries(${PROJECT_NAME} PUBLIC raylib)
target_include_directories(${PROJECT_NAME} PUBLIC ${raylib_INCLUDE_DIRS})

#######################
# Flecs
#######################
find_package(flecs REQUIRED)
target_link_libraries(${PROJECT_NAME} PUBLIC flecs::flecs_static)
target_include_directories(${PROJECT_NAME} PUBLIC ${flecs_INCLUDE_DIRS})

BTW, if you use MSVC as the compiler, don’t forget to add this line on the CMake. You can add it before or after the flecs library linking.

#######################
# MSVC
#######################
if(MSVC)
 target_link_libraries(${PROJECT_NAME} PUBLIC wsock32 ws2_32)
endif()

[4] Getting Started with Raylib 🖼️

Open up the main.cpp and include the Raylib header.

#include <raylib.h>

Continue with creating an empty black window.

int main() {
    TraceLog(LOG_INFO, "Starting game...");

    // Initialize window
    auto WIDTH = 1280;
    auto HEIGHT = 800;
    InitWindow(WIDTH, HEIGHT, "My Game");

    SetTargetFPS(60);

    while (!WindowShouldClose()) {
        BeginDrawing();
        ClearBackground(BLACK);
        EndDrawing();
    }

    CloseWindow();
    TraceLog(LOG_INFO, "Stopping game...");

  return 0;
}

[5] Trying Out Flecs 🖥️

Import the Flecs.

#include <flecs.h>

Initialize the world.

flecs::world world{};

Create a ball entity.

struct Position {
public:
    float x{};
    float y{};
};

struct SizeCircle {
public:
    float radius{};
};

// Put the code before the InitWindow()
auto ball = world.entity("ball");
ball.set<Position>({WIDTH/2, HEIGHT/2});
ball.set<SizeCircle>({30});

Print the ball entity using Raylib.

// Put the code inside the BeginDrawing() and EndDrawing()
const auto* position_ball = ball.get<Position>();
const auto* radius_ball = ball.get<SizeCircle>();

DrawCircle(position_ball->x, position_ball->y, radius_ball->radius, PINK);

Run it and see the magic pink ball.

./build/Release/mygame.exe

Sorry I set mine to WHITE :)

That’s all for part one, thank you, and let’s dive in into part two. ➡️