Create a Survival Game in Javascript with Phaser 3 from Udemy

If you need to practise your javascript...

If you want to learn some new ES6 stuff...

If you have ever wanted to create a survival game...

Then this course is for you.

You will get experience using:

ES6
Classes
Arrays
Objects
Functions
Phaser 3
Tiled
Animation
Spritesheets

Creating a survival game is fun and a great way to learn some Javascript and Phaser fundamentals.

The game includes:

Animations
Basic Enemy AI
Audio
Mouse & Keyboard Input Handling
Advanced Matter Physics

Full source code is included.

I hope you enjoy the course.

About me

I've been developing games using Unity3D for over 7 years now. I currently have ten games published on the Android app store. My first game I ever wrote, 'Isle Survive', has had over 1 million downloads and an average rating of 4 out of 5. I have also written numerous Unity plugins to enable adding features to mobile games like advertising banners and 'In-App' purchasing.

Account packages, haulage systems, mainframe processors, websites... I've done all sorts of programming but now I try to write games and it is so much more fun.

I still remember how excited I was, getting my ZX81 and writing my first few lines of BASIC. Yes I'm that old...

I love how the barrier of entry to game development has been lowered these past few years. I'm sure this has a lot to do with the current indie game explosion and I'm very excited for the future.

Why not join my discord server and say hello?.

What's inside

Syllabus

Introduction

The Survival Game

Getting Started

Software

IMPORTANT!!!

Due to changes in the matter physics plugin, you will need to make the follwoing changes:

In survival-game.js add .default to the end of the plugin line:

plugins: { scene: [ { plugin: PhaserMatterCollisionPlugin.default, key: 'matterCollision', mapping: 'matterCollision' } ] }

In index.html use the latest version of phaser by changing the phaser script line src to:

src="https://cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"

In this video we start off in Visual Studio Code and create our project folder that will contain our game.

We use the Terminal in VS Code to do this but if you are using Windows you may run in to problems changing to another drive since I use:

cd /d

To change to the D drive

However I can do this since I am using 'bash' as my terminal shell, for a standard Windows command shell or powershell you will need to use:

To change to the D drive

If you want to use bash in windows there are various options but the simplest is probably to install Git for Windows since you will probably want to use / learn git if you are a web developer.

https://gitforwindows.org/

Traffic lights

Read about what's good

what should give you pause

and possible dealbreakers

Provides hands-on experience with ES6, classes, arrays, objects, and functions, which are fundamental concepts in JavaScript programming

Includes full source code, which allows learners to immediately apply what they've learned and adapt the game to their own projects

Requires learners to make changes to the code due to updates in the Matter physics plugin, which may be confusing for beginners

Explores the creation of a survival game, which is a popular genre and a great way to learn game development fundamentals

Covers animation, basic enemy AI, audio, and input handling, which are essential elements in game development

Uses Phaser 3, a specific version of the Phaser framework, which may require learners to adapt their knowledge to newer versions in the future

Reviews summary

Build a survival game with phaser 3

According to learners, this course offers a highly practical, project-based approach to game development, focusing on creating a complete survival game using JavaScript and Phaser 3. Students appreciate the opportunity to apply JavaScript fundamentals and learn Phaser 3 basics through hands-on coding. While the course provides a solid introduction, some learners note that getting started requires careful attention to setup, particularly regarding library updates mentioned in the syllabus. Overall, it appears to be a well-received path for those looking to build their first game.

Accessible introduction to game dev.

"This course is great for someone building their first game in Javascript."

"As a beginner in game development, I found the pace manageable."

"It might be a bit basic if you already have experience with Phaser or game engines."

"A solid starting point for diving into game creation."

May require manual library updates.

"Had a bit of trouble getting the project running initially due to Phaser version issues, but the instructions in the syllabus helped."

"Make sure you follow the setup instructions carefully, especially the notes about updating the libraries."

"It was helpful that the course explicitly mentioned which libraries needed updating."

"Setting up the project took a little longer than expected."

Introduction to Phaser 3 game engine.

"Good introduction to Phaser 3, covers the essential concepts needed to get started."

"Helped me understand how to use Javascript specifically for game development with Phaser."

"The course covered key Phaser features like sprites, animations, and physics."

"Provides a functional overview of Phaser 3."

Build a complete game end-to-end.

"I loved building the game piece by piece, it really helped solidify everything."

"The project-based approach was great; I learned so much by actually coding a game."

"Finally have a working game! This course made it achievable."

"Building the survival game was very engaging and practical."

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Create a Survival Game in Javascript with Phaser 3 with these activities:

Review JavaScript Fundamentals

Show steps

Strengthen your understanding of core JavaScript concepts like variables, functions, objects, and arrays before diving into the course. This will make learning Phaser 3 and ES6 syntax easier.

Browse courses on ES6

Show steps

Review basic JavaScript syntax and data types.
Practice writing functions and working with objects.
Familiarize yourself with ES6 features like arrow functions and classes.

