Skip to content

An accessible, youth-friendly, and responsive component-based Calculator app written with JavaScript & React.

License

Notifications You must be signed in to change notification settings

PompaDonpa/Calculator

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Calculator

Live Site

https://daniel-naranjo-calculator.netlify.app/

Trello Board

  • An accessible, youth-friendly, and responsive component-based Calculator app written with JavaScript  &  React.

  • The calculator utilizes JavaScript libraries to implement the fastest build-in methods to solve Math.

  • This app is accessible, passing the Lighthouse audits and resolving potential security vulnerabilities.  Performance : 99%

Calculator Acceptance criteria & UI Design

  • I can see a number keypad on the calculator with the numbers 0-9
  • I can see keys for the plus, subtract, multiply and divide operators.
  • I can see an equals = key.
  • I can see a +/- key.
  • I can see an all clear key AC.
  • I can see a "screen" which shows a default value of 0.

Functionality


I can enter readable +/- integers

  • I can click a number key and see the number on the screen.
  • I can enter multi-digit numbers on the keyboard and see them on the screen.
  • When I enter a number of 1,000 or more, I see commas appear in the right place to format the number.
  • I can make a positive number negative (or vice versa) with the +/- key.

I can add, subtract, multiply and divide

  • I can enter a number, +. another number, then = and see the correct addition result.
  • I can enter a number, -. another number, then = and see the correct subtraction result.
  • I can enter a number, x. another number, then = and see the correct multiplication result.

ScreenShots

  • Operations


    Operations
  • Scientific notation


    Scientific notation
  • Preserve State


    Preserve State


Libraries


  1. math.js
  • npm install mathjs
    
    import { create, all } from 'mathjs'
    
    const config = { }
    const math = create(all, config)
  1. css-doodle
  • npm install css-doodle
    
    import 'css-dodle'
  1. React-Toastify
  • npm install --save react-toastify
    import { ToastContainer, toast } from 'react-toastify'
    
    import 'react-toastify/dist/ReactToastify.css'
    
    import { Slide, Zoom, Flip, Bounce } from 'react-toastify'


FrontEnd





BackEnd





made by    Daniel Naranjo  2021

About

An accessible, youth-friendly, and responsive component-based Calculator app written with JavaScript & React.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published