Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Signup with Astro + Tailwind and vanilla JS

Aleš Zima 390

@Esosek

Desktop design screenshot for the Newsletter sign-up form with success message coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I wanted to exercise my JS skills without any FE framework and I wouldn't do it again for reactive elements. It actually proved a bit too complicated to polish the success page and separating code to multiple files would be less understandable.

I'm proud that making the complete form took me less time than usual!

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

Deploying to GitHub pages proved harder than I expected but I'm glad I researched and practiced this.

Source images are also not great for screens between desktop and mobile but I'm sort of satisfied with the result.

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

For static page like this, what would be the best way to separate UI code for form and success page into multiple files? I couldn't figure out how to then dynamically change it with client side JS.

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

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