Construct a Regex to Match Twitter Mentions with Regexr

John Otander
InstructorJohn Otander
Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 3 years ago

regexr is a powerful tool for debugging existing regexes and creating new ones. In this lesson, we'll use the app to create a regex that matches Twitter-style mentions in a string. It will go over a few regex concepts including capture groups, character sets, and flags.

Instructor: [0:00] RegExr is a tool for debugging existing regexes and creating new ones. By default, you need a text area with example content and a regex that matches all capitalized words.

[0:10] In order to start working on our own regex, we'll go ahead and replace the example content with our own. This content contains Twitter style mentions, which we'll attempt to parse out with our own regex.

[0:22] Now we'll begin creating our own regex. First, we need to create a matching group that contains the @ symbol. In our example content, we'll now see that all the @ signs are highlighted.

[0:33] Next, we'll see the tools category where there's an explain section provided. It will show the capture group, and then the character that we're currently capturing.

[0:42] A username always starts with an alphabet character. We can create a regex character set to only match A through Z as the first character. Once that character is met, it can be anything that's alphanumeric. You create another character set that matches A through Z and zero through nine.

[0:59] We can now see we're getting close. However, we don't match to the end of the actual username. However, we can achieve that by using the plus quantifier. This will continue matching anything that's alphanumeric.

[1:10] All mentions are being matched. You can see we have our capturing groups that start with the @ character, and then two character sets. One for the first alphabet character, and then the rest for the alphanumeric characters.

[1:24] Lastly, we have the quantifier that continues matching the entire username. We do have one more thing to address. Currently, we only match lower-case alphabet characters. We can fix this by adding a case-insensitive flag to our Regex.

[1:40] Now everything looks good. You can also go ahead and click list in the tool section and see all of our matches.

egghead
egghead
~ 2 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today