PLATFORM
  • Tails

    Create websites with TailwindCSS

  • Wave

    Start building the next great SAAS

  • Pines

    Alpine & Tailwind UI Library

  • Auth

    Plug'n Play Authentication for Laravel

  • Designer comingsoon

    Create website designs with AI

  • DevBlog comingsoon

    Blog platform for developers

  • Static

    Build a simple static website

  • SaaS Adventure

    21-day program to build a SAAS

Written By

How To Easily Understand Any Regular Expression In The World

How To Easily Understand Any Regular Expression In The World

Today we will see how can we easily understand any JavaScript regular expression or write your own regular expression easily.

To do this, navigate to this website.

The UI looks like this:

regex_1.png

Consider, we want to check if the input contains digits so we will add the \d in the regular expression search box section and the input for which we want to test the expression in test string section. You will see something like this:

regex_2.png

If you check the Match Information section on the right side, you can see that the regular expression matches the test string for each digit separately.

regex_3.png

If you want to match the entire input 123, you need to add + after \d (to match one or more occurrence of digit) like this \d+ and you will see the output as below:

regex_4.png

As you can see in Match Information section, it’s a full match now.

You can also see the explanation section on top right side which shows what each part of regular expression does, which is very helpful if you don’t know how something works.

If the test string does not match the regular expression, it will be shown as below:

regex_5.png

Now, let’s take a regular expression which checks for a visa credit card (All Visa card numbers start with a 4. New cards have 16 digits. Old cards have 13 digits.)

4[0-9]{12}(?:[0-9]{3})?$

If you add the above regular expression in regular expression search box, then you can see, the explanation section updated showing the explanation of the expression as shown below:

regex_6.png

So using this way, you can take any regular expression in the world and check what it does and also validate for the input string at the same time.

This will also save your time and increases productivity as you can quickly change the regular expression or input string and test it for match.

Thanks for reading!

Check out my recently published Mastering Redux course.

In this course, you will build 3 apps along with food ordering app and you'll learn:

  • Basic and advanced Redux
  • How to manage the complex state of array and objects
  • How to use multiple reducers to manage complex redux state
  • How to debug Redux application
  • How to use Redux in React using react-redux library to make your app reactive.
  • How to use redux-thunk library to handle async API calls and much more

and then finally we'll build a complete food ordering app from scratch with stripe integration for accepting payments and deploy it to the production.

Want to stay up to date with regular content regarding JavaScript, React, Node.js? Follow me on LinkedIn.

Comments (0)

loading comments