Forem: Mykhailo Toporkov 🇺🇦

How I chose my new work laptop

Mykhailo Toporkov 🇺🇦 — Fri, 06 Mar 2026 18:42:22 +0000

I am, frankly speaking, not a fan of Apple and its ecosystem of products... but I still bought a MacBook Pro.

To begin with, my old ASUS ROG Strix GL553VD was aging (9 years), slow, and I frequently ran into reboots when running unit tests because 16 GB of RAM wasn't enough—though I suppose that was partially an issue of RAM speed. And yeah, increasing the swap size to 20 GB was not the fix.

Obviously, I was annoyed and decided it was time for an upgrade. My first choice was not to engage with Windows. At the beginning of my career, I had experience working on Windows, but mostly via WSL because I liked to play games; however, that is kind of irrelevant now. Really, Windows is only good for games, Office staff, and maybe—really maybe—for developing something in the Windows ecosystem.

Because of this, I was sure that anything I bought would have Linux or UNIX. The question of price didn't worry me much because I wasn't going to buy a laptop for just a year or two. This is where performance, the amount of RAM, and SSD size come into the scene.

Apple sucks when it comes to prices per RAM or disk size. Originally, I was going to wait for the HP EliteBook X G2 with 64 GB of RAM and a 1 TB SSD, but I just could not bear to work with the constant reboots anymore, so I bought a MacBook Pro on M5 with 32 GB of RAM and a 1 TB SSD. It was also partially because the M5 has better single-core performance...

I’ve been working from the Mac for almost a week now, and it is fast, no doubt. I still cannot get used to all the hotkey combinations, though time will fix it. But when I switched from Windows to Ubuntu, the only difference I noticed was that changing the language was different. Right now, my biggest disappointment is that this shitbox does not have any USB-A ports, and I needed to buy an external hub just to connect a USB flash stick or my mouse. So, fuck you Apple for this.

Anyway, if you were click-baited and expected me to compare or advertise one OS over another, you wasted your time. If you like something, you like something. The only important thing is accepting that most of the world's software runs on Linux, most code is probably written on Mac (though I'm not exactly sure about this—I’d probably need to Google it to be certain), and most office stuff is done on Windows. So, choose depending on what you need)))

The Year’s Almost Over — What Tech Stuff Did You Read?

Mykhailo Toporkov 🇺🇦 — Sun, 07 Dec 2025 08:31:03 +0000

This year I went full Breaking Bad mode on tech books — and read almost nothing else. You can have different opinions about how useful these books are, and it really varies from one to another. Some of them are genuinely important and can reshape the way you think about architecture or how you approach building applications.

Here’s the list of books I covered this year:

Clean Architecture – Robert C. Martin
Database Internals – Alex Petrov
The Linux Command Line (2nd Edition) – William E. Shotts Jr.
Clean Code – Robert C. Martin
Building Microservices (2nd Edition) – Sam Newman
Designing Data-Intensive Applications – Martin Kleppmann
The Intelligent Investor – Benjamin Graham

So what about you—what did you read this year, and was it useful?
For me personally, Building Microservices was the most valuable one, partly because I’m currently in the process of splitting a monolith into microservices on my project 😄

NestJS Microservices Monorepo - Setup, Testing and Containerization

Mykhailo Toporkov 🇺🇦 — Sat, 25 Oct 2025 09:21:58 +0000

Yo! Today I’m going to demonstrate how to set up a NestJS monorepo with two REST microservices — Users and Posts — each using its own database through Prisma ORM.

For inter-service communication, we’ll use Kafka, taking advantage of the features provided by @nestjs/microservices.

I’ve also included an example of a GitHub Action workflow for testing the monorepo — it runs tests only for the services that were changed in your commits.

If you’re interested in a specific topic, feel free to use the navigation below:

Monorepo Setup
Unit and E2E testing
Containerization
CI/CD Testing
Conclusion

Monorepo Setup

First things first — to create a monorepo, we need a regular Nest project. I’ll create it like this:

nest new users

Now we can convert it into a monorepo by generating a new app inside it, like this:

cd users && nest generate app posts

Also I will add some shared libs like common and kafka:

nest generate library common && nest generate library kafka

All these commands and other documentation about NestJS monorepos, libraries, and CLI commands can be found in the official NestJS documentation. What’s important for us is to get a structure like the one shown below:

📂 apps
 | --- 📂 users
 |
 | --- 📂 posts
 |
📂 libs
 | --- 📂 common
 |
 | --- 📂 kafka
 |
etc.

I’ll skip the database setup and other boring details, but what’s really important to mention is that I prefer each microservice to have its own .env file at the root of the service. The same goes for the Dockerfile and docker-compose.yml. Since I’m using Prisma as my ORM of choice, the generated files will also be located in the root of each microservice folder.

To summarize, the structure will look like this:

📂 apps
 | --- 📂 users
 |      | --- 📂 generated/prisma (excluded by gitignore by default)
 |      | --- 📂 prisma
 |      | --- 📂 test
 |      | --- 📂 src
 |      | --- .env
 |      | --- Dockerfile
 |      | --- docker-compose.yml
 |
etc.

Now, regarding communication between microservices, I’ll be using Kafka. Here’s my setup in libs/kafka:

import { ConfigService } from '@nestjs/config';
import { MicroserviceOptions, Transport } from '@nestjs/microservices';

export const createKafkaMicroserviceOptions = (configService: ConfigService): MicroserviceOptions => ({
  transport: Transport.KAFKA,
  options: {
    client: {
      clientId: configService.get('APP_NAME') ?? 'default-client',
      brokers: [configService.get('KAFKA_URL') ?? 'localhost:9092'],
    },
    consumer: {
      groupId: `${configService.get('APP_NAME') ?? 'default'}-consumer`,
    },
  },
});

import { ClientKafka } from '@nestjs/microservices';
import { UsersEvents, PostsEvents } from '@libs/kafka/messages';
import { Injectable, OnModuleInit, Inject } from '@nestjs/common';

type KafkaEvents = UsersEvents & PostsEvents;

@Injectable()
export class KafkaService implements OnModuleInit {
  constructor(@Inject('KAFKA_CLIENT') private readonly kafkaClient: ClientKafka) {}

  async onModuleInit() {
    await this.kafkaClient.connect();
  }

  emit<Topic extends keyof KafkaEvents>(topic: Topic, message: KafkaEvents[Topic]) {
    return this.kafkaClient.emit(topic, message);
  }

  send<Topic extends keyof KafkaEvents>(topic: Topic, message: KafkaEvents[Topic]) {
    return this.kafkaClient.send<Topic, KafkaEvents[Topic]>(topic, message);
  }
}

import { Global, Module } from '@nestjs/common';
import { KafkaService } from '@libs/kafka/kafka.service';
import { ConfigModule, ConfigService } from '@nestjs/config';
import { ClientsModule, Transport } from '@nestjs/microservices';

@Global()
@Module({
  imports: [
    ConfigModule,
    ClientsModule.registerAsync([
      {
        name: 'KAFKA_CLIENT',
        imports: [ConfigModule],
        inject: [ConfigService],
        useFactory: (configService: ConfigService) => {
          const appName = configService.get<string>('APP_NAME');
          const kafkaUrl = configService.get<string>('KAFKA_URL');

          return {
            transport: Transport.KAFKA,
            options: {
              client: {
                clientId: appName ?? 'default-client',
                brokers: kafkaUrl ? [kafkaUrl] : ['localhost:9092'],
              },
              consumer: {
                groupId: `${appName ?? 'default'}-consumer`,
              },
            },
          };
        },
      },
    ]),
  ],
  providers: [KafkaService],
  exports: [KafkaService],
})
export class KafkaModule {}

The usage of all this is pretty straightforward: the KafkaModule should be imported into the AppModule of your microservice to enable using the KafkaService inside other services.

The createKafkaMicroserviceOptions, on the other hand, is needed to utilize @nestjs/microservices, which provides many decorators for working comfortably with event-based communication, such as the @MessagePattern decorator:

import { ConfigService } from '@nestjs/config';
import { AppModule } from '@users-micros/app.module';
import { NestFactory, Reflector } from '@nestjs/core';
import { SwaggerModule, DocumentBuilder } from '@nestjs/swagger';
import { createKafkaMicroserviceOptions } from '@libs/kafka/kafka.config';
import { ClassSerializerInterceptor, ValidationPipe } from '@nestjs/common';
import { DatabaseExceptionFilter } from '@users-micros/database/databse.filter';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);

  const configService = app.get(ConfigService);

  const kafkaMicroserviceOptions = createKafkaMicroserviceOptions(configService);

  app.connectMicroservice(kafkaMicroserviceOptions);

  app.useGlobalPipes(new ValidationPipe({ whitelist: true, transform: true }));

  app.useGlobalInterceptors(new ClassSerializerInterceptor(app.get(Reflector)));

  app.useGlobalFilters(new DatabaseExceptionFilter());

  const config = new DocumentBuilder()
    .setTitle('Users microservice')
    .setVersion('0.0.1')
    .setDescription('The users microservice API description')
    .build();

  SwaggerModule.setup('docs', app, () => SwaggerModule.createDocument(app, config));

  await app.startAllMicroservices();

  const port = configService.get<number>('APP_PORT') ?? 3021;

  await app.listen(port);
}
bootstrap();

Oh, looking back, I really skipped a lot of stuff… That might raise questions like “How did you set up this or that?” But as I mentioned before, this isn’t a guide on building a microservice app from scratch — it’s about setting up the monorepo. If you’re patient enough to read until the end, you’ll find a link to the repository that was used to create this post))

