Phaser3

 

What is Phaser?

Phaser is a popular HTML5 videogame development framework. It is free, open source, and fun to learn.

What does it do?

Let's say you are ready to make a game. You have a name picked out. You have designs ready. But before you can code something, even a little bit playable, there is a lot of foundation work that needs to be built.

You will need code that can handle sprite sheets and animations, code to handle events, like controls and collision detection. You may want sounds and music, so you need code that can take care of that. All of this, and more, will need to be coded by you first before you can make your playable game. Or you can use a fast, reliable framework that is already built for you.

Phaser is one such framework and you can download it from this link https://phaser.io/download/stable.

I recommend clicking on the file tab labeled "min.js".

Once you have downloaded the source code, then you will need to set up a server on your computer.

The server is needed to test your Phaser game project. There is free server software available to download and learn. Do a Google search for "free web server" or check out this link https://en.wikipedia.org/wiki/Category:Free_web_server_software.

If you are curious what I use... I have PHP installed on my computer and I use it's built-in server.

So, if you have your server all set up and you have downloaded Phaser3, then you are ready to continue on to the Phaser tutorial.

Phaser3 Tutorial

But if you still need a little help, then I will walk you through the process of what I have done on my computer. Then you too can test your Phaser games.

PHP is a server-side scripting code used with web development. It does not have a complete server, so you can not host a website with it, but it does have just enough of a server to allow complete testing of your code projects.

Download PHP at this link https://www.php.net/.

Install and then test to see that PHP is installed correctly by launching the command prompt and typing "PHP -version".

C:\>PHP -version

If it is working you should see a message like this one.

C:\>PHP -version
PHP 7.4.10 (cli) (built: Sep  1 2020 16:52:39) ( ZTS Visual C++ 2017 x64 )
Copyright (c) The PHP Group
Zend Engine v3.4.0, Copyright (c) Zend Technologies

Now you have PHP installed. To launch the server, type this into the command prompt, "php -S localhost:8080".

C:\>php -S localhost:8080

Then you should see a message that says the server is started.

C:\>php -S localhost:8080
[Wed Jul 20 15:21:08 2022] PHP 7.4.10 Development Server (http://localhost:8080) started

This is good. It means the server is running.

Next, open your web browser. In the address bar type, "localhost:8080". Then a webpage should open up.





 Excellent, everything is working perfectly. So, why did we get this page that says resource not found?

Well, we haven't made anything to display yet, of course.

So for our final test, let's make something for our server to display.

Create a folder and name it "test". Inside the folder, create a web document called "index.html".

It is important to name it "index.html" because the PHP server only looks for a file called "index".

Inside the index.html file, paste this code.

<!doctype html>

<html>

<head>


<title>Test</title>

</head>

<body>


This is a test.


</body>

</html>

Then save it.

Next, we start the server from the command prompt. This time, use this command.

C:\>php -S localhost:8080 -t c:\test

Now with the server running, type "localhost:8080" into your web browser and see what happens.

If all went well, you should be looking at your test web page. It should be running just as if you were visiting it like any other website.

Congratulations! You are now ready to make a Phaser3 game project. And you have all you need to be able to test your Phaser3 code.

On to the Phaser3 tutorials.

Phaser3 Tutorial

Comments

Popular Posts