This project is a classic calculator, created during a 6-month web development bootcamp focusing on React.js and TypeScript.
I created this project as a participant of a boot camp for web development focusing on React and Typescript. It was developed over the course of a single day in Visual Studio Code using HTML, CSS and Typescript.
The goal of this project was to spend the time deepening an understanding of Typescript functions in the framework of the second module of the bootcamp.
- Functions:
- Addition, subtraction, division, multiplication, modulo
- Clear all, delete last input
- Solve operation and continue calculating with result
- Display last operation above result
- Responsive design:
- Optimised for different screens
Markup:
Styling:
Programming language:
IDE:
Version Control:
You can check the calculator out here in your local browser. To run the project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/bebzbzbz/Calculator-Project.git
-
Install dependencies & run the development server:
npm install npm run dev
-
Open your local host and enjoy!
The playful, colourful design for this web calculator was inspired by both the flat, angular design of Sebastian Vigil's "Mortgage Calculator", as well as its vibrant blue, and the layout and colour assortment of Afrills' "MechaCalc - Calculator App". This combination makes for a modern look while ensuring a cohesive and visually appealing user experience.