Unit and E2E testing

The unit tests are also pretty straightforward, and even easier if you don’t set up aliases for your microservice folders. Here’s an example of unit tests for the UsersService:

import * as utils from '@libs/common/utils';
import { KafkaMock } from '@libs/kafka/kafka.mock';
import { NotFoundException } from '@nestjs/common';
import { User } from '@users-micros/generated/prisma';
import { UsersService } from '@users-micros/users/users.service';
import { UsersTopics } from '@libs/kafka/messages/users.messages';
import { DatabaseService } from '@users-micros/database/database.service';

export const mockUsers: User[] = [
  {
    id: '1',
    name: 'John Doe',
    createdAt: new Date(),
    updatedAt: new Date(),
  },
  {
    id: '2',
    name: 'Jane Smith',
    createdAt: new Date(),
    updatedAt: new Date(),
  },
];

export const mockUser = mockUsers[0];

describe('UsersService', () => {
  let usersService: UsersService;
  let databaseService: jest.Mocked<DatabaseService>;
  let kafkaService: typeof KafkaMock;

  beforeEach(() => {
    databaseService = {
      user: {
        create: jest.fn().mockResolvedValue(mockUser),
        findFirst: jest.fn((args) =>
          args.where.id === mockUser.id ? Promise.resolve(mockUser) : Promise.resolve(null),
        ),
        findMany: jest.fn().mockResolvedValue(mockUsers),
        count: jest.fn().mockResolvedValue(mockUsers.length),
        update: jest.fn((args) =>
          args.where.id === mockUser.id ? Promise.resolve({ ...mockUser, ...args.data }) : Promise.resolve(null),
        ),
      },
    } as any;

    kafkaService = { ...KafkaMock };

    usersService = new UsersService(kafkaService as any, databaseService);

    jest.spyOn(utils, 'createSearchQuery');
    jest.spyOn(utils, 'createSortQuery');
  });

  describe('createUser', () => {
    it('should create a user', async () => {
      const data = { name: 'John Doe', email: 'john@example.com' };
      const result = await usersService.createUser(data as any);
      expect(databaseService.user.create).toHaveBeenCalledWith({ data });
      expect(result).toBe(mockUser);
    });
  });

  describe('findUsers', () => {
    it('should return users with filters', async () => {
      const query = { skip: 0, take: 10, search: 'John', sortBy: 'name', sortOrder: 'asc' } as any;
      const result = await usersService.findUsers(query);
      expect(utils.createSearchQuery).toHaveBeenCalledWith(query.search, expect.anything());
      expect(utils.createSortQuery).toHaveBeenCalledWith(query.sortBy, query.sortOrder);
      expect(databaseService.user.findMany).toHaveBeenCalled();
      expect(result).toEqual(mockUsers);
    });
  });

  describe('findUsersCount', () => {
    it('should return count of users', async () => {
      const query = { search: 'John' } as any;
      const result = await usersService.findUsersCount(query);
      expect(utils.createSearchQuery).toHaveBeenCalledWith(query.search, expect.anything());
      expect(databaseService.user.count).toHaveBeenCalled();
      expect(result).toBe(mockUsers.length);
    });
  });

  describe('findUser', () => {
    it('should return user if found', async () => {
      const result = await usersService.findUser(mockUser.id);
      expect(databaseService.user.findFirst).toHaveBeenCalledWith({ where: { id: mockUser.id } });
      expect(result).toBe(mockUser);
    });

    it('should throw NotFoundException if not found', async () => {
      await expect(usersService.findUser('no-id')).rejects.toThrow(NotFoundException);
    });
  });

  describe('updateUser', () => {
    it('should update user and emit kafka event', async () => {
      const data = { name: 'Updated Name' };
      const result = await usersService.updateUser(mockUser.id, data);
      expect(databaseService.user.update).toHaveBeenCalledWith({ where: { id: mockUser.id }, data });
      expect(kafkaService.emit).toHaveBeenCalledWith(UsersTopics.USER_UPDATED, { name: 'Updated Name' });
      expect(result.name).toBe('Updated Name');
    });

    it('should throw NotFoundException if user does not exist', async () => {
      await expect(usersService.updateUser('no-id', { name: 'test' })).rejects.toThrow(NotFoundException);
    });
  });
});

E2E tests require a database connection because they simulate the real behavior of your microservice. It might be a good idea to first check the Containerization section of this post:

import * as request from 'supertest';
import { INestApplication, ValidationPipe } from '@nestjs/common';
import { Test, TestingModule } from '@nestjs/testing';
import { FixtureModule } from '@users-micros/test/fixture.module';
import { DatabaseService } from '@users-micros/database/database.service';

describe('UsersController (e2e)', () => {
  let app: INestApplication;
  let databaseService: DatabaseService;

  beforeAll(async () => {
    const moduleFixture: TestingModule = await Test.createTestingModule({
      imports: [FixtureModule],
    }).compile();

    app = moduleFixture.createNestApplication();
    app.useGlobalPipes(new ValidationPipe({ transform: true }));
    await app.init();

    databaseService = moduleFixture.get(DatabaseService);
  });

  beforeEach(async () => {
    await databaseService.user.deleteMany();
  });

  afterAll(async () => {
    await databaseService.user.deleteMany();
    await app.close();
  });

  describe('POST /users', () => {
    it('should create a user successfully', async () => {
      const userData = { name: 'John Doe' };

      const response = await request(app.getHttpServer()).post('/users').send(userData).expect(200);

      expect(response.body).toMatchObject({
        id: expect.any(String),
        name: userData.name,
        createdAt: expect.any(String),
        updatedAt: expect.any(String),
      });

      const user = await databaseService.user.findUnique({
        where: { id: response.body.id },
      });
      expect(user).toBeTruthy();
      expect(user?.name).toBe(userData.name);
    });

    it('should return 400 when name is missing', async () => {
      await request(app.getHttpServer()).post('/users').send({}).expect(400);
    });

    it('should return 400 when name is empty', async () => {
      await request(app.getHttpServer()).post('/users').send({ name: '' }).expect(400);
    });

    it('should return 400 when name is too long', async () => {
      await request(app.getHttpServer())
        .post('/users')
        .send({ name: 'a'.repeat(65) })
        .expect(400);
    });
  });

  describe('GET /users', () => {
    beforeEach(async () => {
      // Create test users
      await databaseService.user.createMany({
        data: [
          { name: 'Alice Smith' },
          { name: 'Bob Johnson' },
          { name: 'Carol Davis' },
          { name: 'David Wilson' },
          { name: 'Eve Brown' },
        ],
      });
    });

    it('should return paginated users', async () => {
      const response = await request(app.getHttpServer()).get('/users').query({ skip: 0, take: 10 }).expect(200);

      expect(response.body).toMatchObject({
        skip: 0,
        take: 10,
        total: 5,
        data: expect.arrayContaining([
          expect.objectContaining({
            id: expect.any(String),
            name: expect.any(String),
            createdAt: expect.any(String),
            updatedAt: expect.any(String),
          }),
        ]),
      });
      expect(response.body.data).toHaveLength(5);
    });

    it('should search users by name', async () => {
      const response = await request(app.getHttpServer()).get('/users').query({ search: 'alice' }).expect(200);

      expect(response.body.data).toHaveLength(1);
      expect(response.body.data[0].name).toBe('Alice Smith');
    });

    it('should sort users by name', async () => {
      const response = await request(app.getHttpServer())
        .get('/users')
        .query({ sortBy: 'name', sortOrder: 'asc' })
        .expect(200);

      const names = response.body.data.map((user) => user.name);
      expect(names).toEqual([...names].sort());
    });

    it('should return 400 for invalid sort field', async () => {
      await request(app.getHttpServer()).get('/users').query({ sortBy: 'invalid' }).expect(400);
    });
  });

  describe('GET /users/:userId', () => {
    let testUser;

    beforeEach(async () => {
      testUser = await databaseService.user.create({
        data: { name: 'Test User' },
      });
    });

    it('should return a user by id', async () => {
      const response = await request(app.getHttpServer()).get(`/users/${testUser.id}`).expect(200);

      expect(response.body).toMatchObject({
        id: testUser.id,
        name: testUser.name,
        createdAt: expect.any(String),
        updatedAt: expect.any(String),
      });
    });

    it('should return 404 for non-existing user', async () => {
      await request(app.getHttpServer()).get('/users/non-existing-id').expect(404);
    });
  });

  describe('PATCH /users/:userId', () => {
    let testUser;

    beforeEach(async () => {
      testUser = await databaseService.user.create({
        data: { name: 'Test User' },
      });
    });

    it('should update a user successfully', async () => {
      const updateData = { name: 'Updated Name' };

      const response = await request(app.getHttpServer()).patch(`/users/${testUser.id}`).send(updateData).expect(200);

      expect(response.body).toMatchObject({
        id: testUser.id,
        name: updateData.name,
        createdAt: expect.any(String),
        updatedAt: expect.any(String),
      });

      const updatedUser = await databaseService.user.findUnique({
        where: { id: testUser.id },
      });
      expect(updatedUser).toBeTruthy();
      expect(updatedUser?.name).toBe(updateData.name);
    });

    it('should return 404 for non-existing user', async () => {
      await request(app.getHttpServer()).patch('/users/non-existing-id').send({ name: 'New Name' }).expect(404);
    });

    it('should return 400 when update data is invalid', async () => {
      await request(app.getHttpServer()).patch(`/users/${testUser.id}`).send({ name: '' }).expect(400);

      await request(app.getHttpServer())
        .patch(`/users/${testUser.id}`)
        .send({ name: 'a'.repeat(65) })
        .expect(400);
    });
  });
});

