Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/felpsalvs/dom-manipulation

Last synced: 1 day ago
JSON representation

Host: GitHub
URL: https://github.com/felpsalvs/dom-manipulation
Owner: felpsalvs
Created: 2023-09-13T19:58:18.000Z (about 1 year ago)
Default Branch: main
Last Pushed: 2023-10-06T15:57:37.000Z (about 1 year ago)
Last Synced: 2023-10-27T20:26:39.536Z (about 1 year ago)
Language: HTML
Size: 225 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

Credit Card Masking Example Application

This is an example application demonstrating the use of masks for credit card fields such as card number, expiration date, and security code.

Technologies   |
Project   |
Layout   |
License

License

## 🚀 Technologies

This project was developed with the following technologies:

- HTML and CSS
- JavaScript and JSON
- [Node and NPM](https://nodejs.org/)
- [Vite](https://vitejs.dev/)
- [iMask](https://imask.js.org)

## 💻 Project

Card Number Mask: When entering the card number, it is automatically formatted as "0000 0000 0000 0000" and recognizes Visa and Mastercard types based on the first digits.
Expiration Date Mask: When entering the expiration date, it is formatted as "MM/YY" and validates the year for the next 10 years.
Security Code Mask: The security code is formatted as "0000".

## 🔖 Usage

1. Open the index.html file in your web browser.
2. Enter the card number, expiration date, and security code in the corresponding fields.
3. Observe how the masks automatically format the fields.

## :memo: Contribution

Contributions are welcome! Feel free to open issues and pull requests for improvements.

- Fork the project
- Create a branch with your feature (git checkout -b feature/MyFeature)
- Commit your changes (git commit -m 'Add MyFeature')
- Push to the branch (git push origin feature/MyFeature)
- Open a Pull Request