Create a Simple Web Application for Your Game Using Strapi.js — Part 1

Setup and getting started

Omid Reza Izadi
The Startup
5 min readAug 31, 2020

--

Strapi.js official logo

“Note that this tutorial is done in Windows OS. For Linux, you may need to make some changes and modifications ;)”

It’s a fact that having a server-side application, can help developers to add lots of functionalities to their games. They can have a score leaderboard, some game configs they want to change without client updates, occasional events, handling online asset bundles, validating purchases, or even implementing game logic on the server! And that’s just a few of the functionalities I’m talking about!

Today I’m going to introduce something that can help you meet your very basic needs for a game web application. Something that you can easily deploy on a server (Windows/Linux) and use it in a game, no matter what engine or tool you’re using (Unity, Unreal, Game Maker, …).

A short introduction to REST API

REST is a software architectural style that is used to transfer data between a client and a server. In other words, It’s just about putting data in an object, serializing it to a string, send it to the server and wait for a response, receive the response as a string and deserialize it to another object and then extracting the data.

It wasn’t that hard! was it? That’s all you need to know about this concept. But it doesn’t hurt to search and learn a little bit more! So we leave that here and move on to the next section.

Strapi.js

I assume that almost all of you are game developers and with high chances, you have never worked with any web applications! But it’s ok because at first, I was just like you! And it took me only 2 or 3 days to figure it out and start developing my own game server.

So what is Strapi.js?

Strapi is a flexible, open-source Headless CMS (Content Management System) that gives developers the freedom to choose their favorite tools and frameworks, while also allowing editors to easily manage and distribute their content. By making the admin panel and API extensible through a plugin system, Strapi enables the world’s largest companies to accelerate content delivery while building beautiful digital experiences.

Strapi’s official website

So Strapi is just a framework that lets you manage your content through an admin panel, and build your own API for your game.

For working with the admin panel you don’t need any sort of special skills, but for writing the logic and the API, you need to understand Javascript and Nodejs. And believe me, these are the easiest programming languages you can ask for!

So let’s setup Strapi!

Setup your first Strapi.js application

Setup Nodejs

There are only 3 requirements for installing Strapi on your local machine (and later on your server):

  • Node.js 12.x
  • npm 6.x
  • MongoDB 3.6 (or later) (it is just my preferred database! you can use anything you’re comfortable with. See Strapi’s supported databases here)

I’m not going to explain how to install these tools because there’s plenty of tutorials out there and it’s not such a complicated process! So if you don’t have these requirements on your machine, just stop here and go install them and come back to continue.

to make sure that everything is just fine, open the command line prompt and execute the following command:

node -v

and

npm -v

you must see the versions of your Nodejs and npm.

and for the database execute the following command:

mongod.exe

if you saw this error: ‘mongod.exe’ is not recognized as an internal or external command, … it’s ok. You must give it the full path of your MongoDB executable file. Something like this:

D:\Program Files\MongoDB\Server\3.6\bin\mongod.exe

after you ran the MongoDB, we’re good to go!

Create your Strapi project

Open the command prompt, navigate to the folder where you want to initialize your application, and then execute the command below.

npx create-strapi-app strapi-tutorial

you can replace strapi-tutorial with your own project name.

then you must choose your installation type.

select Custom (manual settings):

from the following list, select mongo:

for the next steps, you just need to press Enter! as long as the database is in your local machine, it’s not risky to not setting username and password for your mongo database.

a completed Strapi.js custom installation form

after seeing something like this, the installation has finished:

now to run your application for development just execute the following command while you are in your application's directory:

npm run develop

and wait for the admin UI to be built:

after that a tab will be opened in your browser with the following address:

http://localhost:1337/admin/auth/register-admin

you will see an admin registration form which will be a one-time thing:

fill it out and press Let’s Start!

Strapi.js Admin Panel

Congratulations! You have successfully created the application! In the Next Part, we will implement a cool feature for our game.

Thank you for reading!

--

--

Omid Reza Izadi
The Startup

7+ years in game development, key contributor to major projects, skilled game programmer. Helped captivate 100K+ players. Committed to continuous growth