Regex Quick

Versão em português

Overview

The Regex Quick is a web-based utility designed to assist developers in constructing regular expressions (regex). This tool provides an interactive interface with a grid of common regex commands and their descriptions, making it easier to understand and construct complex regex patterns. The tool is responsive, accessible, and includes tooltips for additional guidance.

Features

• Interactive Regex Command Grid: A 12x5 grid layout containing buttons for common regex commands.
• Tooltips: Hover over the buttons to see descriptions of what each regex command does.
• Responsive Design: Optimized for both small and large screens.
• Accessibility: Keyboard and screen reader-friendly.
• Customizable Scrollbar: Aesthetic and functional scrollbar that adjusts to the content.

Demo

You can view a live demo of the Regex Helper Tool here https://migmoroni.github.io/RegexQuick/.

Installation

To start using the Regex Helper Tool, follow these steps:

1. Clone the repository:

   git clone https://github.com/migmoroni/regexquick.git

2. Navigate to the project directory:

   cd regexquick

3. Open index.html in your browser:

   open index.html

   or simply open the file with your preferred browser.

Usage

Interactive Regex Command Grid

The main feature of this tool is the regex command grid. Each button in the grid represents a different regex command. When you hover over a button, a tooltip appears with a description of the command. This helps you understand and use regex commands effectively.

Responsive Design

• Small Screens: The buttons in the grid organize vertically to ensure a smooth experience on mobile devices.
• Large Screens: The buttons align horizontally for a more expansive view.

Accessibility

• Keyboard Navigation: You can navigate through the buttons using the Tab key.
• Screen Readers: Each button includes accessible text for screen readers.

Customizable Scrollbar

The tool features a customizable scrollbar that enhances user experience without obstructing content view. The scrollbar is styled to match the overall theme of the tool and adjusts based on the content size.

Customization

You can easily customize the appearance of the Regex Helper Tool by modifying the CSS. The main styles are located in the style.css file, where you can adjust colors, fonts, and layout.

Contribution

Contributions are welcome! If you would like to contribute to the project, follow these steps:

1. Fork the repository.
2. Create a new branch:

   git checkout -b feature-branch

3. Make your changes and commit them:

   git commit -m "Description of changes"

4. Push to the branch:

   git push origin feature-branch

5. Create a pull request.

License

This project is licensed under the MIT License. See the LICENSE file for more details.

Contact

For any questions or feedback, contact me at miguelmcontato@gmail.com.

---

Thank you for using the Regex Helper Tool! We hope it makes your regex construction process easier and more efficient.