Containerization

For now, let’s just add a docker-compose.yml and a Dockerfile for each microservice. As a result, the project structure should look something like this:

📂 apps
 | --- 📂 users
 |      | --- 📂 src
 |      | --- .env
 |      | --- Dockerfile
 |      | --- docker-compose.yml
 |
 | --- 📂 posts
 |      | --- 📂 src
 |      | --- .env
 |      | --- Dockerfile
 |      | --- docker-compose.yml
 |
📂 libs
 | --- 📂 kafka
 |      | --- 📂 src
 |      | --- .env
 |      | --- docker-compose.yml

Here’s an example of my docker-compose.yml. When developing locally, I’ll be honest — I usually comment out the app service because I don’t really need it:

services:
  app:
    container_name: ${APP_NAME}-app
    build:
      context: ../..
      dockerfile: apps/${APP_NAME}/Dockerfile
      args:
        APP_NAME: ${APP_NAME}
    restart: on-failure
    env_file:
      - ./.env
    ports:
      - '${APP_PORT}:${APP_PORT}'
    depends_on:
      - database

  database:
    container_name: ${APP_NAME}-database
    image: postgres:latest
    restart: always
    env_file:
      - ./.env
    environment:
      POSTGRES_DB: '${DATABASE_NAME}'
      POSTGRES_USER: '${DATABASE_USER}'
      POSTGRES_PASSWORD: '${DATABASE_PASSWORD}'
    ports:
      - '${DATABASE_PORT}:5432'
    volumes:
      - database:/var/lib/postgresql/data

volumes:
  database:
    driver: local

Here are also examples of the Dockerfile and .env. Honestly, I’m not sure what else should be added here:

FROM node:22-alpine AS base 

# build stage
FROM base AS build 
ARG APP_NAME 
ARG NODE_ENV=development 
ENV NODE_ENV=${NODE_ENV}
WORKDIR /usr/src/app 
COPY package*.json ./
RUN npm ci
COPY . .
RUN npx prisma generate --schema apps/${APP_NAME}/prisma/schema.prisma \
    && npm run build ${APP_NAME}

# production stage
FROM base AS production 
ARG APP_NAME 
ARG NODE_ENV=production 
ENV NODE_ENV=${NODE_ENV} HUSKY=0
WORKDIR /usr/src/app 
COPY package*.json ./
RUN npm ci --only=production
COPY --from=build /usr/src/app/dist ./dist
COPY --from=build /usr/src/app/node_modules/.prisma ./node_modules/.prisma
COPY --from=build /usr/src/app/apps/${APP_NAME}/prisma ./apps/${APP_NAME}/prisma
COPY --from=build /usr/src/app/apps/${APP_NAME}/generated ./apps/${APP_NAME}/generated

ENV APP_MAIN_FILE=dist/apps/${APP_NAME}/main
ENV DATABASE_SCHEMA=apps/${APP_NAME}/prisma/schema.prisma
CMD ["sh", "-c", "npx prisma migrate deploy --schema ${DATABASE_SCHEMA} && node ${APP_MAIN_FILE}"]

# APP
APP_NAME=users
APP_PORT=3021

# Database
DATABASE_PORT=3022
DATABASE_NAME="postgresql"
DATABASE_USER="johndoe"
DATABASE_PASSWORD="randompassword"
DATABASE_URL="postgresql://johndoe:randompassword@database:5432/postgresql"

# Kafka
KAFKA_URL=localhost:3011

Setting up Kafka is up to you, of course. 😉 If you’d rather have it all ready for local development, check out the repo link at the end of the post.

Also I need to mention, if you want to set up all apps locally without dokcer, you need to be careful with environment variables like DATABASE_URL and KAFKA_URL, as they need to be updated to match your local setup.

CI/CD Testing

For testing in CI/CD, I’ll be using GitHub Actions. If you’re not familiar with them, please read the documentation.

To efficiently run tests inside a monorepo, we need to detect changes across apps and libraries. Therefore, any action that involves testing should start with this:

name: E2E Testing

on:
  push:
    branches: [master]
  pull_request:
    branches: [master]

jobs:
  detect-changes:
    runs-on: ubuntu-latest
    outputs:
      users: ${{ steps.filter.outputs.users }}
      posts: ${{ steps.filter.outputs.posts }}
      common: ${{ steps.filter.outputs.common }}
    steps:
      - uses: actions/checkout@v4

      - name: Detect changes
        id: filter
        uses: dorny/paths-filter@v3
        with:
          filters: |
            users:
              - 'apps/users/**'
              - 'libs/common/**'
            posts:
              - 'apps/posts/**'
              - 'libs/common/**'
            common:
              - 'libs/common/**'

Here are a few grammatically correct and natural rewrites of your sentence — depending on tone:

test-users:
    needs: detect-changes
    if: ${{ needs.detect-changes.outputs.users == 'true' }}
    runs-on: ubuntu-latest
    services:
      postgres:
        image: postgres:latest
        env:
          POSTGRES_USER: johndoe
          POSTGRES_PASSWORD: randompassword
          POSTGRES_DB: postgresql-test
        ports:
          - 3022:5432
        options: >-
          --health-cmd pg_isready
          --health-interval 10s
          --health-timeout 5s
          --health-retries 5
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: 'npm'
      - run: npm ci
      - run: chmod -R +x ./scripts
      - run: npm run database:generate users
      - run: npm run database:push users test
      - run: npm run test:e2e users

  test-posts:
    needs: detect-changes
    if: ${{ needs.detect-changes.outputs.posts == 'true' }}
    runs-on: ubuntu-latest
    services:
      postgres:
        image: postgres:latest
        env:
          POSTGRES_USER: johndoe
          POSTGRES_PASSWORD: randompassword
          POSTGRES_DB: postgresql-test
        ports:
          - 3032:5432
        options: >-
          --health-cmd pg_isready
          --health-interval 10s
          --health-timeout 5s
          --health-retries 5
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: 'npm'
      - run: npm ci
      - run: chmod -R +x ./scripts
      - run: npm run database:generate posts
      - run: npm run database:push posts test
      - run: npm run test:e2e posts

You can see that I’m using scripts such as npm run database:generate posts and npm run test:e2e posts. Relevant examples are available in the repository linked below)

Conclusion

That’s it for now regarding the NestJS monorepo! I hope you found this post useful. Since you made it to the end, here’s the link to the monorepo used in this post. I originally built it to prove a concept to my team, but now that it has served its purpose — feel free to use it!

useVideo - Custom hook for interacting with video

Mykhailo Toporkov 🇺🇦 — Sun, 07 Sep 2025 08:33:36 +0000

Right now, hooks are an essential part of React, and I bet you’ve used some custom hooks at least once to handle logic. Recently, I needed to create a custom video player, and to handle the video I came up with this custom useVideo hook:

import type { RefObject } from "react";
import { useRef, useState, useEffect, useCallback } from "react";

type VideoState = {
  volume: number;
  duration: number;
  isMuted: boolean;
  isEnded: boolean;
  isLoading: boolean;
  isStarted: boolean;
  isPlaying: boolean;
  isSeeking: boolean;
  currentTime: number;
  isBuffering: boolean;
  error: MediaError | null;
};

type UseVideoReturn = VideoState & {
  ref: RefObject<HTMLVideoElement | null>;
  mute: () => void;
  play: () => void;
  pause: () => void;
  unmute: () => void;
  restart: () => void;
  toggleMute: () => void;
  togglePlay: () => void;
  seek: (time: number) => void;
  skip: (seconds: number) => void;
  setVolume: (volume: number) => void;
  setPlaybackRate: (rate: number) => void;
};

const initialState: VideoState = {
  volume: 1,
  error: null,
  duration: 0,
  currentTime: 0,
  isMuted: false,
  isEnded: false,
  isLoading: false,
  isStarted: false,
  isPlaying: false,
  isSeeking: false,
  isBuffering: false,
};

