The next project for me to tackle (after the Pomodoro Timer) actually meant moving backwards. [What??] Thanks to freeCodeCamp‘s seemingly constant updates to their curriculum, the next project for me to work on had swapped places with the timer while I was working on it!

This goal of this project was to create a JavaScript calculator.

The requirements for this project were to:

• add, subtract, multiply, or divide two numbers
• clear the display with a ‘clear’ button
• chain mathematical operations together (so I can perform many operations without pressing the ‘equals’ button, and when I do the calculator will give me the correct result)

Check out my JavaScript Calculator here!

While I was working on it, I could definitely see why it had been moved places so that fellow ‘campers’ would make the calculator first, followed by the timer. The calculator took me less than a week to complete, where the timer took me at least a month!

For the calculator, one of the things I really wanted to work on was making the design more polished. I felt like a lot of my previous projects have been quite flat, so I’d decided that I would push myself to use Bootstrap and devote a lot more of my time working on the project to the aesthetic. I’m glad that I used Bootstrap- I think it made such a button-filled project a lot easier, and less intimidating. This did have one downside though- a problem I’m not sure I can solve: I used <input> for the buttons, but can’t target the active state in the css [though I can target the hover state] to make the active state background colour match the normal colour of each button…

I did mention previously that I was considering using jQuery for an upcoming project- I didn’t do that for this one. On reading the brief I already felt like I had a pretty good idea of what to do and was excited to use vanilla JavaScript for it.

I think I also developed better working habits while I was working on this project. I focused on a single row of number buttons, the addition, and the equals buttons. The number buttons were easy enough to figure out [saying that, I think I still changed it a bit quite late on!] and it took a little bit of time for me to figure out the best way to be able to ‘chain’ equations, but I really focused on making a single thing work at a time. I felt like this project went a lot smoother than previous ones, so I’m going to try to keep reminding myself about this and continue working that way in the future.