Hey Folks,

Today we start a new tutorial series. We will learn how to write our very first HTML5 Game with Canvas, HTML5 and javascript. So lets get ready to start =D

Preparation

First of all we need something to test. I have installed apache2 on my linux box. Thats the best way to test, because all we need to do is open a browser window, type localhost/game and start playing. So get apache2 from here and install it on your box.

The second step we do is heading to the html directory and create a new folder called game. In my case i do:

$ cd /var/www/html

$ mkdir game

Now i got a brand new unused folder to create our nice game.

All of my projects have the same structure.

Name

|->main files

|->gfx (folder)

+->sfx (folder)

In the root of the directory, i store nearly all files of the project. When i am coding a desktop game with c++ or something like that. HTML5-Games only contain the index.html on the root. Code files a separat stored in a js folder and additionally i also create a css folder in the game directory.

Last but not least we create a html file called index.html with following content.

<html>
	<head>
		<title></title>
		<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="js/angular.min.js"></script>
	</head>
	<body>
	</body>
</html>

So thats all for today. In the next tutorial we will learn we will create a canvas object and wirte a small hello world like script.

[HowTo] HTML5 Game tutorial Part 1 | Preperation

Hey Folks,

Preparation

Ok folks, stay tuned and interested. We will read us on the next tutorial.