Smart Calculator

Problem

Most web calculators look outdated and lack advanced functionality. I wanted to create a responsive, interactive calculator that not only handles basic arithmetic but also supports scientific functions like trigonometry, logarithms, and memory operations.

Approach

• Designed a clean and responsive UI using modern CSS and React components.
• Implemented core calculator logic with state management using React Hooks.
• Added advanced features such as square roots, trigonometric functions, and history tracking.
• Deployed using GitHub Pages with PNPM and Vite configuration for fast builds.

Solution

I built a full-featured calculator app that combines simplicity and power. It includes a real-time display, delete and clear options, memory storage (M+, M-, MR, MC), and trigonometric calculations with a compact scientific layout — all optimized for desktop and mobile experiences.

Technical Stack

React, JavaScript (ES6+), Vite, PNPM, CSS3 (Grid/Flexbox), GitHub Pages.

Code Snippet

// Example: Handling trigonometric functions
function handleFunction(fn) {
  let value = parseFloat(result || input);
  switch (fn) {
    case "sin": return Math.sin((value * Math.PI) / 180);
    case "cos": return Math.cos((value * Math.PI) / 180);
    case "tan": return Math.tan((value * Math.PI) / 180);
    default: return value;
  }
}
          

Results

• Delivered a fully interactive, mobile-friendly calculator.
• Added memory and history tracking for enhanced usability.
• Improved learning of JavaScript logic, React state, and Vite deployment.