This is a simple password generator web application created as part of a coding exercise. It allows you to generate secure passwords with various options, including length, character types (lowercase, uppercase, numbers, and special characters), and copy the generated password to your clipboard.
- Open the Password Generator project in your Visual Studio Code.
- Run the
index.htmlfile in your favorite web browser. - You'll see the Password Generator webpage.
- Generate Password: Click the "Generate Password" button to generate a secure password based on your chosen options.
- Copy Password: After generating a password, click the "Copy Password" button to copy the password to your clipboard.
- Password Length: Use the slider to set the desired length of the password.
- Include Lowercase: Check this box to include lowercase letters in the password.
- Include Uppercase: Check this box to include uppercase letters in the password.
- Include Numbers: Check this box to include numbers in the password.
- Include Special Characters: Check this box to include special characters in the password.
-
Testing: The Password Generator application has undergone extensive testing to ensure its functionality. The following testing methods were employed:
- Unit Testing: Individual components and functions were tested to verify that they work as expected. This includes testing password generation, slider value handling, and event listeners.
- Integration Testing: The application's components were tested together to ensure that they interact seamlessly. This included verifying that the modal opens and closes correctly and that user options are processed accurately.
- User Testing: The application was shared with real users to gather feedback and identify any issues they encountered. User feedback played a crucial role in refining the user interface and overall user experience.
-
Debugging: During the development of the Password Generator, various debugging techniques were used to identify and resolve issues. This involved:
- Console Logging: Strategically placed console.log statements were used to output information and identify the flow of the application, making it easier to pinpoint bugs.
- Browser Developer Tools: The browser's developer tools, including the Console and Elements tabs, were instrumental in diagnosing and fixing issues. It allowed for real-time inspection of variables and HTML/CSS elements.
- Error Handling: The application includes error handling code to gracefully handle unexpected user inputs and conditions. Error messages were provided to guide users when something goes wrong.
By implementing these testing and debugging strategies, the Password Generator aims to deliver a reliable and user-friendly experience.
- Modal close button not working
- Source: Stack Overflow
- Build A Password Generator With JavaScript – Tutorial
- Author: Web Dev Simplified
- Source: YouTube Video
- Password Special Characters
- Author: Pawel Krawczyk
- Source: OWASP
- Random Password Generator using Javascript
- Author: Foolish Developer
- Source: Dev.to Article
- JavaScript Array
map()- Source: W3Schools
- Array.prototype
map()- Source: MDN Web Docs
- JavaScript String
charAt()- Source: W3Schools
- Working with objects
- Source: MDN Web Docs
- Math
- Source: MDN Web Docs
- String
- Source: MDN Web Docs
- JavaScript For Loop
- Source: W3Schools
You can find the project's source code on GitHub.
You can try the Password Generator on this webpage.
- Claire Fraser Feel free to fork and modify the project according to your needs. If you have any suggestions or improvements, please create an issue or a pull request.
This project is open source and available under the MIT License.