export function useVideo(): UseVideoReturn {
  const ref = useRef<HTMLVideoElement>(null);
  const [state, setState] = useState<VideoState>(initialState);

  const updateState = useCallback((update: Partial<VideoState>) => setState((prev) => ({ ...prev, ...update })), []);

  useEffect(() => {
    const video = ref.current;
    if (!video) return;

    const controller = new AbortController();
    const { signal } = controller;

    const eventMap: Partial<Record<keyof HTMLMediaElementEventMap, () => void>> = {
      pause: () => updateState({ isPlaying: false }),
      abort: () => updateState({ isLoading: false }),
      seeking: () => updateState({ isSeeking: true }),
      canplay: () => updateState({ isLoading: false }),
      emptied: () => updateState({ isLoading: false }),
      stalled: () => updateState({ isLoading: false }),
      suspend: () => updateState({ isLoading: false }),
      waiting: () => updateState({ isBuffering: true }),
      loadstart: () => updateState({ isLoading: true }),
      loadeddata: () => updateState({ isLoading: false }),
      canplaythrough: () => updateState({ isLoading: false }),
      ended: () => updateState({ isPlaying: false, isEnded: true }),
      play: () => updateState({ isStarted: true, isPlaying: true }),
      loadedmetadata: () => updateState({ duration: video.duration }),
      durationchange: () => updateState({ duration: video.duration }),
      timeupdate: () => updateState({ currentTime: video.currentTime }),
      error: () => updateState({ isLoading: false, error: video.error }),
      playing: () => updateState({ isPlaying: true, isBuffering: false }),
      volumechange: () => updateState({ volume: video.volume, isMuted: video.muted }),
      seeked: () => updateState({ isSeeking: false, currentTime: video.currentTime }),
    };

    Object.entries(eventMap).forEach(([event, handler]) => video.addEventListener(event, handler, { signal }));

    updateState({
      volume: video.volume,
      isMuted: video.muted,
      isEnded: video.ended,
      duration: video.duration || 0,
      currentTime: video.currentTime || 0,
      isPlaying: !video.paused && !video.ended,
    });

    return () => controller.abort();
  }, [ref, updateState]);

  const play = useCallback(() => {
    if (!ref.current) return;

    ref.current.play();
  }, [ref]);

  const pause = useCallback(() => {
    if (!ref.current) return;

    ref.current.pause();
  }, [ref]);

  const togglePlay = useCallback(() => {
    if (!ref.current) return;

    ref.current.paused ? ref.current.play() : ref.current.pause();
  }, [ref]);

  const seek = useCallback(
    (seconds: number) => {
      if (!ref.current) return;

      const video = ref.current;

      const newTime = Math.max(0, Math.min((video.currentTime || 0) + seconds, video.duration || 0));

      ref.current.currentTime = newTime;
    },
    [ref],
  );

  const skip = useCallback(
    (seconds: number) => {
      if (!ref.current) return;

      seek((ref.current.currentTime || 0) + seconds);
    },
    [seek, ref],
  );

  const mute = useCallback(() => {
    if (!ref.current) return;

    ref.current.muted = true;
  }, [ref]);

  const unmute = useCallback(() => {
    if (!ref.current) return;

    ref.current.muted = false;
  }, [ref]);

  const toggleMute = useCallback(() => {
    if (!ref.current) return;

    ref.current.muted = !ref.current.muted;
  }, [ref]);

  const setVolume = useCallback(
    (volume: number) => {
      if (!ref.current) return;

      ref.current.volume = Math.max(0, Math.min(volume, 1));
    },
    [ref],
  );

  const setPlaybackRate = useCallback(
    (rate: number) => {
      if (!ref.current) return;

      ref.current.playbackRate = rate;
    },
    [ref],
  );

  const restart = useCallback(() => {
    if (!ref.current) return;

    ref.current.currentTime = 0;

    ref.current.play();
  }, [ref]);

  return {
    ref,
    mute,
    play,
    seek,
    skip,
    pause,
    unmute,
    restart,
    setVolume,
    togglePlay,
    toggleMute,
    setPlaybackRate,
    ...state,
  };
}

Maybe this will save someone some development time, so feel free to Ctrl+C / Ctrl+V ))) Of course, if you have any suggestions for improvements, I’d be glad to read them in the comments.

P.S.
Today, ~~russians~~ terrorists launched the largest air attack on Ukraine and struck a government building for the first time. It seems some world leaders have decided to swallow their guts and suck up to evil instead of fighting it. Guess who can be called the new Chamberlain?

