RockiRider / Js-Calculator

A Calculator with a beautiful UI using vanilla CSS and JavaScript

Home Page:https://tsotnegvadzabia.me/projects/calc/calcjs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Js-Calculator

Brief Intro

I set out to accomplish this project in order to see if I could efficiently create a working product from a design. I wanted to use vanilla JS and CSS in order to complete the project. I also timed myself and it took me 18h to produce this repository.

The working final product of this project can be found here

The design I was trying (successfully I think) to mimick can be found here

The actual design of the Calculator is one of Jordan Symingtons graphics, his awesome work can be found here

Description

The calcjs file is the finished project. The other two HTML files are my two previous attempts within the time period. These two files handle the calculations without using a JavaScript Array. I tried to do this at the begining in order to create a way to display the current calculations as well as the previous ones the user has entered. This method however made the UI look quite messy after a 2 or 3 calculations. Because of this I thought it would look a lot cleaner to create a JS array and use that to provide one calculation at a time.

Improvements to be made

I want to create a variable where the previous answer is saved and the user can press a button to call on the previous answer and input it within an equation. This would save the user from trying to rememeber the previous answer to their previous calculation.

I would also like to create an APP out of this to deploy on both IOS and Android using React Native. I think the UI is beautiful enough for users to want to use it over the standard Calculator Applications. However I would also like to add additional functions to this Calculator so it can assume the role of a Scientific Calculator when required.

About

A Calculator with a beautiful UI using vanilla CSS and JavaScript

https://tsotnegvadzabia.me/projects/calc/calcjs


Languages

Language:HTML 100.0%