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 vanilla js

@abhijitbcob

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


Tried to handle calculation syntax error 🤯 like windows calculator does.

This challenge became little challenging when I was trying - calculator will automatically turn the incorrect syntax into correct syntax, like the use cases:

  • user pressing equal key (=) without giving operator and operands
  • user just input single operand and then pressing equal key(=)
  • user input an operand that has only decimal point but no digit
  • one calculation is just finished but user again pressing equal key without giving any input
  • user input operator(+,-,/*) without inserting operands
  • user using the calculation result as a the first operand

please know me your feedback, any suggestions, bugs

Community feedback

hardy 3,660

@hardy333

Posted

Hey, very impressive solution good job, design looks exactly the same as design files , theme switcher works great , calculator is responsive ... everything is on point.

One thing I might will think of change would be the size of calculator on desktop view, for me it is little too big, gaps between buttons needs to be little smaller, just like on tablet view.

In terms of functionality everything works great, for edge cases like when user presses "=" after let's say 8/ input I think calculator should return 8, so the logic is eight divided by nothing is steel 8 - I guess, at least my smartphone calculator works that way and I implemented this logic on my solution.

Good luck and keep up the good work ....

3

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