Starting developing HTML5 Game is very confusing

I would like to start developing a “simple” game with HTML5, and I'm quite confused by the many resources I found on the Internet. I have solid development experience, but in completely different environments (ironically, I started programming because I wanted to become a game developer, and this is the only thing I've never done in 13 years ...).

The confusion stems from the fact that although I know JavaScript very well and I have some knowledge of HTML5, I cannot figure out how to mix what I know with all these new things. For example, here is what I thought:

  • The game will be a chess implementation. I have a simple "ready-made" AI algorithm that I can use for a single player; the goal here is to study the development of HTML5 games, so this part is not very important at the moment.
  • I would like to create a site around the game. For this, I would use a “regular” CMS, since I know that many of them already exist, and it would be faster to make it out.
  • Then I would have the game itself, which in its "stand-alone" version has nothing to do with the website, because, as I understand it, it will live on one page by itself. This is the first question : how to make the game aware of the user's session? The input will be handled by the CMS (this should be much simpler, since User Managememt is already implemented).
  • As a next step, I would like to move the AI ​​to the server. This is the second question : how to make the game send actions from the server to the server, and how do I get the answer?
  • Later I would like to add a PVP element to the game, i.e. one against one multiplayer (for example, good old chess). This is the third question : how to send information from the client to another, and continue the conversation. For this, people recommended that I take a look at Node.js, but this is another element that I can’t understand how to “stick” to the rest.

    Here is an example of one action in a PVP session that already gives me a headache: Player 1 sends his move to the server (how does the game speak with Node.js?). I need to determine the identifier of the game (where and how to save it?), And make sure that the player has not changed it manually, so it will not interfere with the game with someone else (how?).

I know that everything I wrote is very dirty, but that’s exactly how I feel at the moment. I can’t figure out where to start, so any suggestion is very welcome.

+4
source share
3 answers

Too many things and probably in the wrong order.

Many problems do not seem to me particularly related to HTML5 in the first case.

Start with the obvious thing - you need one page (mostly a javascript application) that plays chess, so create one. If you cannot build it, then the rest essentially does not matter, if you can build (and I have no doubt that you can), then the rest is building on this possibility.

So, we get to your first question - well, the moment you load the page, you will have a session, its web page, like any other web page, so you get a session. If you are offline, you save it from the moment you were online, in any way - presumably local storage.

Do you want to move the AI ​​to the server? So, make sure that interaction with the external interface speaks of an “interface” for recording the player’s movement and receiving AI movements. Given this separation, you can replace the AI ​​on the ajax client (although I would expect x to be json!) It will invoke a server with the same parameters.

It gets better if you want to play player with the player, you just talk about routing through the server from one user / player to another user / player - the front-end code should not change, the server just makes ajax at the far end.

But all this, take a step back and solve problems, one at a time - if you do what you have to arrive, where you want to go without driving yourself nuts try to worry about a bucket of problems that seem scary that you probably can it’s easy to solve one at a time, and I would start running your game on my own in a browser.

+2
source

About the first question: you could give the user a signed cookie. For instance. create a cookie containing its user ID or so and the SHA2 hash of its user ID, as well as a secret long salt (for example, a salt of 32 bytes or so). About the second question: to exchange things and call remote functions, I would use the RPC dnode library. About the third question: use the same thing to call methods between clients.

Client code (example only):

DNode.connect(function (remote) { this.newPeer = function(peer) { peer.sendChatMessage("Hello!"); }; }); 

You do not need to use game identifiers if you use dnode - only manual functions for the browser related to the game. If you need identifiers for some reason, use the UUID module to create long, random ones - they are incontrovertible.

+1
source

When I first started learning HTML5 for game development, it was very confusing, I watched a lot of lessons, but none of them gave me a basic overview until I found this YouTube channel: https://linkrex.net/PnYdtvI, this really helps me a lot

After you click on the link, you will see a 5s ad that you can click on the skip button, and then you will see a tutorial, I'm sure this tutorial will help a lot

0
source

All Articles