Does anybody have a job opportunity? Cuse I am currently not occupied(((

Mykhailo Toporkov 🇺🇦 — Wed, 20 Aug 2025 09:18:09 +0000

Started to learn Elixir, would you recommend something or mention that I need to know?

Mykhailo Toporkov 🇺🇦 — Wed, 30 Jul 2025 09:59:35 +0000

Dealing with Next.js ways of building Apps

Mykhailo Toporkov 🇺🇦 — Sat, 28 Jun 2025 14:16:49 +0000

Next.js is a popular React-based framework for building full-stack web applications. It has, for better or worse, a unique approach to handling routing. I like Next, but for me, it has far too many downsides to use for large enterprise applications, especially those that are client-heavy. And today, I will write about Next.js behaviors and how to deal with them.

First things first, let's set up a test environment to better understanding what we will deal with. For now, I’ll have one file for server actions where I fetch data, and just one home page component:

// src/actions/index.ts

"use server";

type Post = {
  id: number;
  userId: number;
  title: string;
  body: string;
}

export const getPost = async function (postId: number, delay: number = 1000): Promise<Post> {
  const response = await fetch(`https://jsonplaceholder.typicode.com/posts/${postId}`);
  const json = await response.json();
  await new Promise(resolve => setTimeout(resolve, delay));
  return json;
} 

type Todo = {
  id: number;
  userId: number;
  title: string;
  completed: boolean;
}

export const getTodo = async function (todoId: number, delay: number = 1000): Promise<Todo> {
  const response = await fetch(`https://jsonplaceholder.typicode.com/todos/${todoId}`);
  const json = await response.json();
  await new Promise(resolve => setTimeout(resolve, delay));
  return json;
}

// src/app/page.tsx

import { getPost, getTodo } from '@/actions/index'

export default async function Home() {

  const post = await getPost(1, 2000);

  const todo = await getTodo(1, 5000);

  return (
    <main>
      <section>{JSON.stringify(post)}</section>
      <section>{JSON.stringify(todo)}</section>
    </main>
  );
}

Error Handling

Obviously, this code has two major problems: there's no way to display a loading state while the request is being resolved, and there's no error handling. For now, I'll postpone loading fallbacks and focus on error handling since it's not that difficult to fix. Next.js suggests a few ways to handle errors: redirecting to another page using redirect or notFound, returning the error as data by creating a wrapper that catches any error and returns some metadata about it, or using an error.tsx file.

I genuinely think that error.tsx is the worst option among them all. It’s not that it doesn’t have its uses—my concern is that it’s an entire file that serves as a fallback UI for unexpected runtime errors across the whole page. That’s really problematic. If I have an error in getTodo, I want to show an error only in the Todo component, not replace the entire page.

The redirect and notFound seem more attractive to use here, but they require pages to redirect the user to, and they still don’t handle runtime errors that can occur before the redirection happens. So, with all that said, we’re left with only one reliable way to handle errors: return an error as data.

Here is the basic wrapper for handling action errors:

// src/actions/index.ts

"use server";

type ActionData<T> = {
  data: T;
  error: null;
};

type ActionError = {
  data: null;
  error: Record<string, any>;
};

type Action<Args extends any[], Data> = (...args: Args) => Promise<Data>;

const createAction = function <Args extends any[], Data>(action: Action<Args, Data>) {
  return async (...args: Parameters<Action<Args, Data>>): Promise<ActionData<Data> | ActionError> => {
    return action(...args)
      .then((data: Data) => ({ data, error: null }))
      .catch((error: any) => ({ data: null, error: { message: error.message } }));
  };
};

type Todo = {
  id: number;
  userId: number;
  title: "string;"
  completed: boolean;
};

export const getTodo = createAction(async function (todoId: number, delay: number = 1000): Promise<Todo> {
  const response = await fetch(`https://jsonplaceholder.typicode.com/todos/${todoId}`);
  const json = await response.json();
  await new Promise((resolve) => setTimeout(resolve, delay));

  throw Error("Some error");

  return json;
});

// etc...

Now, the Todo component is inside the page, and its related errors can be displayed without affecting other information on the page, such as the post info:

// src/app/page.tsx

import { getPost, getTodo } from "@/actions/index";

export default async function Home() {
  const { data: postData, error: postError } = await getPost(1, 2000);

  const { data: todoData, error: todoError } = await getTodo(1, 5000);

  return (
    <main>
      <section>
        {postData && <div className="text-green-400">{JSON.stringify(postData)}</div>}
        {postError && <div className="text-red-400">{JSON.stringify(postError)}</div>}
      </section>
      <section>
        {todoData && <div className="text-green-400">{JSON.stringify(todoData)}</div>}
        {todoError && <div className="text-red-400">{JSON.stringify(todoError)}</div>}
      </section>
    </main>
  );
}

With this setup, we successfully avoid creating multiple error.tsx files for different routes (file overheat). However, you still need at least a root-level error.tsx file to handle unexpected scenarios.

It’s worth mentioning that you can still use custom React error boundaries. However, for this, data fetching needs to be placed in the target component where you plan to use the data. Of course, the error boundary component cannot be in the same file as your server component, since it is a client component. At this point, it's clear that I'm not a fan of creating that many files for a component's behavior when some logic can be grouped into a single file.

Loading Fallbacks

Displaying some UI for the user while data is being fetched is common sense, and yet, we’re currently not doing it. As with error handling, Next.js suggests a few ways to address this—such as using a loading.tsx file or React Suspense. In Error Handling, I mentioned that we want to handle errors per component, not for the entire page. The same applies to loading fallbacks. If we use loading.tsx, the loading fallback will be displayed (for the entire page) until the slowest promise is resolved. That is why loading.tsx is not for us, and now we left with <Suspense>.

To actually use suspense, we first need to move the fetching logic to a separate server component. Then, we wrap the component in <Suspense>. Where exactly to wrap it is a separate question.

We can have both the loading component and the server component exported from the same file, and then use them with <Suspense> at the page level:

// src/components/post.tsx

import { getPost } from "@/actions";

export function PostLoading() {
  return <div>Post Loading....</div>;
}

export async function Post({ postId }: { postId: number }) {
  const { data, error } = await getPost(postId, 2000);

  return (
    <section>
      {data && <div className="text-green-400">{JSON.stringify(data)}</div>}
      {error && <div className="text-red-400">{JSON.stringify(error)}</div>}
    </section>
  );
}

Or we can have everything in the same file, which is my preferred approach. If you're attentive, you might notice a small drawback: when I need to pass props to my <TodoServer> component, I actually have to pass them through <Todo>, which results in a bit of props drilling — minor, but still... I’ll address this drilling later in the article.

// src/components/todo.tsx

import { Suspense } from "react";
import { getTodo } from "@/actions";

function TodoLoading() {
  return <div>Todo Loading....</div>;
}

async function TodoServer({ todoId }: { todoId: number }) {
  const { data, error } = await getTodo(todoId, 5000);

  return (
    <section>
      {data && <div className="text-green-400">{JSON.stringify(data)}</div>}
      {error && <div className="text-red-400">{JSON.stringify(error)}</div>}
    </section>
  );
}

export function Todo(props: { todoId: number }) {
  return <Suspense fallback={<TodoLoading />} children={<TodoServer {...props} />} />;
}

That is just an example how will this look inside page component:

// src/app/page.tsx

import { Suspense } from "react";
import { Todo } from "@/components/todo";
import { Post, PostLoading } from "@/components/post";

export default async function Home() {
  return (
    <main>
      <Suspense fallback={<PostLoading />}>
        <Post postId={1} />
      </Suspense>
      <Todo todoId={1}/>
    </main>
  );
}

Now that we’ve covered error handling and UI loading fallbacks, the application is much more interactive and user-friendly. Next, I want to address issues related to params and searchParams in Next.js.

Page Params Drilling

Next.js allows dynamic routing, so let’s move our Todo to a separate page with its own route. app/[todoId]/page.tsx. At this stage, everything is fairly straightforward: define types for params and searchParams, await their resolution, display them, and pass them to the <Todo> component:

// src/app/[todoId]/page.tsx

import { Todo } from "@/components/todo";

type PageProps = {
  params: Promise<{ todoId: number }>;
  searchParams: Promise<{ page: number }>;
};

export default async function TodoPage({ params, searchParams }: PageProps) {
  const { todoId } = await params;
  const { page } = await searchParams;

  return (
    <main>
      <h2>TodoId: {todoId}</h2>
      <h2>Page: {page}</h2>
      <Todo todoId={todoId} />
    </main>
  );
}

At this point, you might feel satisfied — but I’m certainly not. You see, while this approach is good enough for a simple page DOM tree, I foresee a props drilling nightmare when it comes to a more complex setup.

What are you going to do if your component is nested inside another component, which is inside yet another one, and so on? It’s not like you can use React Context in server components... This line of thinking leads to a justified desire to access the URL state directly within a server component.

In a server component, we can access cookies and headers, so I suggest utilizing them. However, before retrieving data from them, we need to store that data first — and for this, Next.js middleware.ts is the best option:

// src/middleware.ts

import { NextResponse, NextRequest } from "next/server";

export async function middleware(request: NextRequest) {
  const response = NextResponse.next();

  const { pathname, searchParams } = request.nextUrl;

  response.cookies.set("x-page-params", JSON.stringify(pathname.split("/").filter(Boolean)));
  response.cookies.set("x-page-search-params", JSON.stringify(Object.fromEntries(searchParams.entries())));

  return response;
}

export const config = {
  matcher: [
    // Run on everything but Next internals and static files
    "/((?!_next|[^?]*\\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).*)",
  ],
};

As you can see, the params I put in the cookie are just an array taken from the pathname. This carries a bit of risk, because unlike Next.js—which automatically maps params to your endpoint—you need to know exactly where your component is located to extract dynamic params, not just static ones.

The getters for these params are fairly simple. In them, I omitted checking whether the JSON was parsed correctly for the sake of simplicity, but I don't recommend skipping this check when building a real app:

// src/utils.ts

"use server";
import { cookies } from "next/headers";

export async function getParams(): Promise<Array<string>> {
  const cookieStore = await cookies();
  const pageParams = cookieStore.get("x-page-params");
  return JSON.parse(pageParams ? pageParams.value : "[]") as Array<any>;
}

export async function getSearchParams(): Promise<Record<string, string>> {
  const cookieStore = await cookies();
  const pageParams = cookieStore.get("x-page-search-params");
  return JSON.parse(pageParams ? pageParams.value : "{}") as Record<string, string>;
}

With getters in place, params and search params are available inside server components, and you may use them however you like:

// src/components/todo.tsx

import Link from "next/link";
import { Suspense } from 'react'
import { getTodo } from "@/actions";
import { getParams, getSearchParams } from "@/utils";

export function TodoLoading() {
  return <div>Todo Loading....</div>;
}

export async function TodoServer() {
  const params = await getParams();
  const searchParams = await getSearchParams();

  const todoId = +params[0] || 1;

  const currentPage = +searchParams.page || 1;

  const nextPageQuery = { ...searchParams, page: currentPage + 1 };

  const prevPageQuery = { ...searchParams, page: currentPage - 1 };

  const { data, error } = await getTodo(todoId, 2000);

  return (
    <section>
      {data && (
        <>
          <div>{JSON.stringify(params)}</div>
          <div>{JSON.stringify(data)}</div>
          <div className="flex gap-8">
            <Link href={{ query: prevPageQuery }}>Prev page</Link>
            <span>Page: {currentPage}</span>
            <Link href={{ query: nextPageQuery }}>Next page</Link>
          </div>
        </>
      )}
      {error && <div style={{ color: "red" }}>{JSON.stringify(error)}</div>}
    </section>
  );
}

export async function Todo() {
  return <Suspense fallback={<TodoLoading />} children={<TodoServer />} />;
}

Try playing around with this pagination — do you notice how React Suspense works in Next.js? That will be the next chapter to cover.

Suspense with Search Params

If you followed the code and tried to play around with it, you may notice that the loading fallback does not appear when the search parameter is changed via a link click.

Suspense fallback does not show when only search parameters change because Next.js does not remount the server component — it reuses the existing one. Since no navigation to a new route occurs, the component isn't re-fetched, and Suspense is not triggered again. To force a reload, you must use dynamic key or segment that reacts to search params.

I prefer addressing this by creating a custom <Suspense> that re-renders when the search params or path change—solving the issue where the fallback doesn’t show on search param updates.

// src/components/search-params-suspense.tsx

"use client";
import { Suspense } from "react";
import type { ComponentProps } from "react";
import { usePathname, useSearchParams } from "next/navigation";

export function SearchParamsSuspense(props: ComponentProps<typeof Suspense>) {
  const pathname = usePathname();
  const searchParams = useSearchParams();

  const key = `${pathname}?${searchParams.toString()}`;

  return <Suspense key={key} {...props} />;
}

That's pretty much all I wanted to share about working with Next.js. I won't claim that my approach is the only correct one—someone might come up with a better solution. But for now, I'll just patiently wait for your thoughts on the matter. See ya!

Tomorrow will be my second blood donation. This time, it will be at the Blood Center of the Ministry of Defense of Ukraine. Also thanks to Vasyl Maliuk and everyone involved in today’s event!

Mykhailo Toporkov 🇺🇦 — Sun, 01 Jun 2025 13:40:29 +0000

Connecting multiple databases using Prisma in NestJS

Mykhailo Toporkov 🇺🇦 — Wed, 09 Apr 2025 12:23:14 +0000

Prisma ORM is a Node.js and TypeScript ORM with an intuitive data model, automated migrations, type-safety, and auto-completion. I’m really fond of this ORM, though it still has its drawbacks.

Recently, I was challenged to set up database connections for PostgreSQL and MongoDB using Prisma ORM in a NestJS app. Though the official docs provide example for this case, I still feel like sharing my solution with you, cause I think there some improvments that can be done)

Folders structure
Initializing Prisma Clients in Nest
Helper scripts for migrations

Folders structure

Honestly, I don't see much value in creating separate folders for each database by uniting Prisma and renaming them for a specific database, as shown in the official example. Grouping specific database folders inside the original prisma folder seems more reasonable to me. So my preferred structure looks this way:

   📂 prisma
     |
     | --- 📂 mongodb 
     |        | --- schema.prisma
     |
     | --- 📂 postgres
     |        | --- schema.prisma
     |        | --- 📂 migrations

The custom output path is an important part of this configuration, as Prisma generates client types for certain databases, and these generated clients are needed for establishing connections.

According to the docs, generated types can be stored in ./src. I haven't tried this approach in plain Node with Express, but I recommend avoiding it in NestJS, because for some reason, it makes the generated files unloadable by Node. That is why for myself I store generated staff in node_modules or in the root of repo.

generator client {
  provider = "prisma-client-js"
  output   = "../../node_modules/@prisma/mongodb-client"
}

datasource db {
  provider = "mongodb"
  url      = env("MONGO_DATABASE_URL")
}

generator client {
  provider        = "prisma-client-js"
  previewFeatures = ["fullTextSearchPostgres"]
  output          = "../../node_modules/@prisma/postgres-client"
}

datasource db {
  provider = "postgresql"
  url      = env("POSTGRES_DATABASE_URL")
}

Initializing Prisma Clients in Nest

There’s not much to say in this section, except that PrismaClient should be imported from the generated clients located in node_modules. So, I’ll just leave this code example:

import { PrismaClient } from '@prisma/mongodb-client';
import { Injectable, OnModuleInit } from '@nestjs/common';

@Injectable()
export class MongodbDatabaseService extends PrismaClient implements OnModuleInit {
  async onModuleInit() {
    await this.$connect();
  }
}

import { PrismaClient } from '@prisma/postgres-client';
import { Injectable, OnModuleInit } from '@nestjs/common';

@Injectable()
export class PostgresDatabaseService extends PrismaClient implements OnModuleInit {
  async onModuleInit() {
    await this.$connect();
  }
}

Helper scripts for migrations

I'm not a fan of this example for helper scripts. Though it's a rare occasion, just imagine how it would look if you had four database connections... My point—and solution—is that all these manipulations are better handled in a separate script file:

import 'dotenv/config';
import { readdirSync } from 'fs';
import { execSync } from 'child_process';

const PRISMA_PATH = './prisma';
const COMMANDS_EXTENSIONS = [{ folderName: 'mongodb', commands: ['migrate', 'deploy'] }];

const generateSchemaParam = (folderName: string) => `--schema ./${PRISMA_PATH}/${folderName}/schema.prisma`;

const commands = {
  generate: (folderName) => `npx prisma generate ${generateSchemaParam(folderName)}`,
  migrate: (folderName) => `npx prisma migrate dev ${generateSchemaParam(folderName)}`,
  deploy: (folderName) => `npx prisma migrate deploy ${generateSchemaParam(folderName)}`,
};

const [, , actions] = process.argv;

if (!commands[actions]) {
  console.error('Invalid action. Available actions: generate, migrate, deploy, studio');
  process.exit(1);
}

readdirSync('./prisma').forEach((folderName, index) => {
  const isExeption = COMMANDS_EXTENSIONS.some(
    (exeption) => exeption.folderName === folderName && exeption.commands.includes(actions),
  );

  if (isExeption) return;

  const cmd = commands[actions](folderName, index);
  execSync(cmd, { stdio: 'inherit' });
});

It's also important to mention that different databases have different features—for MongoDB, for example, this means there are no migrate support.

All these commands can be added to package.json and easily executed via ts-node.

  "scripts": {
    "postinstall": "ts-node ./scripts/prisma.ts generate",
    "databases:generate": "ts-node ./scripts/prisma.ts generate",
    "databases:migrate": "ts-node ./scripts/prisma.ts migrate",
    "databases:deploy": "ts-node ./scripts/prisma.ts deploy"
  },

Conclusion

I hope this tutorial is useful for you, so that’s it for today! See you around!

It time to switch to MilTech

Mykhailo Toporkov 🇺🇦 — Sat, 29 Mar 2025 13:22:38 +0000

It has been three years since the full-scale war and ten years since the hybrid war started in my country. I do not expect understanding from you in this post; I just wanted to share some of my thoughts about the future. Here, you will probably find some unpleasant thoughts and opinions. You may disagree with me in the comments if you wish.

Ukrainian Revolution of Drones

Neutralizing (killing) enemies is an essential part of war. Finding the most efficient ways to neutralize them is also essential, and my country has found a way to fight against the invaders. Currently, approximately 80% of enemy losses are caused by FPV drones. I would gladly show you how our drones are literally tearing russians apart))), but I suppose that would be too much for this article... Anyway we will talk about FPV kamikaze drones more in the next section.

