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

Intro Component with Signup Form

Nyein Chan Layā€¢ 350

@CrystalNyein

Desktop design screenshot for the Intro component with sign-up form coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feedbacks are very much appreciated.

Community feedback

Yazdunā€¢ 1,310

@Yazdun

Posted

Hello Nyein and great job šŸ‘ I have some suggestions on this :

  • First, Wouldn't it be cooler if button had some hover effects? šŸ˜
  • I noticed you've been used div for form which is not best approach, best is use form tag itself and on submit you can use something like
btn.addEventListener("click", (e) => {
  e.preventDefault();
  validateForm();
});
  • For javascript, I noticed so many if and else which was not necessary, you can write a function for that then just pass the parameters to the function, so you can totally avoid if and else repetition.

Here I have some good resources that you maybe interested in :

āœ… Also I opened a pull request to your solution repo which will add a function to validate your inputs so you can get rid of some of those if and else, Also I added some hover effects to your button I hope you're ok with that šŸ˜ƒ

SIDE NOTE: For validate function, I wanted to add a foreach loop so we wouldn't need to call the function 4 times, but I thought it would get too complicated and so different from your code, so I kept it simple a little bit. You can look into map function yourself later on.

I hope this was helpful

Marked as helpful

0

Nyein Chan Layā€¢ 350

@CrystalNyein

Posted

@Yazdun Thank you so much. I'm still on my way learning so these feedbacks are very valuable for me. It'll help me improve my coding styles a lot. I'll try that function too. Thanks for the pull request too so that I can check out how I can change those code in the future usage.

0
Yazdunā€¢ 1,310

@Yazdun

Posted

@CrystalNyein Glad I could help

0
Manojā€¢ 245

@Manojraj07

Posted

@CrystalNyein, Design looks cool!

0

Nyein Chan Layā€¢ 350

@CrystalNyein

Posted

@Manojraj07 Thank you

0

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