https://github.com/michojekunle/calculator-app
Simple Calculator Application, performs simple operations with good user interface and easy to use.
https://github.com/michojekunle/calculator-app
array-manipulations array-methods css3 dom-manipulation-functions javascript-applications theme-switcher
Last synced: 4 months ago
JSON representation
Simple Calculator Application, performs simple operations with good user interface and easy to use.
- Host: GitHub
- URL: https://github.com/michojekunle/calculator-app
- Owner: michojekunle
- Created: 2022-06-15T02:21:43.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2022-09-04T07:29:04.000Z (almost 3 years ago)
- Last Synced: 2025-01-13T04:42:39.469Z (5 months ago)
- Topics: array-manipulations, array-methods, css3, dom-manipulation-functions, javascript-applications, theme-switcher
- Language: CSS
- Homepage: https://my-calculator-application1.netlify.app/
- Size: 230 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Frontend Mentor - Calculator app solution
This is a solution to the [Calculator app challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/calculator-app-9lteq5N29). Frontend Mentor challenges help you improve your coding skills by building realistic projects.
## Table of contents
- [Overview](#overview)
- [The challenge](#the-challenge)
- [Screenshot](#screenshot)
- [Links](#links)
- [My process](#my-process)
- [Built with](#built-with)
- [What I learned](#what-i-learned)
- [Continued development](#continued-development)
- [Useful resources](#useful-resources)
- [Author](#author)
- [Acknowledgments](#acknowledgments)
**Note: Delete this note and update the table of contents based on what sections you keep.**
## Overview
### The challenge
Users should be able to:
- See the size of the elements adjust based on their device's screen size
- Perform mathmatical operations like addition, subtraction, multiplication, and division
- Adjust the color theme based on their preference
- **Bonus**: Have their initial theme preference checked using `prefers-color-scheme` and have any additional changes saved in the browser
### Screenshot
### Links
- Solution URL: [Github URL](https://github.com/michojekunle/Calculator-App)
- Live Site URL: [Live Project](https://my-calculator-application1.netlify.app/)
## My process
### Built with
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Vanilla Javascript
### What I learned
```js
More Flexibility with Javascript Arrays and Array Methods, got more insight on the beauty of the Switch Statement Javascript
and learned a new method the javascript eval() method
}
```
#Continued development
### Useful resources
- [Go to Resource](https://youtu.be/QS6Y0ezhyCs) - This helped me for with the array methods and the eval function used in this project. I really liked this pattern and will use it going forward.
## Author
- Website - [AMD](https://github.com/michojekunle)
- Frontend Mentor - [@michojekunle](https://www.frontendmentor.io/profile/michojekunle)
- Twitter - [@MichaelOjekunl2](https://www.twitter.com/@MichaelOjekunl2)
## Acknowledgments
Credits to Javascript Academy!! on youtube