Drones have also transformed intelligence operations. Although some countries (with inadequate presidents at the moment) boast about drones costing MILLIONS AND MILLIONS of dollars e.g. MQ-9 for $33 million, they will be of little use in modern warfare due to existing air defenses and the electronic warfare capabilities of the enemy. The loss of even a single unit of this drone would be a disaster. On the other hand, you can buy a batch of 100 "SHARK UAV" units—and by 'unit,' I mean three UAVs along with a vehicle equipped with a command post. It is ideal for monitoring and adjusting fire on the battlefield. It is ideal for monitoring and adjusting fire on the battlefield, with a flight time of over two hours and a range of 60 km. However, perhaps the most important factor is that it is relatively cheap.

Now, guess how a country without a naval fleet strikes fear into Russian warships? Yeah, the revolution of drones is not only happening in the sky. Sea drones have become a game-changer in naval warfare. Nowadays, you don’t need billion-dollar ships to destroy other billion-dollar ships —some "Sea Baby" or "MAGURA V5" are more than enough. At the beginning, the drone was just a simple (not really so simple) kamikaze drone that could deliver enough payload to destroy a missile cruiser. But now, it has already evolved into a platform capable of carrying missiles of different types or serving as a carrier for other FPV drones.

Drones were a game-changer in this war; they significantly changed approaches to intelligence and strikes. However, nothing has transformed the battlefield more than FPV kamikaze drones.

FPV kamikaze drones

It all started with this video, in which soldiers from the now-legendary unit SIGNUM were recorded in history as the first to use an FPV drone to strike the enemy. The avalanche began: FPV bombers converted from domestic FPVs, 7/10-inch FPV kamikaze drones with RPG warheads, FPVs with thermobaric warheads, FPVs on optic cables, FPVs with guidance, and so many more. "Artillery is the god of war"—this phrase belongs to the murderer, tyrant, and dictator Joseph Stalin. But now, the role of "god" is shifting to FPVs. And that is not unexpected shift due to key advantages that FPV kamikaze drones have:

Precision Targeting: FPV kamikaze drones can deliver highly accurate strikes on specific targets, reducing collateral damage compared to the often less precise artillery shells.
Flexibility and Mobility: FPV drones can easily maneuver around obstacles and adjust their flight path in real-time, allowing them to target moving or hard-to-reach enemy positions, whereas artillery is limited to fixed firing positions and line-of-sight constraints.
Lower Cost: FPV kamikaze drones are generally much cheaper than traditional artillery systems, making them more cost-effective for striking high-value targets without the need for expensive munitions.
Speed and Stealth: Drones can approach targets faster and with more stealth compared to artillery, which often gives away its position after firing. FPV drones can also fly under radar coverage or use terrain for concealment.
Reduced Risk to Personnel: Since FPV kamikaze drones are remotely operated, there is minimal risk to personnel compared to artillery crews, who are often exposed to enemy fire while operating and reloading artillery guns.

Right now, the full potential of FPV kamikaze drones is still uncertain, even though 80% of casualties among Russian invaders are due to drones. We still have a long way to go, and I'm sure that at some point, we will be able to defeat all the Russians. As Sir Sternenko says, "Кожному росіянину по дрону в пику." You can implement his mantra here)

Miltech require more innovations

Drones have already changed the game, but we’re just getting started. FPV kamikaze drones are deadly, but they still depend on human operators. The next step? Full autonomy. AI-driven drones that don’t need constant control, that can navigate through enemy jamming, and that can strike with precision even in the most chaotic battles. Imagine FPVs that can find their targets on their own, hunt in packs, and execute missions without a pilot glued to a screen. That’s where we need to go.

In wartime, development is moving at an absolutely brutal pace. What would take years in peacetime gets built, tested, and improved in weeks—sometimes even days. You’re not just coding; you’re solving real-world problems with immediate impact. Every new script, every optimization, every line of code can be the difference between a missed target and a direct hit. If you want to grow fast as a developer, there’s no better place to be right now.

But it’s not just about software—hardware innovations are just as crucial. More efficient batteries, better signal encryption, stronger materials, and modular payloads can make FPVs even deadlier. The future isn’t just in writing code; it’s in combining software, hardware, and battlefield strategy into one unstoppable force. We need more engineers, more hackers, more innovators—because this war is driven by tech, and those who push the limits will define the outcome.

For me, miltech is hands down the best option for growth as a developer right now. Nowhere else will you find this level of rapid innovation, immediate real-world impact, and the chance to work on cutting-edge tech that actually matters. If you want to level up fast, this is the place to be.

Conclusion

Considering all that was said above, I don’t really see a better option than miltech to satisfy my hatred towards Russians. For this reason, I have already started learning C. I will probably try to post some articles about C in the future, or I might join the military and get the opportunity to tear some russians apart using FPV. The future is unpredictable.

See you around folks, Death to russian invaders and Glory to Ukraine!!!!

Investment in FPV drones, against Russian invasion can be done here.

Seems like the USA switched its role from leader of the free world to leader of sucking russian cocks.

Mykhailo Toporkov 🇺🇦 — Thu, 20 Feb 2025 14:24:11 +0000

Tic-Tac-Toe with Pygame

Mykhailo Toporkov 🇺🇦 — Mon, 13 Jan 2025 07:31:04 +0000

Hi folks, this will be the first post of the year. I hope you had very merry holidays, are relaxed, and are full of energy to continue your IT journey!

At least once in your career as a developer, you’ve probably created something banal, like a calculator, a to-do list, or a Tic-Tac-Toe game. Today, that’s exactly what I’m going to do—but with a bit of a twist. I’ll create a Tic-Tac-Toe game using Python with Pygame. Yes, I’m not that proficient in Python—at least not yet—so I’d be glad to hear any suggestions or improvements in the comments!

So let's dive in Python with Pygame, in this article I will cover:

Game Logic
Buttons
Keypad
Scorebar
Playboard
Constructing and Building game

Game Logic

First things first, the main logic behind Tic-Tac-Toe is obvious. There is a board with a size of 3x3 fields. Players take turns filling the fields with X or O. The first player to get three symbols in a row, column, or diagonal wins. For my implementation, in addition to common logic, I want to track player scores and provide the ability to reset the game or a round. Here is a sketch representation of what I’m going to build:

