DEV Community

Cover image for How to write Regex without writing regex 🦄
Nico Montiel
Nico Montiel

Posted on • Updated on

How to write Regex without writing regex 🦄

Writing regex is not that difficult, I know, But without a doubt, it's one of the most boring tasks in the world, and if you don't understand it, it's super frustrating. So today I present to you, magic-regexp

This library allows you to create regular expressions with a very natural and intuitive syntax.

First, we need to install it

npm install magic-regexp
Enter fullscreen mode Exit fullscreen mode

Now, let's create an array where we can test our expressions

const stringsToParse = [
    "id: 123",
    "there is no id",
    "random string id: 1",
    "[INFO] id: 12",
    "id: 1a",
    "random log info id: 4b93H6Hd random log",
    "id: 4b93H6Hd"
]
Enter fullscreen mode Exit fullscreen mode

First case

Our first case will be a simple one, just match the string "id: "

import { createRegExp, exactly } from 'magic-regexp'

const regex = createRegExp(
    exactly('id: ')
)
Enter fullscreen mode Exit fullscreen mode

Regex to find exact string with magic-regexp

We can see that almost all the strings matched our regex, only the second one didn't contain the exact string "id: ".

Second case

Let's do something more complicated. Let's find the word "id: " again, but now we also want it to be followed by a letter or digit, and to be between 2 and 6 in length.

import { createRegExp, exactly, letter, digit } from 'magic-regexp'

const regex = createRegExp(
    exactly('id: ')
    .and(letter.or(digit).times.between(2, 6))
)
Enter fullscreen mode Exit fullscreen mode

Regex to find exact string and specific length

As you can see, the third word didn't match because the number after the id contains only one letter/digit.

Third case

So, let's add one more thing here, the .at.lineStart(). As the name says, it will only care about the string where your condition is at the beginning.

import { createRegExp, exactly, letter, digit } from 'magic-regexp'

const regex = createRegExp(
    exactly('id: ')
    .at.lineStart()
    .and(letter.or(digit).times.between(2, 6))
)
Enter fullscreen mode Exit fullscreen mode

Regex to find exact string, specific length and at the beggining

As you can see, only those matching the previous conditions and those starting with our "id: " match the condition.

Fourth case

Let's push things a little further. Let's add the .at.lineEnd(). As the name says, it will only look for those that are at the end of the line. Notice that we put this inside the and() function.

import { createRegExp, exactly, letter, digit } from 'magic-regexp'

const regex = createRegExp(
    exactly('id: ')
    .at.lineStart()
    .and(letter.or(digit).times.between(2, 6).at.lineEnd())
)
Enter fullscreen mode Exit fullscreen mode

Regex to find exact string, specific lengt, at the beggining and at the end

With this particular condition, only two strings satisfy the condition.

Summary

As you can see, writing regular expressions with a more natural language is a lot easier if you don't have experience with regex. There are many more things that you can do with this library, you can check directly the documentation.

A big inspiration for this post, came from this Youtube Video, so check it if you want something more visual :)

That's all, I hope it can be helpful for you 🥳

Top comments (0)