Eloquent JavaScript, 3rd Edition

Show steps

Use this book to solidify your JavaScript knowledge, especially regarding ES6 features. It provides a solid foundation for understanding the game development concepts taught in the course.

View Melania on Amazon

Show steps

Read the chapters on data structures and functions.
Work through the exercises at the end of each chapter.
Focus on the sections covering ES6 features.

Phaser 3 Tutorials

Show steps

Follow online tutorials to get hands-on experience with Phaser 3. This will help you understand the framework's structure and how to create game elements.

Show steps

Search for Phaser 3 tutorials on creating basic game scenes.
Follow a tutorial on adding sprites and handling input.
Experiment with different Phaser 3 features and configurations.

Four other activities

Expand to see all activities and additional details

Show all seven activities

Phaser 3 Physics Examples

Show steps

Practice implementing different physics scenarios using Phaser 3's physics engine. This will help you understand how to create realistic and engaging game mechanics.

Show steps

Explore Phaser 3's physics examples and documentation.
Create a simple game scene with physics-based movement.
Experiment with different physics properties and constraints.

Create a Simple Phaser 3 Game

Show steps

Build a small, independent game using Phaser 3 to solidify your understanding of the framework and game development principles. This will reinforce the concepts learned in the course.

Show steps

Plan a simple game with clear objectives and mechanics.
Implement the game logic and create the necessary assets.
Test and refine the game to ensure it is fun and engaging.

Document Your Game Development Process

Show steps

Create a blog post or video series documenting your experience building the survival game. This will help you reflect on your learning and share your knowledge with others.

Show steps

Record your screen while developing the game.
Write a blog post summarizing your key learnings and challenges.
Share your content on social media and online forums.

Contribute to a Phaser 3 Project

Show steps

Contribute to an open-source Phaser 3 project to gain experience working with a larger codebase and collaborating with other developers. This will expose you to best practices and advanced techniques.

Show steps

Find an open-source Phaser 3 project on GitHub.
Identify a bug or feature that you can contribute to.
Submit a pull request with your changes.

Career center

Learners who complete Create a Survival Game in Javascript with Phaser 3 will develop knowledge and skills that may be useful to these careers:

HTML5 Game Developer

An HTML5 game developer creates games that run in web browsers using HTML5, CSS, and JavaScript. This course is directly relevant as it focuses on building a survival game using JavaScript and Phaser 3, a popular framework for HTML5 game development. HTML5 game developers who wish to refine their skills will benefit from this course. The course provides practical experience in animations, AI, audio, and input handling. Learning to create a game with HTML5 technologies enhances a developer's ability to create engaging and interactive web-based games.

See salaries and explore the career path for HTML5 Game Developer

Game Developer

A game developer designs and creates video games for various platforms. This course helps game developers by providing practical experience in JavaScript game development using Phaser 3. The course specifically focuses on creating a survival game, which involves implementing features like animations, basic enemy artificial intelligence, audio, and input handling. Someone looking to become a game developer should take this course in order to solidify their JavaScript and Phaser 3 skills. Furthermore, gaining experience with ES6 features, classes, arrays, objects, and functions is invaluable for any game developer.

See salaries and explore the career path for Game Developer

Indie Game Developer

An indie game developer works independently or in a small team to create and publish video games. This course benefits indie game developers by offering a practical guide to building a survival game using JavaScript and Phaser 3. Indie game developers often need to be proficient in all aspects of development, and someone working on this role can use this course to gain valuable experience in game mechanics, animation, AI, and audio integration. Learning to create a complete game from scratch provides invaluable experience. Moreover, the course provides a solid foundation for further exploration of indie game development.

See salaries and explore the career path for Indie Game Developer

Mobile Game Developer

Mobile game developers specialize in creating games for mobile platforms, such as iOS and Android. This course helps mobile game developers by providing a foundation in JavaScript game development using Phaser 3, which can be used to build games for the web and mobile (using frameworks like Cordova or Ionic). The course's exploration of animations, basic Artificial Intelligence, audio integration, and input handling is also very relevant. Aspiring mobile game developers can use this course to quickly prototype and develop game mechanics. Furthermore, learning JavaScript and Phaser fundamentals can be a stepping stone to using more advanced mobile game engines like Unity.

See salaries and explore the career path for Mobile Game Developer

Game Designer

Game designers conceptualize and design video games, defining gameplay mechanics, story, and user experience. This course helps aspiring game designers by providing hands-on experience in creating a survival game using JavaScript and Phaser 3, allowing designers to understand the practical aspects of game development. Working through the creation of animations, enemy AI, and input handling gives designers insight into the technical challenges involved in game design. Learning to build a game from scratch helps game designers translate their ideas into reality. The knowledge gained about how to create animations, basic artifical intelligence, and handle user input will make the game designer more effective.

See salaries and explore the career path for Game Designer

JavaScript Developer

