Developing Phaser 3 Games Locally
Phaser 3 Done Locally:
Phaser 3, the latest version of Phaser.js, is a game framework built with JavaScript that allows you to create games using HTML, a little bit of CSS, and JavaScript. This article will provide you a video walkthrough for developing games on your local computer with written steps below. So, if you came here because you’ve taken the Game Development with Phaser.JS course and you want to start creating games locally on your own computer, you’ve come to the right place! Below are the written steps for you to get started and there are also videos guides for both Mac and Windows devices:
Learn Game Development with Phaser.js
Learn about the HTML5 game development framework that makes writing browser-based games a breeze.Try it for freeDeveloping a Single Scene Game using Phaser:
We recommend using Visual Studio Code (VSCode) in this tutorial. If you don’t have it and need help install VSCode, you can find a more in-depth tutorial in our article about installing VSCode.
Open VSCode and install the “Live Server” plugin.
Use VSCode to open your game files, in this case, we have a game.js and index.html. If you want the simple game used in the tutorial, here is the download link.
Click the “Go Live” button at the bottom of VSCode to start a server on port 5500. This will also prompt your browser to open a new window/tab that loads your index.html file.
Make changes to your game files and save the file to automatically refresh your HTML page and see the changes you’ve made.
When you’re done with editing your game, click the button that contains the port number of your server (by default it’s 5500) that will shut down the server.
Use the knowledge you’ve accumulated here to level up your own game development skills!
Development for Mac:
Development for Windows:
'The Codecademy Team, composed of experienced educators and tech experts, is dedicated to making tech skills accessible to all. We empower learners worldwide with expert-reviewed content that develops and enhances the technical skills needed to advance and succeed in their careers.'
Meet the full teamRelated articles
- Article
HTML5 Game Development with Phaser
Learn about HTML5 game development with one of the most popular frameworks, Phaser! - Article
Spinning Up A Local Server
Configure your computer to serve content from `localhost` using the Live Server extension and VS Code. - Article
What Different Kinds of Programmers Do
Get quick insights into what different types of programmers do and what their work is like!
Learn more on Codecademy
- Free course
Learn Game Development with Phaser.js
Learn about the HTML5 game development framework that makes writing browser-based games a breeze.Intermediate7 hours - Free course
Learn Phaser.js: Fundamentals
Learn about the HTML5 game development framework that makes writing browser-based games a breeze.Intermediate2 hours - Free course
Learn Phaser.js: Animations and Visuals
Make your Phaser game stand out visually using animations and camera effects.Intermediate2 hours