Project developed as part of The Odin Project – Foundations, focused on building a fully functional calculator using HTML, CSS, and Vanilla JavaScript.
This project brings together everything learned in the Foundations path, combining logic, DOM manipulation, event handling, and clean code structure into a single interactive application.
You can view the live version of this project here:
🔗 https://jormaedes.github.io/Calculator/
- Build a functional calculator from scratch
- Apply JavaScript logic to handle user input
- Practice DOM manipulation and event listeners
- Handle edge cases and invalid operations gracefully
During this project, I worked extensively with:
- JavaScript functions and control flow
- DOM selection and manipulation
- Event listeners for button interactions
- String and number conversions
- State management (current value, previous value, operator)
- Error handling (division by zero, multiple operators, etc.)
- HTML5 – semantic structure
- CSS3 – layout and visual styling
- Vanilla JavaScript – application logic
-
Basic arithmetic operations:
- Addition (+)
- Subtraction (−)
- Multiplication (×)
- Division (÷)
-
Clear / reset functionality
-
Decimal number support
-
Display update in real time
Calculator/
├── index.html
├── style.css
├── script.js
└── README.md
- Clone the repository:
git clone https://github.com/jormaedes/Calculator.git- Navigate into the project directory:
cd Calculator- Open
index.htmlin your browser
- Managing calculator state correctly
- Preventing invalid input sequences
- Handling decimal numbers properly
- Implementing chained operations
- Keyboard input support
- Improved UI/UX and animations
- Calculation history
- Mobile-first responsive layout
Jormaedes Luís Software Development Student 42 School | The Odin Project
⭐ A capstone-style project in the Foundations path, bringing logic and UI together.