Hi, I am brand new to trying phaser aswell as JS, i have touched on html and css but do not really know a lot about it. I want to basically learn by doing, so wanted to copy one of the game examples on the phaser site, and edit stuff on that and see how it all works. But I can not figure out how to download the entire thing. I have downloaded all the games but the files are only js files, so I do not know how to get that to work. Does anyone know if there is a way i can get the javascript files as well as the html, css etc?
Phaser is all JS! It injects a “canvas” element INTO an existing page (with css, html, other javascript, etc).
If you just want to mess around with changing some code in the games and examples to get a feel for it, hit the “Edit” button that’s below each example - this will open up a sandbox editor where you can change the code and hit “Run Code” to refresh the game and see your changes in action.
The edit button looks like this, just below the game canvas, and above the code viewer:
You can even hit “Save” in the editor and your altered code will be saved between page views, but it’s saved locally to a database in your browser, so you’ll only see your saved changes from that same browser.
For something a liiiittle more permanent, you could make a CodePen. There are lots of examples of this on the forums, it seems to be a popular way for people here to share examples with each other. Here’s an empty Phaser template I made in CodePen you could use as a baseline to add to or copy-paste code into:
After that, you’ll have to dig in and set up a web server to develop locally. Phaser has a Getting Started Guide, but if you google around there are some good boilerplates that other people have made that will do a lot of the legwork for you.
Phaser kind of assumes you have some decent JavaScript knowledge, but I agree that it is indeed a fun way to learn! If you have any more trouble getting started, feel free to continue this thread.
And if anyone else out there has some good examples of free web-based sandbox editors for Phaser, I’m sure that could be helpful!
Hi, Thank you for the reply. I see the edit button now on the examples, for some reason it does not show on the game examples that I was looking at. I will just use those examples that I can edit, hopefully will be able to learn enough from them.
Think I will try setting up the web server locally that you spoke of. That seems like it could be interesting and a good step to take
There are tons of great tutorials out there, but also know that there are a LOT of ways to do the same thing, from game logic to just setting up a web server. Don’t be too intimidated by all the choices at first, just pick one and get something working - you’ll figure out what works best for you as you go along!
Have fun!
Download photonstorm/phaser3-examples, unzip, then run a web server in that folder.