Here is the class responsible for the game behavior. As you can see, I haven’t used a matrix to track the filled fields on the board. Of course, you can create your implementation using a matrix, but for me, it doesn’t make much sense to use one when the board size is only 3x3. This is why a list is more than enough. The win-checking logic is designed as an iteration over winning combinations, represented as tuple of tuples with indexes. Also, there’s no point in checking for a winner before the fifth move because, before that, there aren’t enough symbols to form a win.

from enum import Enum
from config import WINNING_COMBINATIONS

DEFAULT_BOARD = [None] * 9


class Players(Enum):
    PLAYER_X = "X"
    PLAYER_O = "O"


class Game:
    def __init__(
        self,
        board=DEFAULT_BOARD.copy(),
        turn=Players.PLAYER_X.value,
        score_x=0,
        score_o=0,
        player_won=None,
        move_count=0,
        win_line=None,
    ):

        self.turn = turn
        self.board = board
        self.is_full = False
        self.score_x = score_x
        self.score_o = score_o
        self.win_line = win_line
        self.move_count = move_count
        self.player_won = player_won

    def __check_win(self):
        for index, item in enumerate(WINNING_COMBINATIONS):
            board_item_1 = self.board[item[0]]
            board_item_2 = self.board[item[1]]
            board_item_3 = self.board[item[2]]

            if board_item_1 == board_item_2 == board_item_3 and board_item_1 != None:
                self.win_line = index
                return (True, board_item_1)

        return (False, None)

    def move(self, index):
        if self.player_won:
            return

        if self.board[index] != None:
            return

        self.board[index] = self.turn
        self.move_count += 1

        self.turn = (
            Players.PLAYER_X.value
            if self.turn == Players.PLAYER_O.value
            else Players.PLAYER_O.value
        )

        if self.move_count < 5:
            return

        self.is_full = None not in self.board

        (isWin, player) = self.__check_win()

        if isWin:
            if player == Players.PLAYER_X.value:
                self.score_x += 1
                self.player_won = Players.PLAYER_X.value

            if player == Players.PLAYER_O.value:
                self.score_o += 1
                self.player_won = Players.PLAYER_O.value

    def new_round(self):
        self.move_count = 0
        self.board = DEFAULT_BOARD.copy()

        if self.player_won == Players.PLAYER_X.value:
            self.turn = Players.PLAYER_O.value

        if self.player_won == Players.PLAYER_O.value:
            self.turn = Players.PLAYER_X.value

        self.win_line = None
        self.player_won = None

    def rest_game(self):
        self.score_x = 0
        self.score_o = 0
        self.move_count = 0
        self.win_line = None
        self.player_won = None
        self.board = DEFAULT_BOARD.copy()

Buttons

The game needs to have two types of buttons, according to the sketch: board button to display an empty field, X, or O, and text button for controls.
But firstly I would like to implement the button primitive that will accept callback and handle click events:

from pygame import Rect, draw, mouse
from config import PALE_GOLDENROD_COLOR


class Button:
    def __init__(
        self,
        top=0,
        left=0,
        width=100,
        height=100,
        callback=None,
        background_color=PALE_GOLDENROD_COLOR,
    ):
        self.top = top
        self.left = left
        self.clicked = False
        self.callback = callback
        self.background_color = background_color
        self.rect = Rect(left, top, width, height)

    def __handle_click(self):
        if not self.callback:
            return

        mouse_pos = mouse.get_pos()

        if self.rect.collidepoint(mouse_pos):
            if mouse.get_pressed()[0] == 1 and not self.clicked:
                self.clicked = True
                self.callback()

        if mouse.get_pressed()[0] == 0:
            self.clicked = False

    def draw(self, screen):
        self.__handle_click()
        draw.rect(screen, self.background_color, self.rect)

The __handle_click method calls the callback function passed to the Button whenever the user clicks the mouse over the button's rectangle. It also prevents multiple clicks by tracking whether the button has already been clicked.

Now, with the button primitive in place, the keypad text button and board button can be created. The keypad button will have a border and be able to display text inside:

from .button import Button
from pygame import font, draw
from config import CHESTNUT_BROWN_COLOR


class KeypadButton(Button):
    def __init__(
        self,
        text="button",
        text_color=CHESTNUT_BROWN_COLOR,
        border_color=CHESTNUT_BROWN_COLOR,
        **kwargs
    ):
        super().__init__(**kwargs)
        self.text = text
        self.text_color = text_color
        self.border_color = border_color
        self.font = font.Font(None, 30)

    def __draw_text(self, screen):
        text_surface = self.font.render(self.text, True, self.text_color)
        text_rect = text_surface.get_rect(center=self.rect.center)
        screen.blit(text_surface, text_rect)

    def draw(self, screen, top=None, left=None):
        self.rect.top = top or self.top
        self.rect.left = left or self.left
        super().draw(screen)
        draw.rect(screen, self.border_color, self.rect, 4)
        self.__draw_text(screen)

The board button can be blank, or it can contain an X or O:

from enum import Enum
from pygame import draw
from .button import Button
from config import COLDEN_OCHRE_COLOR


class BoardButtonState(Enum):
    EMPTY = None
    CROSS = "X"
    CIRCLE = "O"


class BoardButton(Button):
    def __init__(
        self, state=BoardButtonState.EMPTY, text_color=COLDEN_OCHRE_COLOR, **kwargs
    ):
        super().__init__(**kwargs)
        self.state = state
        self.text_color = text_color

    def __draw_circle(self, screen):
        center = self.rect.center
        radius = self.rect.width // 2.5
        draw.circle(screen, self.text_color, center, radius, width=6)

    def __draw_cross(self, screen):
        padding = 10
        x1, y1 = self.rect.topleft
        x2, y2 = self.rect.bottomright
        draw.line(
            screen,
            self.text_color,
            (x1 + padding, y1 + padding),
            (x2 - padding, y2 - padding),
            width=8,
        )
        draw.line(
            screen,
            self.text_color,
            (x2 - padding, y1 + padding),
            (x1 + padding, y2 - padding),
            width=8,
        )

    def draw(self, screen, top=None, left=None):
        self.rect.top = top or self.top
        self.rect.left = left or self.left
        super().draw(screen)
        if self.state == BoardButtonState.CIRCLE.value:
            self.__draw_circle(screen)
        elif self.state == BoardButtonState.CROSS.value:
            self.__draw_cross(screen)

That’s essentially all about the buttons. You’ll also notice that the winning combinations and default button colors are stored in a config file, which can be found via the link to the game repository at the end of the article.

Keypad

The keypad component is quite simple; it just needs to display two buttons. In general, I could probably just draw control buttons like "Reset Game" or "New Round" directly in the main file. However, for better organization and flexibility, it would be ideal to define these components separately and integrate them into the main file as needed.

from pygame import Rect, draw
from .keypad_button import KeypadButton
from config import PALE_GOLDENROD_COLOR

class Keypad:
    def __init__(
        self,
        left=0,
        top=0,
        width=312,
        height=60,
        background_color=PALE_GOLDENROD_COLOR,
        left_text="left_button",
        left_callback=None,
        right_text="right_button",
        right_callback=None,
    ):
        self.left_text = left_text
        self.right_text = right_text
        self.left_callback = left_callback
        self.right_callback = right_callback
        self.background_color = background_color
        self.rect = Rect(left, top, width, height)

    def draw(self, screen):
        draw.rect(screen, self.background_color, self.rect)

        width = 151
        height = 60

        left = self.rect.left
        right = self.rect.width - width + 10
        top = self.rect.top + (self.rect.height - height) // 2

        left_button = KeypadButton(
            text=self.left_text,
            callback=self.left_callback,
            top=top,
            left=left,
            width=width,
            height=height,
        )
        right_button = KeypadButton(
            text=self.right_text,
            callback=self.right_callback,
            top=top,
            left=right,
            width=width,
            height=height,
        )

        left_button.draw(screen)
        right_button.draw(screen)

Scorebar

Remembering how simple the keypad is, I expected that the scorebar wouldn’t be harder to build.... Yeah, I was wrong because I forgot that text placement will requires a hell lot of math. The players' score placement wasn’t that tough; just two text containers for the label and the value, placed one after another on opposite sides of the container.

If you’ve worked with a canvas, you might know that text doesn’t wrap automatically, so you need to handle it manually. The Pygame wiki provides a simple example for text wrapping. However, it may not always suit your specific use cases. Probably the best approach would be to create a Text component to handle wrapping and styling, but I was too lazy at that point)

from game import Players
from pygame import Rect, draw, font
from config import CHESTNUT_BROWN_COLOR, PALE_GOLDENROD_COLOR, COLDEN_OCHRE_COLOR


