RegexLab banner

RegexLab

7 devlogs
4h 34m 12s

RegexLab is a lightweight, browserbased playground for experimenting with regular expressions. It allows users to test regex patterns against custom text in real time and progressively adds visual match highlighting and human-readable explanations…

RegexLab is a lightweight, browserbased playground for experimenting with regular expressions. It allows users to test regex patterns against custom text in real time and progressively adds visual match highlighting and human-readable explanations to make regex easier to understand.

Demo Repository

Loading README...

ritwikk

Added a reset button as suggested. Thanks for the input!

Attachment
0
ritwikk

Shipped this project!

Hours: 3.49
Cookies: 🍪 54
Multiplier: 15.42 cookies/hr

Hiii there,
Here’s RegexLab, a small in-browser regex playground that lets you test patterns, see matches highlighted in real time, and get simple explanations for what a regex is actually doing. You can also share a link that restores the exact state, which makes debugging and showing examples way easier. I learned (again) that most “hard” tools become much nicer once you slow down and make feedback obvious.

I hope this ship goes well, lesgoooo 🦖

ritwikk

Final Draft!!!
I’m wrapping up RegexLab with this update.
The tool now supports shareable links, so the text and regex pattern are synced directly to the URL. Opening the link restores the exact same state, which makes it easy to share examples or edge cases without any setup.
I also polished the UI and interactions so it feels smoother to use overall. Highlighting is clearer, the layout is more intentional, and everything runs fully in the browser without any backend.
RegexLab does what I wanted it to do, make regex easier to test, understand, and share. I’m locking this project here and moving on to the next one.

Attachment
Attachment
Attachment
Attachment
Attachment
1

Comments

jayant
jayant 3 months ago

i checked it. that was good

ritwikk

Draft 4, In this draft, I focused on usability.
I added a small regex library with commonly used patterns that can be inserted with a single click. This makes it easier to experiment without having to remember or type patterns from scratch.
Once a pattern is selected, everything else still works as before, matches are highlighted and the explanation updates automatically. It already feels much smoother to use compared to earlier drafts.
The final draft will focus on polishing the UI and making patterns shareable. Lessgooo

Attachment
Attachment
Attachment
Attachment
Attachment
1

Comments

MeBadDev
MeBadDev 3 months ago

This looks really useful!

ritwikk

This is Draft 3. In this draft, I added basic explanations for common regex patterns.
Along with match highlighting, RegexLab now shows a plain-language breakdown of what different parts of a regex are doing. The explanations are rule-based and currently cover only the most commonly used tokens, which keeps things understandable and predictable.
This already makes it easier to reason about why a pattern behaves the way it does, instead of treating regex like a black box.
Next, I want to focus on usability by adding a small library of common regex patterns that can be quickly inserted and tested.

Attachment
Attachment
Attachment
Attachment
Attachment
Attachment
0
ritwikk

This is Draft 2 of RegexLab. In this draft, I focused on making regex behavior visible instead of abstract.
RegexLab now highlights all matches directly inside the text, so instead of just seeing a yes or no, you can actually see what parts of the input the pattern is matching. The text input stays editable, and a separate preview updates in real time with highlighted matches.
This already makes debugging patterns a lot easier, especially when a regex matches more than once or behaves unexpectedly.
Next, I want to move beyond visuals and start explaining regex patterns in plain language so it’s clearer why a pattern behaves the way it does.

Attachment
Attachment
Attachment
Attachment
Attachment
Attachment
Attachment
0
ritwikk

Started working on RegexLab, a small browser-based regex playground.

Draft 1 is focused only on the core: typing a regex, typing some text, and getting immediate feedback on whether it matches. It also handles invalid patterns so you’re not left guessing why something isn’t working.

Nothing fancy in this draft. The goal was to get a solid base working before adding any visual layers or explanations on top of it.

Next draft will focus on highlighting matches directly inside the text so it’s clearer what the regex is actually doing.

Attachment
Attachment
0