React - Learn React with Hooks by creating a Roguelike game

Open your terminal, scaffold a new React app named react rogue with create react app, then tidy the project by deleting unnecessary files and verify it runs with npm start.

Learn modern React by building a roguelike canvas component with arrow function syntax and JSX. Create a 256 by 256 canvas with a border and wire it into index.js.

Move a black square by handling keyboard input with an input manager and the observer pattern in a React roguelike. Subscribe to input, update state, and render on a canvas.

In this React rogue-like lesson, build a player class that draws itself, tracks health, uses tile coordinates for movement, and renders a red at symbol.

Build a 2d world with width, height and tile size using a 2d array of 0s and 1s; render walls as tiles and generate dungeon with a cellular map generator.

Learn how to build an entity base class that the player, monsters, and loot inherit from, with attributes, drawing logic, and ascii symbols, plus a spawner to populate loot.

Implement an inventory system in a React roguelike by adding an inventory array, supporting add and remove, and rendering loot items on screen as a list.

Create a monster class and a basic roguelike combat loop with health and attack. Remove defeated monsters and log combat events, while spawning new foes from a table.

Fix a zero-based placement bug that lets a dragon appear in walls while constraining loot to 0..weight-1, and prevent overlaps by checking occupancy with GetEntityAllocation.