First post: GTA, programming

1/1/2024

Hi, my name is Ian and I wanted to write and share a bit about my journey in programming.

Recently I’ve been spending a few hours a night reading my old code and refactoring it. This week, I’ve been improving one of my favorite projects: Grand Theft Autocorrect.

GTA screenshot

Grand Theft Autocorrect is a typing game, in the vein of classics like The Typing of the Dead, TypeRacer, 10FastFingers, and MonkeyType. Thematically, the game of course pays homage to GTA (Vice City). You need to type faster than the cops for each of the 10 levels, earning a new, fancier car in the process. But you lose health for every typo, so be careful or you’ll see the Wasted graphic we all know and love.

This was borne out of my unceasing love for mechanical keyboards. This world is vast: switches, technologies, firmwares, microcontrollers, soldering (and desoldering). Group buys, acronyms (ABS PBT POM GMK HHKB QMK SA DSA etc.), linears, tactiles, clickies. If you know, you know; if you don’t, your wallet will thank you for remaining a safe distance away.

As a project for my GA studies, I learned a ton about the DOM, JavaScript internals, interactivity, and even some performance metrics. I learned just how valuable the .map() method is, long before I learned to rely on it for React. In all, my script for the site was 1000 lines long, including extensive pseudocode and notes.

I spent many hours on the original styling, back before I knew tools like Figma or libraries/frameworks like styled-components and Tailwind existed. Learning to build my own cards and buttons translated into deep appreciation for styling and the frontend in general…thank you Gore.

In revisiting this project, pruning away unused HTML classes and rewriting a great deal of CSS to better utilize the C (cascading) of CSS, I learned how much intentionality matters with software engineering. The structure of your code communicates your big picture design. My code shows some growing pains of learning how best to solve problems and troubleshoot bugs. But I am grateful that I got it to work, and I remember how much self-confidence I gained in demonstrating my game for the group.

In recent days I redid quite a bit of the general styling and feel of the website. I added a speedometer so the user can see their words-per-minute score in real time, with a needle moving just like a real one in a getaway car. The site is better now from a UX standpoint, at least from desktop. I still have a laundry list of things to tweak, and I’ll keep updating it, because it reminds me just how fun and educational these projects really are.

Here is the deployment if you want to try it out: https://grand-theft-autocorrect.netlify.app/.