Regex in JavaScript: A Comprehensive Tutorial by Sonam J Sherpa

Description.

In this Regex Tutorial, you will learn how to validate the featured email address regular expression (regex) Regex Featured in This Tutorial: /^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/. The tutorial provides a comprehensive breakdown and explanation of each component within the regex, simplifying the validation process for easy understanding. Upon completing this tutorial, you will gain a deeper comprehension of how the regex functions to validate and confirm the entry of a valid email address.

Table of Contents:

• Overview
• The Challenge
• Resources
• Assigned User Story
• Acceptance Criteria
• Deployed GitHub-Gist Link
• GitHub Repository
• Screen Shots
• Usage Information
• Installation Process
• Built With
• What I Learned
• Continued Development
• License
• Author

Overview

The Challenge

In this challenge, you will utilize the knowledge gained from the tutorial and apply it to the creation of a comprehensive tutorial on email validation using regex. The following steps were taken to achieve this:

1. Conducted an extensive review of existing literature to gain a comprehensive understanding of the structure and formatting rules for email addresses.
2. Extracted essential elements from reputable academic sources that require validation in an email address, ensuring the accuracy of the validation process.
3. Devised a regex pattern that effectively verifies email addresses based on the identified components, taking into account the established guidelines.
4. Created a GitHub Gist by following the provided instructions in the "Installation Process" section.
5. Within the newly established Gist, composed a concise explanation of the regex pattern developed for email validation, providing a detailed breakdown of each component's purpose and functionality. This explanation was tailored to cater to individuals with limited coding experience, while drawing insights from scholarly sources.
6. Shared the Gist link with others to foster discussions and exchange diverse perspectives regarding different approaches and interpretations of the regex pattern.

Resources

1. W3Resource. (n.d.). JavaScript: HTML Form - email validation. https://www.w3resource.com/javascript/form/email-validation.php
2. MDN Web Docs for Regular Expressions. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions/
3. Eloquent JavaScript (Chapter 09): Regular Expressions. https://eloquentjavascript.net/09_regexp.html
4. University of Toronto Libraries. (n.d.). OpenRefine tutorial 3: Regular expressions (Regex) activity. https://mdl.library.utoronto.ca/technology/tutorials/openrefine-tutorial-3-regular-expressions-regex-activity
5. University of Toronto. (n.d.). Oral presentations. Advice on Academic Writing. https://advice.writing.utoronto.ca/types-of-writing/oral-presentations/
6. Harvard University. (2022). CS50's Web Programming with Python and JavaScript. https://cs50.harvard.edu/python/2022/weeks/7/

The information obtained from these sources proved to be highly valuable when it came to understanding how regex patterns are constructed and utilized for validating email addresses. Additionally, these sources shed light on the educational aspects of teaching regex to beginner programmers and other individuals in academic settings. This knowledge was then integrated into the development of the tutorial, which aimed to present a comprehensive and accessible explanation of email validation through the use of regex, while maintaining a strong academic foundation.

Assigned User Story:

AS A web development student
I WANT a tutorial explaining a specific regex
SO THAT I can understand the search pattern the regex defines

Acceptance Criteria:

GIVEN a regex tutorial
WHEN I open the tutorial
THEN I see a descriptive title and introductory paragraph explaining the purpose of the tutorial, a summary describing the regex featured in the tutorial, a table of contents linking to different sections that break down each component of the regex and explain what it does, and a section about the author with a link to the author’s GitHub profile
WHEN I click on the links in the table of contents
THEN I am taken to the corresponding sections of the tutorial
WHEN I read through each section of the tutorial
THEN I find a detailed explanation of what a specific component of the regex does
WHEN I reach the end of the tutorial
THEN I find a section about the author and a link to the author’s GitHub profile

Usage Instructions:

1. Access the deployed GitHub Gist link.
2. Read through the introductory paragraph and summary.
3. Navigate through the table of contents to explore the different sections of the tutorial.
4. Read and understand each component of the regex pattern.
5. Apply the knowledge gained from the tutorial in your own projects.

Deployed GitHub-Gist Link:

Deployed GitHub-Gist Link: Click Here

GitHub Repository:

GitHub Repository: Click Here

Figure 1. Deployed Public GitHub Gist Screenshot.

Installation Process:

Set up a GitHub Gist:

1. Sign in to your GitHub account or create one if you haven't already.
2. Visit: https://gist.github.com/ to create a new Gist.
3. In the "Gist description" field, enter a brief description of the challenge, such as "Email Regex Challenge".
4. Add a new file to the Gist by clicking on "Add file" and give it a suitable name, like "email_regex_challenge.md".
5. In your newly created Gist, write a brief explanation of the regex, describing each component and its purpose in the email validation process.
6. Explain how the regex can be modified to accept new requirements, such as uppercase letters or additional special characters in the email address.

Share your Gist:

7. Once you have completed the explanation and modifications to the regex, save your Gist by clicking on "Create public Gist" or "Create secret Gist" as per your preference.
8. Share the link to your Gist with others to discuss different approaches and understanding of the regex.

By completing this challenge, you will not only have a better understanding of the email validation regex but also gain experience in setting up and sharing a GitHub Gist.

Built With:

• GitHub Gist: How to Create a Gist?
• License Badge: Shields.io
• Visual Studio Code: Website

What I Learned:

1. Deployed my 1st GitHub Gist.
2. Built knowledge and comprehension of regex patterns for email validation.
3. Thorough breakdown on regex components.
4. Effectively communicate the regex usage and validation techniques.

Continued Development:

1. Expanding regex patterns for additional validation use-cases.
2. Creating tutorials for regex usage in other programming languages.
3. Enhancing the tutorial with more examples and interactive elements.
4. Sharing the tutorial with the developer community for feedback and improvements.

License

Author

Follow me on Github at Sonam J Sherpa. Additional questions or concerns? feel free to contact me at sherpa.sjs@gmail.com