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

Calculator App

@catherineisonline

Desktop design screenshot for the Calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello, Frontend Mentor community! This is my solution to the Calculator App.

I appreciate all the feedback you left that helped me to improve this project. I fixed the issues I had previously and added new features per your recommendation.

I have done this project a while ago however if you are here and have any feedback, tips, or ideas to share, I will be more than glad to hear them out!

Thanks

Community feedback

@Jeth0214

Posted

Hi Catherine good job. Your solution was almost the same with the design. I just found an issue when I am clicking your "." button like this "9.96." . I can put 2 decimal point. I think maybe you can check if the value has already a decimal point when clicking the "." button then just return if it is has .

Marked as helpful

3

Jumagobe• 1,000

@Jumanjigobez

Posted

Catherine I think you should also work on the overflow of the numbers in the input field. When the numbers are excess they tend to overflow in your calc. Otherwise it is nice.

Marked as helpful

1

Renato Granados• 180

@Renato6GS

Posted

Congratulations Cathering, your deisgn is excellent.

When I use the calculator via my keyboard, the app freezes. Maybe an infinite loop? I recommend you use try/catch in the math operations, with that way, maybe the main thread won´t freeze

Marked as helpful

1

mr_sajjad_dev• 60

@sajjadnazaridev

Posted

You have developed it very attractive and it is not much different from the original version

3

Jared Clark• 30

@helloredfox

Posted

Amazing work!

There is one feature missing that can be found on dedicated calculators - pressing the enter button repeatedly will perform the most recent operation again. For example: 10+9 (Enter) shows 19 on the screen. Hitting Enter again should perform the +9 calculation again, and again, and as many times as the user hits enter.

This is a pretty nit-picky comment, but your calculator is beautiful and fully functional! I love the smooth color transitions. Great job!

1

@catherineisonline

Posted

@helloredfox Thanks for the suggestions! I struggled really a lot back then to build the logic haha. I will definitely go back and try to fix this issue. Thank you!

1
Nigel• 100

@nigelvidaaal

Posted

Congratulations, Excellent solution! I'm working to improve my accuracy on measurements on building challenges and projects, such. Is there any particular video that taught you how to do so?

1

lilKriT• 380

@lilKriT

Posted

@nigelvidaaal You can either "eyeball it" or you can use tools like figma / XD to measure it pixel by pixel.

1

@catherineisonline

Posted

@nigelvidaaal Thank you! I am putting images in Figma and checking sizes there as well as using the Chrome extension Perfect Pixel

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