# Phaser

Phaser is an open-source HTML5 2D game framework and JavaScript library for creating browser games, with WebGL and Canvas rendering.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Building a Simple Tetris Game with Phaser, React, and Zustand

DevFeed: [Building a Simple Tetris Game with Phaser, React, and Zustand](<https://devfeed.tech/articles/really-easy-tetris-40770.md>)

Original publisher: [Read original article](<https://eieio.games/blog/really-easy-tetris>)

Author: Nolen Royalty (eieiogames@gmail.com)

Published: 2026-02-27T00:00:00Z

Content type: opinion

Language: en

Sources: [eieio.games](<https://devfeed.tech/sources/eieio-games.md>)

Topics: [Phaser](<https://devfeed.tech/topics/phaser.md>), [Game engine](<https://devfeed.tech/topics/game-engine.md>), [React](<https://devfeed.tech/topics/react.md>), [Zustand](<https://devfeed.tech/topics/zustand.md>), [JavaScript](<https://devfeed.tech/topics/javascript.md>), [Programming](<https://devfeed.tech/topics/programming.md>)

Tags: [game](<https://devfeed.tech/tags/game.md>), [games](<https://devfeed.tech/tags/games.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [react](<https://devfeed.tech/tags/react.md>), [updates](<https://devfeed.tech/tags/updates.md>)

### AI overview

The author describes making a simplified Tetris game using only I-block pieces to explore the Phaser game engine. The article explains how Phaser handles gameplay while React renders the surrounding UI, with Zustand sharing state between them, and reflects on Phaser's trade-offs compared with larger engines such as Godot and Unity.

### Source excerpt

tetris, but you only get the good pieces

## Creating the Art for Gopher Kart

DevFeed: [Creating the Art for Gopher Kart](<https://devfeed.tech/articles/creating-the-art-for-gopher-kart-22136.md>)

Original publisher: [Read original article](<https://www.ardanlabs.com/blog/2018/08/creating-the-art-for-gopher-kart.html>)

Published: 2018-08-14T00:00:00Z

Content type: article

Language: en

Sources: [William Kennedy](<https://devfeed.tech/sources/william-kennedy.md>)

Topics: [browser-game](<https://devfeed.tech/topics/browser-game.md>), [Phaser](<https://devfeed.tech/topics/phaser.md>), [Pyxel](<https://devfeed.tech/topics/pyxel.md>), [JavaScript](<https://devfeed.tech/topics/javascript.md>), [Canvas](<https://devfeed.tech/topics/canvas.md>), [Framework](<https://devfeed.tech/topics/framework.md>)

Tags: [animation](<https://devfeed.tech/tags/animation.md>), [ardan-labs](<https://devfeed.tech/tags/ardan-labs.md>), [blog](<https://devfeed.tech/tags/blog.md>), [browser](<https://devfeed.tech/tags/browser.md>), [canvas](<https://devfeed.tech/tags/canvas.md>), [games](<https://devfeed.tech/tags/games.md>), [go](<https://devfeed.tech/tags/go.md>), [go-programming](<https://devfeed.tech/tags/go-programming.md>), [golang](<https://devfeed.tech/tags/golang.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [pixel-art](<https://devfeed.tech/tags/pixel-art.md>), [programming](<https://devfeed.tech/tags/programming.md>)

### AI overview

The article describes creating the art and game assets for Gopher Kart, a browser-based coin-collection game developed for the Gopher community. It discusses the shift from vector illustrations to pixel art, the use of Pyxel Edit, Phaser, and canvas, and the creation and animation of Gopher sprites and obstacles.

### Source excerpt

In the months leading up to GopherCon, my wife Jamilet and I had come up with the idea of creating a "small" browser-based game for the convention using the racing theme. Neither of us had ever worked on a game before and we had no idea what was involved. However, we knew we wanted to design and build something special for the awesome Gopher community. The original idea was to create a game where Gophers raced each other around a track. We looked into how much time that would take and realized working part time meant we wouldn't finish the game in time. So we decided to build a game that was simpler and settled on a coin collection game.

## How FINN Built a Motion-Controlled Flappy Cat Game

DevFeed: [How FINN Built a Motion-Controlled Flappy Cat Game](<https://devfeed.tech/articles/flappy-cat-32016.md>)

Original publisher: [Read original article](<https://tech.finn.no2017/07/19/flappy-cat/>)

Author: Pernille Celia Sethre, Gunn Skinderviken

Published: 2017-07-19T16:58:36Z

Content type: tutorial

Language: en

Sources: [Finn.no](<https://devfeed.tech/sources/finn-no.md>)

Topics: [Phaser](<https://devfeed.tech/topics/phaser.md>), [Game Development](<https://devfeed.tech/topics/game-development.md>), [JavaScript](<https://devfeed.tech/topics/javascript.md>), [Node.js](<https://devfeed.tech/topics/node-js.md>), [SDKs](<https://devfeed.tech/topics/sdks.md>)

Tags: [game](<https://devfeed.tech/tags/game.md>), [game-development](<https://devfeed.tech/tags/game-development.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [node-js](<https://devfeed.tech/tags/node-js.md>), [sdk](<https://devfeed.tech/tags/sdk.md>)

### AI overview

FINN's search team describes building Flappy Cat, a motion-controlled Flappy Bird-style game for its JavaZone stand. The project used Phaser for the JavaScript/HTML5 game, Kinect gesture recognition, and a Node.js server endpoint that triggers a flap.

### Source excerpt

Why make a Flappy Cat game? The Idea was to make a Flappy Bird with motion tracking control for our JavaZone stand. Some quick research told us it should be possible. Since cats are assosiated with FINN, it of course became a Flappy Cat game. Come and try it at JavaZone in September. Made by search team. How we made it Step 1: Make the game. As neither of us are game developers, we found this flappy bird tutorial online that we decided to follow. This tutorial uses Phaser, an open source JavaScript/HTML5 game development framework. It was easy to follow and it explained all the steps in detail, so even the most back-end heavy developer in our team had no problem writing his first JavaScript game. Step 2: Buy the motion tracker. We chose Kinect as we found videos on YouTube of people doing exactly what we wanted to do with the Kinect sensor. We only had one day to do this project, so this was not the time to reinvent the wheel. Step 3: Tweaking one of the example apps that was included in the Kinect 2.0 SDK. We found an app that was made to do something when it detected a gesture. This was perfect for our purpose. We recorded our desired gesture, "the flap", in Kinect Studio and used Visual Gesture Builder (also included in the SDK) to build a database of our gesture. We then used this gesture database in the example app and suddenly we could recognize a flap! Now, all we needed was for something to happen when a flap was registered. Step 4: Creating a simple Node.js server that could not only serve our game, but also have an API endpoint and give the Windows app a way to notify the game that it detected a flap. This is a simple solution; a GET call to /flap is equivalent to pressing space in the game.