JavaScript developers build and maintain web applications using JavaScript. This course helps JavaScript developers strengthen their core skills and explore advanced concepts by creating a survival game using Phaser 3. The course's focus on ES6, classes, arrays, objects, and functions provides a practical way to improve JavaScript proficiency. Any JavaScript developer can benefit from this project-based approach to learning. Furthermore, the experience with game development principles and animation techniques enriches a developer's skill set.

See salaries and explore the career path for JavaScript Developer

Educational Game Developer

Educational game developers design and create games for educational purposes, often aimed at children or students. This course may be useful for educational game developers, giving them practical experience in JavaScript game development using Phaser 3. The course's focus on creating a survival game helps developers learn to implement core game mechanics and engaging features. Someone seeking to become an educational game developer can use this course to build a foundation in game design and development. Furthermore, this skillset can be applied to creating interactive and educational experiences.

See salaries and explore the career path for Educational Game Developer

Front-End Developer

A front end developer implements the user interface and user experience of websites and web applications. This course helps front end developers learn to work with JavaScript and frameworks like Phaser 3. The course's focus on animation and user input helps front end developers build interactive web experiences. For someone seeking to specialize in interactive front end development, this course can be a great starting point. It provides a hands-on project that showcases skills with JavaScript and game development principles, which are transferable to general front end development.

See salaries and explore the career path for Front-End Developer

Software Engineer

Software engineers design, develop, test, and evaluate software applications and systems. While this role is broad, this course may be useful for those interested in game development or front end development. The experience with JavaScript, ES6, and Phaser 3 is directly applicable. Working with animations, handling input, and implementing game logic helps build a foundation in software development principles. Someone seeking to become a software engineer may find this course to be a practical project-based way to enhance their coding skills. Learning to create a survival game from scratch provides valuable problem-solving and software design experience to the software engineer.

See salaries and explore the career path for Software Engineer

Software Developer

Software developers write, test, and maintain software applications. This course may be useful for software developers who want to expand their skills into game development or interactive web applications. Software developers will find that the course helps them strengthen their JavaScript skills and learn about game development concepts using Phaser 3. The focus on ES6, classes, and object-oriented programming provides valuable experience in software design. Taking this course helps developers build a project-based portfolio piece. Further enriching their understanding of software development principles.

See salaries and explore the career path for Software Developer

Unity Developer

Unity Developers use the Unity game engine to create 2D and 3D games. This course may be useful for Unity developers, as it helps them build a foundation in game development principles using JavaScript and Phaser 3. The course introduces fundamental concepts like animations, AI, input handling, and game logic, which are transferable to Unity game development. A Unity developer can use this course to broaden their understanding of game design. Furthermore, the experience with JavaScript and game mechanics provides a valuable perspective when working with Unity's C# scripting language.

See salaries and explore the career path for Unity Developer

Technical Artist

Technical artists bridge the gap between artists and programmers in game development, optimizing art assets and implementing visual effects. This course may be useful for technical artists, helping them understand the technical aspects of game development using JavaScript and Phaser 3. The course's exploration of animations and game mechanics provides technical artists with insight into the implementation of visual elements. Someone seeking to become a technical artist might benefit from this course. Furthermore, the acquired knowledge enhances their ability to collaborate with programmers and optimize game performance.

See salaries and explore the career path for Technical Artist

Full-Stack Developer

Full stack developers work on both the front end and back end of web applications. This course may be useful for full stack developers who want to improve their front end skills, particularly in interactive content and game development. The course's focus on JavaScript, ES6, and Phaser 3 helps full stack developers create engaging user interfaces and game-like experiences. Full stack developers can use this course to expand their skillset. Furthermore, this provides a practical project to showcase their abilities in front end development.

See salaries and explore the career path for Full-Stack Developer

Web Developer

Web developers create and maintain websites, ensuring they are functional and user-friendly. While not directly web development focused, this course may be useful to web developers looking to expand their skills into interactive web content. The course helps web developers learn JavaScript, ES6, and game development principles, which can be applied to create engaging web experiences. Someone seeking to become a web developer may find this course beneficial as a project-based learning experience. The knowledge gained can enhance a developer's ability to create interactive components and animations for websites.

See salaries and explore the career path for Web Developer

Creative Coder

Creative coders use programming languages to create interactive art installations, visual effects, and other digital experiences. Though not focused on creative coding, this course may be useful to creative coders wanting to use JavaScript to craft unique interactive experiences. The course helps creative coders learn JavaScript, ES6, and Phaser 3, providing tools to create animations and interactive elements. Someone wishing to become a creative coder may find this course useful. Furthermore, the course may help them to explore the intersection of game development and artistic expression.

See salaries and explore the career path for Creative Coder

Create a Survival Game in Javascript with Phaser 3

Here's a deal for you

What's inside

Syllabus

Traffic lights

Save this course

Reviews summary

Build a survival game with phaser 3

Activities

Career center

Reading list

Share

Similar courses