The Regex Engine

Your cyberpunk guide to regular expressions.

Comment

Inspiration

Honestly, regex always felt like a cryptic secret language. I wanted to build the tool I wish I'd had starting out something that made learning feel less like a chore and more like a cyberpunk adventure. The whole idea was to make a powerful tool feel fun and approachable.

What It Does

It's a full toolkit for anyone playing with regex. You can jump into the Visualizer to see a step-by-step breakdown, head to the Playground to test your patterns in real-time, or try the "Regex Golf" Challenges to sharpen your skills. It’s a hands-on way to learn and experiment without the pressure.

How We Built It

We decided to go back to basics and build it from scratch with just HTML, CSS, and JavaScript. No frameworks. This kept us focused on solid, foundational code. The entire app is managed by a single JavaScript class, and all the cool themes and animations are pure CSS.

The Challenges We Ran Into

We definitely bit off more than we could chew with the Visualizer. I initially dreamed it could handle any regex pattern, but soon realized building a full engine was way too ambitious for a hackathon. We had to scale back and focus on the common use cases, which was a great lesson in being realistic.

What We're Proud Of

I’m just really proud that we created such a feature-rich, immersive app with nothing but vanilla JS. Building the visualizer from the ground up and seeing the whole cyberpunk theme come to life was a huge win for us.

The Things We Learned

This project was a crash course in both the nitty-gritty of regex and the art of managing a complex app without a framework. We learned so much about how the browser actually works and how to handle UI updates efficiently.

What's Next for The Regex Engine

We have a ton of ideas! We'd love to add more community-submitted Challenges and beef up the Visualizer to handle more advanced patterns. Letting users create accounts to save their work is another big dream for the future.

Built With

Share this project:

Updates