Mortgage Calculator - Next.js + React Hook Form + Zod
Design comparison
Solution retrospective
My ability to manage validations, particularly those involving numbers, was honed through this project, and I'm happy with the way I was able to present error messages that were in line with the schema. In the future, I would use an external library like numeral.js for formatting numbers.
Community feedback
- @35degreesPosted 9 days ago
Nice job! Really clean look and feel. Works great. When the red error alerts pop up, they expand the height of the entire container very abruptly, maybe there's a way to account for their height using opacity and not have the entire box size change? Otherwise, it's great work, looking forward to seeing your next contribution.
Marked as helpful1@celemarPosted 9 days ago@35degrees Thank you for the feedback! There are certainly ways to prevent the size change, such as adjusting the minimum size of the element with the error. I remember leaving it this way because the presented design also had the container size change, and I always try to get as close to the design as possible.
0
Please log in to post a comment
Log in with GitHubJoin 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