Newsletter Sign-Up with Success Message | HTML / Tailwind CSS / JS

What are you most proud of, and what would you do differently next time?

I added some JavaScript validation to the form. In addition to showing the success message, I have also added a loading spinner to simulate processing time. The success message now dynamically displays the actual email address that the user typed into the input field, giving a more personalized confirmation.

The validation is fairly simple at this stage, relying on basic client-side checks using regular expressions to ensure the email format is valid. In the future, I plan to explore more robust validation techniques, such as integrating API calls or database connections to check if the email already exists or to handle server-side form submissions. This would also allow for more advanced error handling and feedback.

What challenges did you encounter, and how did you overcome them?

I am still learning Tailwind CSS, and realised if the classes are not compiled in the output, they are not being read correctly. I am working with adding and removing classed using JS for error messaging. So I had to add some in the safelist of the Tailwind config.