Feedback for project calculator with HTML, CSS and Javascript

Hi Everyone,

Today I finished a calculator with HTML, CSS and Javascript for my portfolio. It can be used in the browser, no installation needed. The link for the GitHub page is: calculator app project
The link for the repository is: GitHub - Jolijn0101/calculator: an calculator app for my portfolio

I coded this calculator myself without a tutorial and now I am very curious what you guys think about it.
In my opinion it came out nicely although I have some improvement points:

  1. I get it only working with click events. I have tried to make it work with key events but it went wrong when I needed to combine the shift key and a letter to make a plus sign.
  2. I made a lot of eventhandlers in my HTML file and I wonder if I could code it another way.

Do you have any feedback for me?? please let me know.

1 Like

nice project, clean UI. One thing you can do is write a single function that listens to all the buttons. In this case button’s can have values and depending on the current element being clicked you can handle your click events with only one function and through some conditions, you can pass that button value to other functions you want to execute. Idk if that makes sense.

Hi abel939,
Thank you for your feedback and complement about my clean UI. It is a good idea to make one function instead of so many different ones and the knowledge of buttons that have values broth me on an idea. After reading your message I refactored my code. I collected all the buttons in one variable and added with .forEach eventhandlers to them to handle the calculator function and used the element .innerHTML as a parameter. It is difficult to exactly describe how I did it. The new code is on GitHub. You can find it at the same link as the old code if you’re curious.

Sure. I’ll check it out.

1 Like