The challenge is: Code something from scratch without using a framework…. 🤔
🌐 Introducing Pacman.html — https://tawfiq.co.uk/pacman
The assignment was to demo something coded from scratch, I started thinking of how I could make a simple, but engaging, game? It would probably be based off of a classic to test my own skills, probably in JS/HTML to make the rendering and deployment super simple in-browser… 🔜
🚶I went for a walk (probably where my best ideas happen) and it started to come together in my mind: a basic run loop, updating and rendering game state on every tick, I could represent the sprites with a simple class and instantiate however many I wanted, they could each inherit a “move” function but maybe implement it differently to the base class, scoring could be simple and based on ticks… The ideas wouldn’t stop coming and I had to get them down into code.
🧠 It’s easy to get carried away with building, so my aim was to do this in ~500 lines of JS, in one evening. (I ran over a bit as I wanted to add some animation and facial detail 👻)
📝The result is a super simple pacman game — one page of HTML – 600 lines of JS.
🏆See if you can beat my high score of 837!!
🤲 Thank you to Sobia Kazmi and Ibraheem Sharif for beta testing and alerting me to a bug on mobile 📲. That is now fixed so it plays nicely wherever you are 🧑💻
A super lightweight game that reminds me of a simpler time.
Source code here if you’re interested
- Single gist of Pacman.html: https://gist.github.com/Tawfiqh/982d596869405e98c8618396f1041ad7
- Also in a repo I used to track changes across my commit history: https://github.com/Tawfiqh/pacman.html/commits/main/