Skip to content
Submitted 4 months ago

Newsletter Signup - Vite/Vanilla JS/Responsive/Flex/Grid/dialog

Jim Barnett•260
@jamesbarnett
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Newsletter sign-up form with success message
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

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

I am happy with how the confirmation using the `` element turned out. The only thing I would do differently would be to get the asset paths correct for deployment earlier in the process.

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

I did run into a couple of issues with selector specificity. I did eventually recognize what was going on and adjusted. Good learning experience.

What specific areas of your project would you like help with?

Suggestions to improve the javascript for managing the dialog. Am I missing any obvious, well-adopted best practices, etc.?

Community feedback

  • Ralph Virtucio•670
    @ralphvirtucioPosted 4 months ago

    Hi Jim Barret, Great job on completing this challenge

    I like how you used a dialog for the "Thanks for subscribing" message. I'm considering using it when I refactor this challenge. Thank you for sharing the showModal resource.

    • I have a test scenario for you: When the user inputs an invalid email and then clears the input to enter a valid email, they are redirected to the "Thanks for Subscribing" page. After clicking the dismiss message and returning to the main page, I notice that the error message "Valid email required" is still there even though there is no user email input.

    • It is also a good practice to use button type="submit" when submitting a form.

    If you want more references about client-side form validation here is a MDN article you can check. 😊

    Everything looks great!

    CODE UP ☕🧑‍💻😊 !

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord