https://github.com/haminimi/calculator
This browser calculator project is the final project of the foundations section in The Odin Project's curriculum.
https://github.com/haminimi/calculator
calculator css frontend javascript theodinproject webdevelopment
Last synced: about 1 month ago
JSON representation
This browser calculator project is the final project of the foundations section in The Odin Project's curriculum.
- Host: GitHub
- URL: https://github.com/haminimi/calculator
- Owner: Haminimi
- Created: 2023-08-17T17:30:17.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-05-22T13:04:11.000Z (over 1 year ago)
- Last Synced: 2025-03-03T06:42:50.244Z (7 months ago)
- Topics: calculator, css, frontend, javascript, theodinproject, webdevelopment
- Language: JavaScript
- Homepage: https://haminimi.github.io/calculator/
- Size: 918 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Calculator
## Description
This browser calculator project is a part of [The Odin Project](https://www.theodinproject.com/dashboard)'s [curriculum](https://www.theodinproject.com/lessons/foundations-calculator). The Odin Project provides a high quality web development education maintained by an open source community.
## [Live Preview](https://haminimi.github.io/calculator/)
## Main Features
- **Basic Mathematical Operations**
- **Auxiliary Buttons:** Sign Change, All Clear and Delete Button.
- **Operator Switching Ease:** This feature empowers users to effortlessly switch between operators during their calculations. Once a number and an operator have been entered, users can seamlessly change the operator by tapping another operator button.
- **Cumulative Equals:** The calculator's 'Cumulative Equals' feature allows you to repeatedly press the equals button after performing an operation. Each time you press equals, the calculator adds the last entered number to the current result, effectively creating a cumulative effect.
- **Decimal Numbers Support**
- **Responsive Design:** Consistent user experience across screens.
**To Do:**
- **Advanced Mathematical Operations**
- **Keyboard Support**
## Tech
**The project is built with:**
- HTML
- Vanilla JavaScript
- CSS
**Tools:**
- VS Code
- Git
## Reflection
This project is the final project of the foundations section in [The Odin Project](https://www.theodinproject.com/dashboard)'s [curriculum](https://www.theodinproject.com/lessons/foundations-calculator). Throughout this foundational phase we've covered the basics of web development and I've gained a strong grasp of the fundamental concepts. There is plenty more to explore and learn, but I'm able to create quite a bit at this point. I'm pretty comfortable working and building with HTML, Vanilla JavaScript and CSS and I'm looking forward to learning more, delving deeper into the more advanced topics and building more intricate and bigger projects.
## Credits
- The function getDisplayNumber is implemented following this [Web Dev Simplified](https://www.youtube.com/@WebDevSimplified)'s [tutorial](https://www.youtube.com/watch?v=j59qQ7YWLxw). The getDisplayNumber function takes a numeric value as its argument and returns a formatted string that represents the number in a user-friendly display format with proper thousand separators contributing to an improved user experience and more understandable numerical representation.
- The [CSS reset](https://www.joshwcomeau.com/css/custom-css-reset/) used in the project is created by [Joshua Comeau](https://www.joshwcomeau.com/).
## Happy coding!