Visual Support for Working with Regular Expressions | Hacker News Reader

Visual Support for Working with Regular Expressions

softvis.wordpress.com

29 pointsbeckf12 comments

I think one reason why most people have a hard time reading regex is because they don't use any indentation or linebreaks.

Honestly, if a buddy came to you and asked you to help him debug a javascript method and all 15 statements were on the same line, would you offer to help him, or tell him to fix his shit first so you can read it?

What if it was all on one line and his variable names were all "v1", "v2", etc. Would you help him then? fuck no. And yet, this is standard operating procedure with regex, except you don't even get "v1", "v2" because nothing is labeled at all. v1/v2/... would be an improvement!

This is how most people write a simple date regex:

\d{1,2}/\d{1,2}/(\d{4}|\d{2})

And mind you, this is a very simple scenario. Here is how you would write it if you treated it like actual code:

(?<month>\d{1,2})

(?<day>\d{1,2})

(?<year>\d{4}|\d{2})

First off, you can know what my intent is when I'm capturing each group. Maybe this code gets used by a european where the month and day switch places. They can figure out how to fix it in like two seconds. Secondly, the forward slashes are not lost in a sea of characters anymore because we use whitespace like a civilized developer, not a regex savage.

I linked it in another comment, but I've got a free regex tool that I wrote www.regexpixie.com. my email is in my profile if anyone has any questions/comments.

That's a neat tool you mention... is it available on Linux or OSX???? :P

I should have figured you'd give me grief, darren. It has Linux and OSX support if you're willing to run windows in a VM ;)

I couldn't agree more. In .NET I use something like this:

new Regex(@"

                                # {begining of string}International Call Prefix, 

                                # digits [0 - 2]
                        ^[+]1

                                # Area Code validation allowing only US landline and mobile numbers, 

                                # digits [3 - 5]

                        (?:

                             2(?:0[1-35-9]|1[02-9]|2[4589]|3[149]|4[08]|5[1-46]|6[0279]|7[026]|8[13])

                            |3(?:0[1-57-9]|1[02-9]|2[0135]|3[014679]|4[67]|5[12]|6[014]|8[56])

                            |4(?:0[124-9]|1[02-579]|2[3-5]|3[0245]|4[0235]|58|69|7[0589]|8[04])

                            |5(?:0[1-57-9]|1[0235-8]|20|3[0149]|4[01]|5[19]|6[1-37]|7[013-5]|8[056])

                            |6(?:0[1-35-9]|1[024-9]|2[036]|3[016]|4[16]|5[017]|6[0-279]|78|8[12])

                            |7(?:0[1-46-8]|1[02-9]|2[0457]|3[1247]|4[07]|5[47]|6[02359]|7[02-59]|8[156])

                            |8(?:0[1-68]|1[02-8]|28|3[0-25]|4[3578]|5[06-9]|6[02-5]|7[028])

                            |9(?:0[1346-9]|1[02-9]|2[0589]|3[01678]|4[0179]|5[12469]|7[0-3589]|8[0459])

                        )

                                #

                                # digit [6]

                        [2-9]

                                # Remaining 6 digits can be any digit{end of string}

                                # digits [7 - 12]
                        \d{6}$",

                        RegexOptions.IgnorePatternWhitespace | RegexOptions.Compiled);

The key part is "RegexOptions.IgnorePatternWhitespace". With that, you can add comments to your Regex using the "#" character and break it up even more. In this example I didn't use capture groups, but I usually use a combination of both techniques.

Edit: Formatting of whitespace was somewhat lost with the post. In my code it looks great! I also cleaned up some of the comments that revealed more information than I intended.

I was expecting something like what https://www.debuggex.com offers when they said visual support. This seems to simply be highlighting like most other tools do.

Further below in the post, Debuggex and similar tools are discussed as well.

Regarding the visuals, RegViz can be considered as something between Debuggex and traditional plain-text tools.

Or http://regexper.com/.

If your regular expression gets too complicated you should look into using parsers like antler,bison,etc. I was scared of learning about parsers initially since people consider it to be old technology and is usually in the domain of compiler designers and such, but they are really really cool.

I don't really promote this at all, but I wrote a free regex tool that wasn't listed.

http://www.regexpixie.com/

Key Features:

* Real Time Highlighting

* Solid Support for Named Groups

* Easily extract just the match or replacement text to clipboard

* write replacement logic with C#

It is free but only works on windows (built on .net).

ReSharper introduced Regex support in v9: http://blog.jetbrains.com/dotnet/2014/10/27/regular-expressi...

Do any of these allow to run offline? i.e local

Edit: Looks like Regexr can be run locally with node https://github.com/gskinner/regexr/

Or you could just use Emacs :)

https://github.com/benma/visual-regexp.el

Reply on news.ycombinator.com