This is a solution to the Calculator challenge. FreeCodeCamp is a platform to to help people learn to code for free.
Build a functional calculator using JavaScript and a front-end framework. The user should be able to:
- Add, subtract, multiply and divide a chain of numbers of any length, and when they hit =, the correct result should be shown
- When inputting numbers, my calculator should not allow a number to begin with multiple zeros
- Perform any operation (+, -, *, /) on numbers containing decimal points
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- A little bit of Bootstrap
- React - JS library
This project was bootstrapped with Create React App.
In the project directory, you can run:
npm install
then
npm start
Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits. You will also see any lint errors in the console.
The logic for this project was challenging, but I tried to come up with my own solution and keep my code as clean as I could. I used class based components and I feel I really learned a lot about how React works after this project.
Although I learned a lot with this project, I would like to redo it using React hooks in the future. I would also like to add a feature that I noticed almost all calculators have these days, which makes it easier to use %. For example, take 100 - 10%. My calculator would show 99.9 as 10% alone is 0.1, whereas a smartphone calculator usually deducts that the user wants to know what 100 minus 10% of 100 is and shows 90 as a result.