A modern, feature-rich calculator web application built with React and TypeScript. This calculator handles arithmetic, trigonometric, and advanced mathematical operations while maintaining proper order of operations using the Shunting Yard algorithm.
- Basic Operations: Addition, subtraction, multiplication, division
- Trigonometric Functions: sin, cos, tan, asin, acos, atan, atan2
- Advanced Math: Square root, cube root, nth root, logarithms, factorials
- Statistical Functions: mean, standard deviation, combinations (nCr), permutations (nPr)
- Mathematical Constants: π (pi), φ (phi), e (Euler's number), infinity
- Comparison Operators: Supports mathematical comparisons (<, >, ≤, ≥, =, ≠)
- Intelligent Input: Auto-completion of parentheses and mathematical expressions
- Function Suggestions: Real-time suggestions with fuzzy search for mathematical functions
- Bracket Preview: Visual preview of auto-completed brackets
- Responsive Design: Works seamlessly on desktop, tablet, and mobile devices
- Theme Support: Three beautiful themes - Jade (default), Night (dark), and Earth (light)
- Interactive Keypad: Optional on-screen keypad for easy input
- History Management: Persistent calculation history with animations
- Precision Control: Adjustable decimal precision (2-15 decimal places)
- Angle Units: Support for degrees, radians, and gradians
- Precision Settings: Configurable result precision
- Theme Selection: Multiple color themes to choose from
- Keypad Toggle: Show/hide the virtual keypad
- Local Storage: All settings and history are automatically saved
- Node.js (version 16 or higher)
- npm or yarn package manager
- Clone the repository:
git clone https://github.com/bababubudev/calculator.git
cd calculator- Install dependencies:
npm install
# or
yarn install- Start the development server:
npm run dev
# or
yarn dev- Open your browser and navigate to
http://localhost:5173
npm run build
# or
yarn buildThe built files will be in the dist directory.
2 + 3 * 4 // Result: 14
(2 + 3) * 4 // Result: 20
2^3 // Result: 8
sqrt(16) // Result: 4
sin(30) // Result: 0.5 (in degree mode)
cos(pi/4) // Result: 0.7071... (in radian mode)
tan(45) // Result: 1 (in degree mode)
fact(5) // Result: 120
nCr(10, 3) // Result: 120
log(2, 8) // Result: 3 (log base 2 of 8)
root(27, 3) // Result: 3 (cube root of 27)
mean(1,2,3,4,5) // Result: 3
ans(1) // Returns the result of the most recent calculation
ans(2) // Returns the result of the second most recent calculation
5 > 3 // Result: true
2^3 = 8 // Result: true
sin(30) < 0.6 // Result: true
src/
├── components/ # React components
│ ├── calculator/ # Calculator-specific components
│ ├── header/ # Header components
│ ├── history/ # History management components
│ └── ui/ # Reusable UI components
├── context/ # React context providers
├── hooks/ # Custom React hooks
├── pages/ # Page components
├── styles/ # SCSS stylesheets
├── types/ # TypeScript type definitions
└── utils/ # Utility functions and evaluator
- Frontend Framework: React 18 with TypeScript
- Build Tool: Vite
- Styling: SCSS with CSS custom properties
- State Management: React Context + useReducer
- Icons: React Icons
- Math Engine: Custom evaluator using Shunting Yard algorithm
The calculator uses a custom mathematical expression evaluator built with:
- Tokenization: Breaks down input into mathematical tokens
- Shunting Yard Algorithm: Converts infix notation to postfix (RPN)
- RPN Evaluation: Evaluates the postfix expression
- Function Support: Handles mathematical functions with variable arguments
The calculator supports various configuration options:
- Angle Unit: Choose between degrees, radians, or gradians
- Precision: Set decimal precision from 2 to 15 places
- Theme: Select from three beautiful themes
- Keypad: Toggle the virtual keypad on/off
All settings are automatically saved to localStorage and persist between sessions.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- Built with React and modern web technologies
- Mathematical engine inspired by the Shunting Yard algorithm
- Icons provided by React Icons
- Typography using the Fira Sans font family
If you encounter any issues, please create an issue with:
- Steps to reproduce the bug
- Expected behavior
- Actual behavior
- Browser and device information