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

Ping Coming Soon page using Tailwind-css

#tailwind-css
Shiva 670

@shivaprakash-sudo

Desktop design screenshot for the Ping single column coming soon page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any suggestions on optimizing the JavaScript code?

Community feedback

@saurabhgithb

Posted

Hello Shiva, I think your code can be optimized as:- a) remove separate markup for each error message instead set error message in js using a setError function. b) pass the message in setError function and use it to add innerText and styles for different error in js. c) make the div containing error message absolute and position it correctly. You can use the same for success message also. This will save use hide/unhide logic.

Marked as helpful

0

Shiva 670

@shivaprakash-sudo

Posted

@saurabhisdev

Hello Saurabh,

That makes more sense and easy it to maintain, thank you for the suggestion. :)

0

@icaroMendes777

Posted

In general looks good. But if you wanna some sugestions:

  • the standard validation to input email is over the red message suggested in the design, you can change the input type from email to text, so this validation wont be triggered

  • the if statement if (emailInput.value === "" || emailInput.value === null) can be stated just if(!emailInput.value )

but, yeah, there is not much to say. I think it is good.

Marked as helpful

0

Shiva 670

@shivaprakash-sudo

Posted

@icaroMendes777

Thank you for the useful suggestions.😊

1

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