Game Development in JS/TS - The Complete Guide (w/ Phaser 3) from Udemy

What is Phaser?

Phaser is a framework for creating HTML-based games in Javascript. It’s very simple to use and get started with. It provides a full set of features to create professional games ready to be published on different platforms. Such as Facebook Instant Games, IOS, or Android platforms.

What is in the course?

During this course, you will acquire hands-on experience in developing three games entirely from scratch. The games include a clone of Flappy Bird, a well-known Dino game from Google Chrome, and a custom Platformer game. No shortcuts will be taken throughout the course, ensuring a comprehensive understanding of the development process. The curriculum encompasses JavaScript, with an added section dedicated to creating a game using TypeScript.

This course is designed to teach you how to create your own games from scratch using Javascript and the Phaser framework. Through a series of practical exercises, you will learn how to develop games that are engaging, challenging, and fun. By the end of the course, you will have created your own games that can be published on Facebook Instant Games.

The course will cover a range of important concepts in game development, including how to initialize the Phaser Game, manipulate physical concepts like gravity and velocity, create and recycle game objects, and use multiple scenes like menu, score, pause, and play. You will also learn how to create difficulty systems and keep track of scores.

In addition to these foundational concepts, the course will also teach you how to create more complex games like platformers. You will learn how to use the Tiled editor to design maps and levels, create different types of attacks like melee and projectile attacks, and animate game objects like characters and enemies. We will also cover advanced concepts like Raycasting, which will allow you to detect enemies and traps, and create a health system that triggers game over when health reaches zero.

The final project of the course will be to create a multi-level platformer game. You will learn how to unlock levels and display credits once the player reaches the end of the game. Throughout the course, you will gain valuable experience that can be applied to other game development platforms like Unity or Unreal Engine.

In conclusion, this course offers an extensive and practical introduction to game development with Javascript and the Phaser framework. Whether you're a beginner or an experienced developer, you will gain valuable insights and skills that will enable you to create your own engaging and fun games.

What's inside

Syllabus

Introduction

New game, new section

How to resolve issues

Flappy Bird Clone

Traffic lights

Read about what's good

what should give you pause

and possible dealbreakers

Begins with fundamental concepts like initializing Phaser, manipulating physics, and creating game objects, which provides a solid foundation for beginners

Teaches the use of the Tiled editor for designing maps and levels, which is a valuable skill for creating more complex and engaging games

Explores the creation of multiple scenes like menu, score, pause, and play, which are essential components in structuring a complete game experience

Focuses on Phaser, a framework for creating HTML-based games, which allows for publishing on platforms like Facebook Instant Games, iOS, and Android

Includes a section dedicated to creating a game using TypeScript, which can be beneficial for developers looking to add type safety and structure to their JavaScript projects

Covers concepts like raycasting for enemy detection and health systems, which are useful for creating more sophisticated and interactive gameplay mechanics

Reviews summary

Hands-on game dev with phaser 3

According to students, this course provides a practical and project-based introduction to game development using JavaScript and Phaser 3. Learners appreciate the clear explanations and the opportunity to build complete games from scratch, including clones of Flappy Bird and the Chrome Dino game, culminating in a platformer. Many find the hands-on coding exercises highly effective for learning. While the course is largely positive and well-structured for beginners, some mention that the pace can be fast at times, and certain sections, like TypeScript, could benefit from more depth or recent updates. Overall, it's considered a solid foundation for those looking to start making web games.

Assumes some familiarity with JavaScript.

"Definitely helps to have a basic understanding of JavaScript before starting."

"If you're completely new to JS, the coding parts might be challenging initially."

"Knowing JS fundamentals is pretty essential for following along smoothly."

"Assumes you know variables, functions, classes, etc. in JS."

Provides a strong entry point into Phaser 3.

"As a beginner, this course gave me a solid starting point with Phaser 3 and web game development."

"Perfect for someone who knows a bit of JS and wants to learn game development."

"It covers the fundamentals well enough for a beginner to get comfortable."

"I had limited game dev experience before this, and I feel much more confident now."

Concepts are explained in an easy-to-follow manner.

"The instructor explains everything very clearly, making complex topics accessible."

"I found the explanations logical and easy to follow, even when new concepts were introduced."

"Lectures are well-structured and the instructor breaks down the code effectively."

"His explanations are easy to digest for someone relatively new to game dev concepts."

Focuses on building complete, playable games.

"I really enjoyed building the three different games. It made the concepts much easier to understand and apply."

"The best part is creating actual, runnable games. It feels very practical and motivating."

"Loved the step-by-step process of building the Flappy Bird and Dino games. Great way to learn Phaser."

"Creating real projects like a platformer felt like a significant accomplishment after finishing."

TypeScript part could be expanded or updated.

"The TypeScript section felt a bit rushed compared to the main JS content."

"Could use a more in-depth look at TypeScript integration with Phaser."

"The TS part feels a little outdated or less polished than the rest of the course."

"Wish the TypeScript segment was more extensive."

Some sections move quickly, requiring rewinding.

"Sometimes the coding pace felt a bit fast, needing to pause and rewatch sections."

