Add blog post Project1 Part1
Nathan Steel
1 year ago
parent
3c226159da
commit
1c7c674215
@ -0,0 +1,76 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta name="description" content="">
|
||||||
|
<meta name="author" content="Nathan (Aney) Steel">
|
||||||
|
<meta name="theme-color" content="white">
|
||||||
|
<meta name="theme-color" content="green">
|
||||||
|
<link rel="stylesheet" type="text/css" href="/main.css">
|
||||||
|
<link rel="icon" type="image/png" href="/images/favicon.svg">
|
||||||
|
<title>Project 1: The Stack, and Rooms</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<a href="#main" class="vh">Jump directly to main content</a>
|
||||||
|
<h1>Project 1: The Stack, and Rooms</h1>
|
||||||
|
<input id="burger-toggle" type="checkbox"/>
|
||||||
|
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>
|
||||||
|
<hr/>
|
||||||
|
<nav>
|
||||||
|
<a href="/">home</a>
|
||||||
|
<a href="/about.html">about</a>
|
||||||
|
<a href="/projects.html">projects</a>
|
||||||
|
<a href="/blog/">blog</a>
|
||||||
|
<a href="/sitemap.html">misc</a>
|
||||||
|
<a href="/support.html">support</a>
|
||||||
|
</nav>
|
||||||
|
<hr/>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main id="main">
|
||||||
|
<p>The plan is to make a multiplayer PvP game, with defined turns, and per-player customisable elements.
|
||||||
|
I'm being a little vague, but I'm sure you can figure it out from that.</p>
|
||||||
|
|
||||||
|
<h2>The Stack</h2>
|
||||||
|
<p>First I needed to select a stack I could use for this, with decent documentation to starting off an async multiplayer experience.</p>
|
||||||
|
<p>After looking about I landed on a JS stack consisting of JS, and HTML Canvas for the front-end, and JS, NodeJS, SocketIO, and MySQL for the back-end. This stack should allow me to work on the game itself, rather than look into TCP interfacing (which may be simple, but I have enough stuff on at current to not want to look into this, at least for the time being).</p>
|
||||||
|
|
||||||
|
<h2>Rooms</h2>
|
||||||
|
<p>To get the swing of the multiplayer aspect, I opted to start with rooms.
|
||||||
|
Well that, and the Socket.IO guide I used to start this off with had basic room functionality (add player to room, start the game, etc).</p>
|
||||||
|
|
||||||
|
<h3>What is a Room?</h3>
|
||||||
|
<p>
|
||||||
|
A room/instance (in my project at least), is a means to have multiple game instances running on the same server. Since there will be XvX players during a game, but there can be more than 2X players on the server, the servers resources can be better utilised by running many smaller instances, that manage themselves on the host.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h3>Current Room Functionality</h3>
|
||||||
|
<p>
|
||||||
|
Each room will eventually manage the state of the game being played in said room. For the time, I currently have a room in the most basic form, it has a count of the players in said room, a specific (non-unique) identifier, and name. As I mentioned, very basic, but it sets the field for what will be needed in the future.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Along with the room itself, I have a number of helper functions that are triggered in the client with socket emits, and return data to the client from the server with socket.to, and socket.on.
|
||||||
|
</p>
|
||||||
|
<p>These helper functions include:</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>Requesting all existing rooms</li>
|
||||||
|
<li>Creating a new room (if there is space to do so)</li>
|
||||||
|
<li>Joining an existing room via ID (again if there is space to do so)</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
The first two are near-final I assume, but joining a room currently just uses a numeric counter to log the players already connected, so it allows the same player to join the same, and multiple different rooms at the same time. This will be changed later down the line, but for now there's a decent proof-of-concept to show me that what I want it feasible without too much difficulty.
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<hr/>
|
||||||
|
<p>Written by <a href="https://aney.co.uk" target="_blank" rel="noopener">@aney</a> with <a href="https://danluu.com/web-bloat/" target="_blank" rel="noopener">web bloat</a> in mind | <a href="https://github.com/Aney/website" target="_blank" rel="noopener">Source Code</a></p>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
Loading…
Reference in New Issue