Game Development with ReactJS and PHP: How Compatible Are They?

"I'd like to make a multiplayer, economy-based game. Something like Stardew Valley, but with none of the befriending aspects and a player-based economy."

I started thinking about this the moment I decided to try and build a game using PHP and ReactJS. The trouble is that I knew nothing about the dynamics of multiplayer games, or how to think about and implement player-based economies.

I wasn't even sure that I knew enough about ReactJS to justify using it. I mean, the initial interface – where I focus heavily on the server and economic aspects of the game – is perfectly suited for ReactJS. But what about when I start to make the farming /interaction aspects? I love the idea of building an isometric interface around the economic system.

I once watched a talk, by dead_lugosi, where she described building a medieval game in PHP. Margaret inspired me, and that talk was one of the things that lead to me writing a book about JS game development. I became determined to write about my experience. Perhaps others could learn from my mistakes in this case, too.

The code for this part can be found at: http://ift.tt/2nnMjfD. I've tested it with PHP 7.1 and in a recent version of Google Chrome.

Setting Up The Back-end

The first thing I searched for was guidance on building multiplayer economies. I found an excellent StackOverflow thread in which folks explained various things to think about. I got about half-way through it before realizing I may be starting from the wrong place.

"First things first; I need a PHP server. I'm going to have a bunch of ReactJS clients, so I want something capable of high-concurrency (perhaps even Web Sockets). And it needs to be persistent: things must happen even when players aren't around."

I went to work setting up an async PHP server – to handle high concurrency and support web sockets. I added my recent work with PHP preprocessors to make things cleaner, and made the first couple of endpoints:

$host = new Aerys\Host();
$host->expose("*", 8080);

$host->use($router = Aerys\router());
$host->use($root = Aerys\root(.."/public"));

$web = process .."/routes/web.pre";
$web($router);

$api = process .."/routes/api.pre";
$api($router);

This is from config.pre

I decided to use Aerys for the HTTP and Web Socket portions of the application. This code looked very different compared to the Aerys docs, but that's because I had a good idea about what I needed.

The usual process for running an Aerys app was to use a command like:

vendor/bin/aerys -d -c config.php

That's a lot of code to keep repeating, and didn't handle the fact that I wanted to use PHP preprocessing. I created a loader file:

return Pre\processAndRequire(__DIR__ . "/config.pre");

This is from loader.php

...and installed my dependencies:

"require": {
    "amphp/aerys": "dev-amp_v2",
    "amphp/loop": "dev-master",
    "amphp/parallel": "dev-master",
    "league/container": "^2.2",
    "league/plates": "^3.3",
    "pre/short-closures": "^0.3.0"
},
"require-dev": {
    "phpunit/phpunit": "^6.0"
},

This is from composer.json

I wanted to use amphp/parallel, to move blocking code out of the async server, but it wouldn't install with a stable tag of amphp/aerys. That's why I went with the dev-amp_v2 branch.

Continue reading %Game Development with ReactJS and PHP: How Compatible Are They?%

by Christopher Pitt via SitePoint