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 using React and Sass

Beygs• 130

@Beygs

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


Feedback appreciated!

Community feedback

P
Patrick• 14,325

@palgramming

Posted

Not bad at all. Seems like most of the logic works. The main thing that was irritating was the display going back to 0 after hitting the operator chosen. So 6 shows 6 then hit the + key and the display goes to 0. The real calculator beside my desk would have still shown the 6 until another number was chosen

if you want to challenge yourself you should add in the keyboard inputs

2

Beygs• 130

@Beygs

Posted

@palgramming Thanks for the feedback, I also looked at a real calculator before doing the display that had this « back to zero » thing going when I hit an operator. I will try other display options. Also I didn’t had the time yet to add keyboard inputs, but it was on the todo (I’m doing it today) 😉

0
P
Patrick• 14,325

@palgramming

Posted

@Beygs ok really interesting how Calculators all function a little different in real life. Well then do not worry about my zero comment

1
Beygs• 130

@Beygs

Posted

@palgramming I updated it, what do you think of it now?

0
P
Patrick• 14,325

@palgramming

Posted

@Beygs It looks really good nice job. It is much clearer

0
Beygs• 130

@Beygs

Posted

@palgramming Wonderful thanks a lot!

0
P
tediko• 6,580

@tediko

Posted

Hello, Beygs! 👋

Well done on this challenge! Today I finished this challenge also. Besides palgramming good feedback here's a few things I'd suggest you to take a look at:

  • Display some error message after user divide by zero instead of default javascript "infinity".

Keep up the good work! 💪

1

Beygs• 130

@Beygs

Posted

@tediko Hi! Thanks for your feedback and for the idea! I just finished implementing this. I also added keyboard inputs if you want to check, and I'm going to check your solution.

1
P
tediko• 6,580

@tediko

Posted

@Beygs Haha, good job! 🤩 Now I find other problem (sorry!). When divide by zero error pop up and I click + (or any other sign) it is adding NaN + number and the result of that is NaN obviously. Maybe try reset your calc after this divide error.

0
Beygs• 130

@Beygs

Posted

@tediko Oops! I forgot to test this possibility, thanks for pointing it out!

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