This is a solution to the Contact form challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- Complete the form and see a success toast message upon successful submission
- Receive form validation messages if:
- A required field has been missed
- The email address is not formatted correctly
- Complete the form only using their keyboard
- Have inputs, error messages, and the success message announced on their screen reader
- View the optimal layout for the interface depending on their device's screen size
- See hover and focus states for all interactive elements on the page
- Live Site URL: live site
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
code snippets, see below:
// Email Validation Function
function isValidEmail(emailAddress) {
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return emailRegex.test(emailAddress.trim());
}
- Frontend Mentor - @thebraudalf
- Twitter - @thebraudalf