"The speed can be high at times, especially if you're not super comfortable with JS already."

"Had to slow down a few lectures to catch all the details."

"Some topics are covered quickly, assuming you grasp them immediately."

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 Game Development in JS/TS - The Complete Guide (w/ Phaser 3) with these activities:

Review JavaScript Fundamentals

Show steps

Solidify your understanding of JavaScript fundamentals before diving into Phaser 3. This will make grasping game logic and framework-specific concepts easier.

Browse courses on JavaScript Fundamentals

Show steps

Review data types, variables, and operators.
Practice control flow statements (if/else, loops).
Understand functions and scope.

Review 'Eloquent JavaScript'

Show steps

Supplement your JavaScript knowledge with a well-regarded book. This will provide a broader and deeper understanding of the language.

View Eloquent JavaScript, 4th Edition on Amazon

Show steps

Read the chapters on data structures and functions.
Work through the exercises at the end of each chapter.

Follow Phaser 3 Tutorials

Show steps

Gain familiarity with the Phaser 3 framework by following online tutorials. This will help you understand the basic structure and components of a Phaser game.

Show steps

Find a tutorial on creating a simple Phaser 3 game.
Follow the tutorial step-by-step, understanding each line of code.
Experiment with modifying the code to see how it affects the game.

Four other activities

Expand to see all activities and additional details

Show all seven activities

Practice Object Creation and Manipulation

Show steps

Reinforce your understanding of object creation and manipulation in JavaScript. This is crucial for managing game objects in Phaser.

Show steps

Create a series of JavaScript objects with different properties.
Practice modifying object properties and methods.
Experiment with inheritance and prototypes.

Create a Simple Game Prototype

Show steps

Apply your knowledge by creating a simple game prototype using Phaser 3. This will solidify your understanding of the framework and game development concepts.

Show steps

Plan a simple game with basic mechanics.
Implement the game using Phaser 3, focusing on core functionality.
Test and refine the game based on feedback.

Document Your Game Development Process

Show steps

Improve retention by documenting your game development journey. This will help you reflect on what you've learned and identify areas for improvement.

Show steps

Keep a journal or blog of your progress.
Document challenges you faced and how you overcame them.
Share your insights and learnings with others.

Contribute to a Phaser 3 Open Source Project

Show steps

Deepen your understanding of Phaser 3 by contributing to an open-source project. This will expose you to real-world game development practices and collaboration.

Show steps

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

Career center

Learners who complete Game Development in JS/TS - The Complete Guide (w/ Phaser 3) will develop knowledge and skills that may be useful to these careers:

Phaser Developer

A Phaser Developer is a game developer who uses the Phaser framework to create games. Given that this course centers around game development with JavaScript and the Phaser framework, it is an excellent starting point for this career path. By creating games from scratch and working through practical exercises, the course provides hands-on experience that is directly applicable to the role. Understanding how to use Phaser to manipulate physical concepts, create game objects, and manage multiple scenes is crucial for a Phaser Developer, enabling them to build engaging and functional games. The course also teaches how to create difficulty systems and keep track of scores.

See salaries and explore the career path for Phaser Developer

JavaScript Game Developer

A JavaScript Game Developer builds games using JavaScript and related technologies. Since this course focuses on game development using JavaScript, it is an excellent resource for those pursuing this path. Developing three games from scratch during the course provides practical experience, and the thorough coverage of core concepts such as manipulating game physics, creating game objects, and implementing game scenes is directly applicable to the daily responsibilities of a JavaScript Game Developer. This will give any learner the best of skills to be a capable JavaScript Game Developer.

See salaries and explore the career path for JavaScript Game Developer

Game Developer

A Game Developer is responsible for designing, coding, and debugging video games. This course, which dives into creating games from scratch using JavaScript and the Phaser framework, directly supports the core skills needed for this role. The hands-on experience gained from developing games like Flappy Bird and a platformer helps build a portfolio and demonstrates practical skills to potential employers. Furthermore, learning how to manipulate game physics, create game objects, and use multiple scenes are essential for any aspiring game developer. Learning how to use the Tiled editor to design maps and levels, create different types of attacks like melee and projectile attacks, and animate game objects like characters and enemies is a great asset.

See salaries and explore the career path for Game Developer

Game Programmer

A Game Programmer writes the code that brings a game's design to life, focusing on implementing game mechanics, AI, and other interactive elements. This course, which provides hands-on experience in developing games using JavaScript and the Phaser framework, is highly relevant to this role. The skills learned in the course, such as manipulating game physics, creating game objects, and managing game scenes, are directly applicable to the daily tasks of a Game Programmer. This could be a potential career pivot and path to programming for some.

See salaries and explore the career path for Game Programmer

Gameplay Engineer

A Gameplay Engineer specializes in implementing the interactive elements of a game, such as character controls, game mechanics, and user interfaces. This course, with its hands-on experience in developing three games from scratch using JavaScript and the Phaser framework, perfectly aligns with the responsibilities of this role. The course covers how to manipulate physical concepts like gravity and velocity, create and recycle game objects, and use multiple scenes, all of which are essential for a Gameplay Engineer. The course is designed to teach you how to create your own games from scratch using Javascript and the Phaser framework.

