Regular Express
Build regular expressions without the syntax.
Ben Visness
On Hiatus

About Regular Express

A visual tool that allows you to build regular expressions without touching the syntax. Built using C and WebAssembly. Currently in alpha. Try it out at https://regular.express/.

Why did you build this?

Regular expressions are very powerful and very useful, but everybody hates using them. They're completely unreadable, they're hard to edit without syntax errors, they're hard to debug, etc.

Others in the past have tried to solve this problem in a few ways:

  • Different syntax. Unfortunately, making the syntax less cryptic doesn't make it much easier to follow the logic. Plus, alternate syntax tends to be way more verbose.
  • Helper libraries. This is also more verbose, but less portable across languages - losing one of the main benefits of regular expressions. I have attempted this before, and while it had some benefits, I didn't feel like it made much of a difference overall.
  • Tools and debuggers. Many tools now exist to help people understand and test regular expressions. For example, Debuggex will render a railroad diagram of your regex and allow you to test it against arbitrary strings, and regex101 will color-code and explain each part of the regex in plain English. These tools are valuable, but I don't think they go far enough.

My take is different: I believe that regular expressions are only valuable as a textual encoding of a pattern-matching automaton. We should not expect to edit the textual representation directly, in the same way that we do not expect to edit the bytes of an image directly.

Regular Express allows you to create regular expressions without worrying about this encoding.

How is this different from [my favorite regex tool]?

To my knowledge, this is the only regex tool that allows you to actually create regular expressions in a different way. There are many tools to visualize or debug regular expressions (Debuggex, regex101, etc.), but they still require you to manipulate regular expressions in their textual form.

I figure, if we understand regexes better in a visual form, we should just work in that visual form all the time.

What is the status of this project?

The (rather broken) alpha version is already available online at https://regular.express/.

Major things on the roadmap:

  • More robust group support, including named groups
  • String testing
  • Lots and lots of bug fixes and polish

Unfortunately, much of the project will likely need to be rewritten too. This is my first serious C project and I did a real bad job with a lot of things, especially memory management and undo/redo.

(This is what happens when your project begins life as a tech experiment.)

Read more
Filters

Recent Activity

Ben Visness
Regular Express

Made a few quality-of-life improvements to https://regular.express today (my visual regular expression tool):

  • Character sets are rendered more clearly, have improved keyboard navigation, and can now be negated (putting a ^ at the beginning).
  • Keyboard shortcuts should work correctly on macOS.
  • More regex syntax is parsed and passed through even when it cannot be edited, making the tool more useful for quick edits to existing regexes.
  • I also removed 12MB of zeroes from the executable that LLVM left in there for some reason.

&regex

View original message on Discord
Ben Visness
Regular Express

I can now compose this entire regex in my visual regex builder without touching the mouse. This is pretty exciting to me - this tool should be useful for both beginners and power users.

View original message on Discord
Ben Visness
Regular Express

Undo and redo is working in the regex builder! Thanks to @rxi for the write-up of a simple undo system, and @ryanfleury for pointing out that allocator stuff can go in the undo system as well.

View original message on Discord
Ben Visness
Regular Express

Hand-writing some WASM for fun. This is a memchr implementation that is being used to check if the character following a backslash is a valid "metacharacter" in a regex. No real reason to write this in WASM directly except to learn it better.

View original message on Discord
Ben Visness
Regular Express

Making text input feel right is a lot of work, but it's paying off. This video demonstrates the same cursor and selection code being applied to two separate data structures, neither of which is a buffer of chars.

Tonight I made my regex builder distinguish between "insert index" and "cursor index/position", which allows me to display the cursor on the right or left side of an element without affecting how inserts and deletes work.

View original message on Discord
Ben Visness
Regular Express

Visual regex builder: now 200% prettier and rounder. (Gotta file down those sharp edges!) Also now has a bunch more keyboard shortcuts; I think when this is done it will be really powerful even without the mouse.

View original message on Discord
Ben Visness
Regular Express

Making great progress on the visual regex builder lately. Now has various keyboard editing features, and as of today, the ability to paste in a regular expression from elsewhere so you can edit it visually.

View original message on Discord
Ben Visness
Regular Express

Made great progress this weekend on my regex builder. The goal is to be able to build and manipulate regular expressions completely visually so you don't even have to deal with the syntax.

View original message on Discord
Ben Visness
Regular Express

Spent the evening getting @rxi 's microui implemented in WASM without using Emscripten or any bulky C stdlib stuff. It was an absolute joy to use, once my hand-rolled memcpy stopped crashing everything 🙂

View original message on Discord