Game.Random

Learn game development by playing: start from a working 2D game, modify gameplay live, and see results instantly, with AI help for ideas, fixes, and learning.

Comment

Game.Random

A browser-based 2D game sandbox where you learn coding by editing real games and seeing changes instantly.

Inspiration

Learning to code is usually “blank file + blinking cursor,” which is intimidating and boring. We wanted something that feels like play: start with a real game, tweak the code, and instantly see what changes. Game.Random was inspired by that gap—making coding feel more like experimenting than memorizing.

What it does

Game.Random is a browser-based 2D game sandbox where learners can:

  • Pick a starter game template and play immediately
  • Edit the game’s code in the browser
  • See changes live in the game preview (fast feedback loop)
  • Get clear error overlays and safe fallbacks so one bug doesn’t kill the session

It’s designed for beginners, hobby coders, and educators who want a more interactive way to teach coding concepts.

How I built it

  • Built a web app that pairs a code editor with a live game preview (side-by-side).
  • Created a template system (starter games) so users don’t start from scratch.
  • Implemented a run/update pipeline to apply code changes quickly and keep gameplay responsive.
  • Added reliability features: error handling, crash prevention, and a recovery flow so the game stays playable even when code breaks.

Challenges I ran into

  • Sandboxing + safety: letting users run code while preventing the whole app from breaking.
  • Live updates without lag: keeping the preview smooth while updating code frequently.
  • Debugging experience: making errors readable for beginners (not scary stack traces).
  • Template design: balancing “fun game” with “teaches real concepts.”

Accomplishments that I'm proud of

  • A working MVP where you can go from “open the site” to “playing and editing a game” in minutes.
  • A stable live-preview workflow with error overlays and fallbacks (so sessions don’t hard crash).
  • A clear, beginner-friendly learning loop: learn → change code → instantly see results.
  • Demoing it successfully and validating that the idea is genuinely useful for new learners.

What I learned

  • Building interactive education tools is as much UX as it is engineering.
  • Real-time systems require careful handling of performance, state, and failure modes.
  • Good developer tools (even for beginners) depend on strong error messages and recovery paths.
  • Shipping a hackathon MVP is about prioritizing the loop that creates the most “wow” the fastest.

What's next for Game.Random

  • More templates and “missions” that teach specific concepts (movement, collisions, scoring, AI).
  • A guided mode with hints, goals, and progressive difficulty.
  • Save/share projects (links) so learners and teachers can reuse and remix games.
  • Classroom-friendly features: curated lesson sets, instructor dashboards, and analytics.
  • A community gallery where users publish games and remix each other’s work.

Running locally

# clone the repo
git cline gh repo clone msamin-25/games.random

# install dependencies
npm install

# start dev server
npm run dev

Built With

Share this project:

Updates