Why You Should Make a Game Engine: 5 Years as a Developer
Tags: javascript, webgl, frontend, webdev
Published: 2023-08-15 18:05:29

They say time flies when you are having fun. I can definitely vouch for that, especially since I made the switch from being an architect to becoming a software developer five years ago.

With my background in art and design, I found a whole new world of enjoyment by messing around with the HTML canvas and exploring the visual side of coding. So, it was pretty natural for me to get curious about making games. At first, it was just a little experiment driven by curiosity, but over time, it grew into something more. It turned into my personal playground where I would keep coming back to add new cool stuff that I learned throughout the year.

The journey had its highs and lows, with moments of victory and some major letdowns. But there was always one thing that kept me going: the game itself.

Here's my story.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vtmu90aah57o08rm9nxk.gif)

&nbsp;
## Year #0 - Improvise, Adapt, and Overcome

It all started like most stories do – a feeling that my current path, even though successful, was missing something important: joy. It was draining me both physically and emotionally. I knew something had to change.

By then, I had a bit of experience with coding. I had made my own portfolio website (a standard thing for architects), worked on simple websites for other businesses, and dabbled with coding in general. But never did I think of coding as a career option. How could I? I had invested so much time into architecture already.

Around that time, coding schools were popping up all over, promising amazing opportunities. I talked to some folks from a coding school just next door to where I lived. They had these full day 3-month courses that guaranteed job placement with a sort of "trust me, bro" assurance. I was skeptical but a course, which was like a full-time job seemed like a good way to stay focused. So, I set a simple plan: one year, go all in, no ragrets.

The courses covered the usual suspects - HTML, CSS, JavaScript, PHP, Laravel - basically, the whole shebang to make you a junior full-stack developer, even though that title makes little sense. But out of it all, one thing stood out - JavaScript tutor.

> "I won't just teach you JavaScript. I'll teach you how to think like programmers."

Those were the first words from him. It sounded cheesy then, but looking back, I can see how lucky I was. His constant questions - how does this work? Why do you need this? Was a daily ritual. This approach of digging deeper really resonated with me and helped me realize, that I need to focus. A "junior full-stack developer" made even less sense, than before. A "junior JavaScript developer" sounds much more reasonable.

Inspired to do more, I wanted something to work on at home. I mean, there are only so many to-do lists you can make, right? That is when I stumbled upon the HTML canvas. It was amazing to see code come to life visually, especially in a form close to my heart - games. Writing something as simple as Pong felt amazing and I was hooked. I tried making Tetris and that worked!

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0q311vcam3d1qpkxio2q.gif)

So, what is the natural next step after you have tried to create your own version of Pong or Tetris? For me, it was an obvious choice - make a Mario clone! This was a completely different challenge - creating tiles, making a player object interact with them, jump and everything else what looks as simple as it can. Did it pay off? Yes, it did! Spoiler - it even helped me land my first job, after many rejections, of course.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lt71u7ocxq864i36kjdo.gif)

As the coding school course neared its end and the job hunt loomed, I did not want all my efforts to go to waste. So, I transformed that simple Mario project into my personal website, showcasing my journey. Maybe just to show off, or maybe so I could continue working on it in the future.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/95yyc5i4rhq4mv1oyjrp.gif)

&nbsp;
## Year #1 - Small Steps, Big Changes

After the initial excitement of "I'm actually a developer now" settled down, I knew I had to keep the ball rolling. What next? I had already done Pong, Tetris, a Mario clone... Well of course it is Wolfenstein 3D. What else could it be?

Since I already had a system based on tiles for my platformer, the only thing left was to change how it was rendered - essentially, create a ray-casting engine. There were tons of tutorials and videos about this, including some from John Carmack himself. All I needed to do - translate that into JavaScript.

Surprisingly, it was not as tough as I thought. In fact, it was quite motivating. Sure, it was not perfect, but I saw it as a fun experiment. Little did I know that tinkering with 3D graphics would become a major driver in improving my skills as a developer.

Here is my [ScriptenStein](https://katkus.eu/demo/wjs). It only has keyboard (arrow buttons) controls, so do not expect much.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oeww7l1msdv6t16028lq.gif)

&nbsp;
## Year #2 - Are You Really a Developer If You Don't Have an NPM Package?

Feeling comfortable in my developer shoes and having ventured beyond just front-end work, I realized it was time to optimize my game - make updates and deployment easier, expand it further.

Main focus this year, was to extract some logic into a separate package, as I have already started having some ideas about using it else were. Spoiler - a mobile app. This is how [LaikaJS](https://www.npmjs.com/package/laikajs) was born.

Isolating game logic from design elements turned out to be a game-changer. It allowed me to concentrate on each aspect more effectively. With new features in place (multi-layered backgrounds, music, so NPCs), I felt motivated to revisit and revamp the visual side. After all, why should code be the only thing that looks good?

You can see the latest version [here](https://katkus.eu/)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/exh9lddj7qmn2m41djbw.gif)

&nbsp;
## Year #3 - It's All Fun and Games Until It's an App

By my fourth year, I had worked on several projects and gained enough experience to dive into React Native. With the core JavaScript foundation of my game already in place, I decided to turn it into an app. How hard could that be? Oh boy, how wrong I was...

First and probably the main this was, that there is no native canvas! Technically you can get some implementations of it, but the performance is far from acceptable. So what can you do? WebGL to the rescue. But there is a catch - it has steepest learning curve that I have faced up to that moment. I had to learn the WebGL API, understand GPUs, and implement general logic. It's important to note that I wanted to learn WebGL itself, so using libraries wasn't the route I wanted to take.

After quite some time I have managed to get grips of WebGL basics and implemented all the game logic, that I have had on the web!

Was it easy? No. Was it worth it? Ohh yes! You can get it from [PlayStore](https://play.google.com/store/apps/details?id=eu.katkus.MySuperJavaScriptAdventure&pli=1) and give it a go yourself.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qjtum1buqv2h3fg5lsfa.gif)

&nbsp;
## Year #4 - Psst… I Heard You Like WebGL

In my fifth year, I started my journey to understand WebGL better, as it felt like the natural step to turn my 2D world into a 3D one.

To do this, I needed to get really comfortable with WebGL and computer graphics in general, not just poke around in the dark. The thing that helped me the most, where amazing tutorials from [Andrew Adamson
](https://www.youtube.com/@osakaandrew)

That is not all. Another thing that also really stuck to me from this year was, that I finally needed to and was able to read dedicated math and computer graphics books. It is not much, but felt like a great milestone to me.

Sometimes it felt like a detour from my day-to-day work, but growing up playing video games, working with 3D software in university, and being an architect with an interest in software got me hooked. Understanding computer graphics better made me appreciate of graphics engineers even more.

But anyway, even though it is a work in progress, I'm thrilled that I can replicate this progress myself. From Pong to Tetris, to 2D platformer, to a simple 3D rendering, and now a full 3D world.

Take a look [here](https://katkus.eu/3d)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9emw26bqigcbfxmcoa62.gif)

&nbsp;
## Year #n+1

Switching careers was a tough call, but I'm so glad I took the leap. It's been an amazing journey so far and the architect inside me is really happy, as software development has much more in common with architecture, than most people expect. 

I'm excited to see where the next 5 years take me. Maybe I will have to learn something else, when AI will make all developers obsolete ¯\\\_(ツ)_/¯

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/66zvj24vc3e39ofxeblg.gif)

<sub>TLDR; I like to code.</sub>