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

Next.js for the app and Tailwind CSS for styles and responsiveness.

@danielchavezs

Desktop design screenshot for the Mortgage repayment calculator 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?

The responsive design. I´ve been used to building backend apps, but regarding to frontend, I have never dedicated enough time to styles, let alone responsivness. I´ts my first time using (therefore, learning) Tailwind CSS for both styles and this feature, so I´m happy that I was able to apply pretty much everything I had in mind with a tech that was new to me.

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

Pretty much everything related to Tailwind, responsivness and the global.css file configuration. I was completely new to Tailwind, so it was a little challenging, and of course it took me more time that I would have liked, but I am satisfied with both the results and my learning experience.

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

Not much really. Probablly would like to know about some of the solutions regarding the formating of the mortgage amount input number. I managed to apply it, but only once the user had stopped typing and would like to know a more dynamic solution if anyone has applied it to be a bit more real-time effective.

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