See salaries and explore the career path for Gameplay Engineer

HTML5 Game Developer

An HTML5 Game Developer specializes in creating games that run in web browsers using technologies like HTML5, JavaScript, and associated frameworks. This course is highly relevant, as it focuses on JavaScript and the Phaser framework, which are key tools for HTML5 game development. The course's practical projects, including the Flappy Bird clone and the custom platformer game, offer direct experience in building web-based games. The comprehensive coverage of game development concepts, such as initializing a Phaser game, handling game physics, and managing game scenes, is directly applicable to the daily tasks of an HTML5 Game Developer.

See salaries and explore the career path for HTML5 Game Developer

TypeScript Game Developer

A TypeScript Game Developer focuses on creating games using TypeScript, a superset of JavaScript that adds static typing. This course offers a dedicated section on creating a game using TypeScript, making it particularly valuable for this career path. The experience gained from working with TypeScript in a game development context, combined with the foundational knowledge of game development principles, helps prepare individuals for the specific challenges and opportunities of being a TypeScript Game Developer. Because most people don't have experience here, it makes for a potential career pivot for some.

See salaries and explore the career path for TypeScript Game Developer

Indie Game Developer

An Indie Game Developer works independently or in a small team to create and publish their own games. This course is particularly valuable for indie developers, as it provides a comprehensive introduction to game development using JavaScript and the Phaser framework. The hands-on experience of developing three games from scratch, combined with the knowledge of game development concepts, helps equip indie developers with the skills they need to bring their creative visions to life. It will also teach you how to create more complex games like platformers. You will learn how to use the Tiled editor to design maps and levels, create different types of attacks like melee and projectile attacks, and animate game objects like characters and enemies.

See salaries and explore the career path for Indie Game Developer

Mobile Game Developer

A Mobile Game Developer creates games specifically for mobile platforms like iOS and Android. This course mentions that games developed using Phaser can be published on platforms like Facebook Instant Games, iOS, and Android, making it relevant for those interested in mobile game development. The skills learned in the course, such as manipulating game physics, creating game objects, and managing game scenes, are transferable to mobile game development environments. Through a series of practical exercises, you will learn how to develop games that are engaging, challenging, and fun.

See salaries and explore the career path for Mobile Game Developer

Level Designer

A Level Designer creates the environments and layouts within a game, focusing on creating engaging and challenging experiences for players. This course can be relevant as it teaches about game design. The course’s final project involves creating a multi-level platformer game, teaching you how to unlock levels and display credits. It will enable you to design maps and levels, create different types of attacks like melee and projectile attacks, and animate game objects like characters and enemies.

See salaries and explore the career path for Level Designer

Game Designer

A Game Designer conceptualizes and designs the gameplay, rules, and overall experience of a game. While this course focuses on the technical aspects of game development, it also provides valuable insights into game design principles. Learning how to create difficulty systems, design levels, and implement engaging game mechanics enhances a Game Designer's understanding of what makes a game fun and challenging. The course mentions how to initialize the Phaser Game, manipulate physical concepts like gravity and velocity, and create and recycle game objects.

See salaries and explore the career path for Game Designer

Technical Artist

A Technical Artist bridges the gap between art and programming, optimizing art assets for use in games and developing tools to streamline the art creation process. While this course primarily focuses on programming, the knowledge of game development principles and the understanding of how art assets are used in a game engine context are beneficial for a Technical Artist. You will learn how to use the Tiled editor to design maps and levels, create different types of attacks like melee and projectile attacks, and animate game objects like characters and enemies.

See salaries and explore the career path for Technical Artist

AR/VR Developer

An Augmented Reality/Virtual Reality (AR/VR) Developer creates immersive experiences using technologies like AR and VR. While this course focuses on 2D game development, the foundational skills in game design, physics, and interactive elements can be beneficial in AR/VR development. The course's coverage of game physics, object manipulation, and scene management provides a starting point for understanding the complexities of creating immersive digital environments. You will also learn how to create difficulty systems and keep track of scores.

See salaries and explore the career path for AR/VR Developer

Software Engineer

A Software Engineer designs, develops, and tests software applications. While this course is focused on game development, the underlying principles of software engineering, such as coding, debugging, and problem-solving, are applicable. The course provides practical experience in JavaScript and TypeScript, which are widely used in software development. This may be useful to software engineers that need to develop JavaScript games or applications for use on the world wide web.

See salaries and explore the career path for Software Engineer

Web Developer

A Web Developer builds and maintains websites and web applications. This course helps build a foundation in JavaScript, a core language for web development, especially front-end development. Although the course is focused on game development, the JavaScript skills acquired can be applied to creating interactive elements and dynamic content on websites. This course may be useful to those that require a JavaScript background to develop web games.

See salaries and explore the career path for Web Developer

Game Development in JS/TS - The Complete Guide (w/ Phaser 3)

What's inside

Syllabus

Traffic lights

Save this course

Reviews summary

Hands-on game dev with phaser 3

Activities

Career center

Reading list

Share

Similar courses