class Scorebar:
    def __init__(
        self,
        score_x=0,
        score_o=0,
        turn=None,
        move_count=0,
        is_full=False,
        player_won=None,
        left=0,
        top=0,
        width=312,
        height=100,
        backgroundColor=PALE_GOLDENROD_COLOR,
        textPrimaryColor=CHESTNUT_BROWN_COLOR,
        textSecondaryColor=COLDEN_OCHRE_COLOR,
    ):
        self.turn = turn
        self.width = width
        self.height = height
        self.is_full = is_full
        self.score_x = score_x
        self.score_o = score_o
        self.move_count = move_count
        self.player_won = player_won
        self.backgroundColor = backgroundColor
        self.textPrimaryColor = textPrimaryColor
        self.textSecondaryColor = textSecondaryColor
        self.rect = Rect(left, top, width, height)

    def __draw_score_x(self, screen):
        label_font = font.Font(None, 24)
        value_font = font.Font(None, 30)
        label_surface = label_font.render("Score-X:", True, self.textPrimaryColor)
        value_surface = value_font.render(
            f"{self.score_x}", True, self.textSecondaryColor
        )

        label_left = self.rect.left + 10
        label_top = self.rect.top + 10
        value_left = label_left + label_surface.get_width() + 5
        value_top = label_top - 2

        screen.blit(label_surface, (label_left, label_top))
        screen.blit(value_surface, (value_left, value_top))

    def __draw_score_o(self, screen):
        label_font = font.Font(None, 24)
        value_font = font.Font(None, 30)
        label_surface = label_font.render("Score-O:", True, self.textPrimaryColor)
        value_surface = value_font.render(
            f"{self.score_o}", True, self.textSecondaryColor
        )

        value_left = self.rect.right - 10 - value_surface.get_width()
        label_left = value_left - label_surface.get_width() - 5
        label_top = self.rect.top + 10
        value_top = label_top - 2

        screen.blit(label_surface, (label_left, label_top))
        screen.blit(value_surface, (value_left, value_top))

    def __draw_message(self, screen):
        text_container = Rect(self.rect.left, self.rect.top + 30, self.rect.width, 70)
        text_font = font.Font(None, 30)
        line_spacing = -2
        text = ""

        if self.turn:
            text = f"Player {self.turn}'s turn"

        if self.player_won != None:
            text = f"Player {self.player_won} won"

        if self.is_full and self.player_won == None:
            text = "It seems tie"

        if self.move_count == 0:
            second= None
            if self.turn == Players.PLAYER_X.value:
                second = Players.PLAYER_O.value
            if self.turn == Players.PLAYER_O.value:
                second = Players.PLAYER_X.value
            text = f"Player {self.turn} starts first, followed by Player {second}"

        lines = []
        remaining_text = text
        font_height = text_font.size("Tg")[1]

        while remaining_text:
            i = 1

            while text_font.size(remaining_text[:i])[
                0
            ] < text_container.width and i < len(remaining_text):
                i += 1

            if i < len(remaining_text):
                i = remaining_text.rfind(" ", 0, i) + 1

            lines.append(remaining_text[:i])
            remaining_text = remaining_text[i:]

        total_text_height = len(lines) * font_height + (len(lines) - 1) * line_spacing

        y = text_container.top + (text_container.height - total_text_height) // 2

        for line in lines:
            line_surface = text_font.render(line, True, self.textPrimaryColor)
            line_rect = line_surface.get_rect(
                center=(text_container.centerx, y + font_height // 2)
            )
            screen.blit(line_surface, line_rect.topleft)
            y += font_height + line_spacing

    def draw(self, screen):
        draw.rect(screen, self.backgroundColor, self.rect)
        self.__draw_score_x(screen)
        self.__draw_score_o(screen)
        self.__draw_message(screen)

Playboard

The main goal for playboard is to place all the buttons correctly and display win line in case some of the players won the round. Somehow I decided that bord should accept the list of items instead of creating the buttons inside itself, looking back that probably wasnt the great desition, my only excuse is that I was foused for creating universal grid layout at the beginning.

The game itself can have only the 8 win combinations, the win line will be drawn based on the index of the win combination passed to the board and put on place relative to board size.

from pygame import Rect, draw
from config import CHESTNUT_BROWN_COLOR, PALE_GOLDENROD_COLOR


class Board:
    def __init__(
        self,
        top=0,
        left=0,
        item_width=100,
        item_height=100,
        gap_x=6,
        gap_y=6,
        items=None,
        win_line=0,
        background_color=CHESTNUT_BROWN_COLOR,
        line_border_color=CHESTNUT_BROWN_COLOR,
        line_background_color=PALE_GOLDENROD_COLOR,
    ):
        self.items = items
        self.gap_y = gap_y
        self.gap_x = gap_x
        self.win_line = win_line
        self.item_width = item_width
        self.item_height = item_height
        self.background_color = background_color
        self.items = items or [None] * 9
        height = 3 * item_height + 2 * gap_y
        width = 3 * item_width + 2 * gap_x
        self.line_border_color = line_border_color
        self.line_background_color = line_background_color
        self.rect = Rect(left, top, width, height)

    def __draw_items(self, screen):
        for column in range(3):
            for row in range(3):
                index = row * 3 + column

                if index >= len(self.items):
                    break

                top = self.rect.top + row * (self.item_height + self.gap_y)
                left = self.rect.left + column * (self.item_width + self.gap_x)
                item = self.items[index]

                if item:
                    item.draw(screen, top, left)

    def __draw_win_line(self, screen):
        if not self.win_line:
            return

        padding = 10
        start_pos, end_pos = None, None

        if self.win_line == 0:
            y = self.rect.top + self.item_height // 2
            start_pos = (self.rect.left + padding, y)
            end_pos = (self.rect.right - padding, y)

        if self.win_line == 1:
            y = self.rect.top + self.item_height + self.gap_y + self.item_height // 2
            start_pos = (self.rect.left + padding, y)
            end_pos = (self.rect.right - padding, y)

        if self.win_line == 2:
            y = self.rect.bottom - self.item_height // 2
            start_pos = (self.rect.left + padding, y)
            end_pos = (self.rect.right - padding, y)

        if self.win_line == 3:
            x = self.rect.left + self.item_width // 2
            start_pos = (x, self.rect.top + padding)
            end_pos = (x, self.rect.bottom - padding)

        if self.win_line == 4:
            x = self.rect.left + self.item_width + self.gap_x + self.item_width // 2
            start_pos = (x, self.rect.top + padding)
            end_pos = (x, self.rect.bottom - padding)

        if self.win_line == 5:
            x = self.rect.right - self.item_width // 2
            start_pos = (x, self.rect.top + padding)
            end_pos = (x, self.rect.bottom - padding)

        if self.win_line == 6:
            start_pos = (self.rect.left + padding, self.rect.top + padding)
            end_pos = (self.rect.right - padding, self.rect.bottom - padding)

        if self.win_line == 7:
            start_pos = (self.rect.right - padding, self.rect.top + padding)
            end_pos = (self.rect.left + padding, self.rect.bottom - padding)

        draw.line(
            screen,
            self.line_border_color,
            start_pos,
            end_pos,
            width=8,
        )

        draw.line(
            screen,
            self.line_background_color,
            start_pos,
            end_pos,
            width=6,
        )

    def draw(self, screen):
        draw.rect(screen, self.background_color, self.rect)
        self.__draw_items(screen)
        self.__draw_win_line(screen)

Here we are done with all necessary ui components for building the game, so let's put it all together in the nest section.

Constructing and Building game

Before putting everything together, I will use the very first template from the Pygame documentation. Now the game itself can be initialized. After that, I created a few functions to retrieve the necessary parameters from the Game class and format them for the UI components. The update function is responsible for creating all the necessary components and is also called within the button callback functions to trigger UI re-rendering. And that’s basically it—the game is ready to play!

import pygame
from game import Game
from ui.board import Board
from ui.keypad import Keypad
from pygame.locals import QUIT
from ui.scorebar import Scorebar
from ui.board_button import BoardButton
from config import PALE_GOLDENROD_COLOR

pygame.init()
screen = pygame.display.set_mode((332, 522))
clock = pygame.time.Clock()

padding = 10
running = True
game = Game()


def create_board_button_callback(index):
    def callback():
        game.move(index)
        update()

    return callback


def create_keypad_button_callback(fn):
    def callback():
        fn()
        update()

    return callback


def create_scorebar_params():
    return {
        "turn": game.turn,
        "is_full": game.is_full,
        "score_x": game.score_x,
        "score_o": game.score_o,
        "move_count": game.move_count,
        "player_won": game.player_won,
    }


def create_board_params():
    buttons = []
    for index, state in enumerate(game.board):
        callback = create_board_button_callback(index)
        button = BoardButton(state=state, callback=callback)
        buttons.append(button)
    return {"items": buttons, "win_line": game.win_line}


def create_keypad_params():
    left_text = "Reset Game"
    left_callback = create_keypad_button_callback(game.rest_game)
    right_text = "New Round" if game.player_won else "Reset Round"
    right_callback = create_keypad_button_callback(game.new_round)

    return {
        "left_text": left_text,
        "right_text": right_text,
        "left_callback": left_callback,
        "right_callback": right_callback,
    }


def update():
    global board
    global keypad
    global scorebar
    scorebar = Scorebar(top=padding, left=padding, **create_scorebar_params())
    board = Board(top=(2 * padding) + 100, left=padding, **create_board_params())
    keypad = Keypad(top=(4 * padding) + 412, left=padding, **create_keypad_params())


update()

while running:
    for event in pygame.event.get():
        if event.type == QUIT:
            running = False

    screen.fill(PALE_GOLDENROD_COLOR)

    scorebar.draw(screen)
    board.draw(screen)
    keypad.draw(screen)

    pygame.display.flip()
    clock.tick(30)

pygame.quit()

Here is a small preview on the game:

Now the only thing left to do is to bundle the game so it can be played without requiring Python to be installed on your system. For this, I will use PyInstaller. It’s straightforward and will package the game into a single executable file.

Conclusion

Oh, now that I’m looking at this article, there’s quite a lot of code for a simple game... But nevertheless, it was an interesting experience to build Tic-Tac-Toe for the first time in my life. I’m not entirely sure I used Python in the best way throughout, but I hope you’ll let me know in the comments if I made any mistakes. For now, that’s it. I hope you enjoyed reading this! And here’s the link to the repository with the game