Mortgage repayment calculator

Community feedback

• 

  Dylan Heslop•1,570

  @dylan-dot-cPosted 10 days ago

  Well done completing this challenge. The design looks good.

  There are a few small issues you'll need to adjust.

  • The card isn't vertically centered, I see you used h-full which is height: 100%; but what you need is h-screen, height: 100vh; to make it fully centered.
  • Your javascript code seems good and you've included comments but a key issue is your error handling. You only used an alert to let the user know what is wrong, but not actually telling them what they need to fill in. This is important for UX, so you basically need to handle errors more gracefully. You can start simple by using native form errors and build up on that. But invalid fields should be red and so on. You can use :invalid or user-invalid to help.
  • You should also put the eventListener on the form not on the button, that is to say add form.addEventListener('submit', () => {}) instead of having the click listener on the button.

  Overall everything looks alright. Great job.

  Please check out my solution and tell me what you think about it.

  Marked as helpful

  1