Skip to content

Latest commit

 

History

History
44 lines (35 loc) · 2.51 KB

README.md

File metadata and controls

44 lines (35 loc) · 2.51 KB

🧮 Interactive Web Calculator

Status HTML5 CSS3 JavaScript

💡 The Logic Challenge

This project serves as the final milestone (Task 3) of my CodSoft Virtual Internship.

After mastering structure and design in my previous tasks, this project was dedicated to Algorithmic Logic. The goal was to build a fully functional calculator that doesn't just look good, but thinks correctly—handling user inputs, processing arithmetic operations, and returning accurate results in real-time.

🔗 Live Demo

Click here to try the Calculator (If the link doesn't work here, check the "About" section on the right side of this repository!)

⚡ Features

  • Arithmetic Operations: Performs addition, subtraction, multiplication, and division flawlessly.
  • Responsive UI: A clean, grid-based layout that keeps buttons accessible and easy to read.
  • Interactive Feedback: Buttons respond visually to clicks, providing a tactile feel to the web application.
  • Error Handling: Handles basic calculation edge cases smoothly.

🧠 Technical Learnings

Transitioning from static pages to a dynamic application taught me the fundamentals of programming logic:

  1. DOM Manipulation: I learned how to "listen" to button clicks in HTML and trigger specific functions in JavaScript.
  2. String Parsing & Evaluation: Understanding how to take a string of text (e.g., "5+5") and process it as a mathematical equation.
  3. UI/UX Grid Systems: I used CSS Grid/Flexbox to ensure the keys were perfectly aligned, mimicking the familiarity of a physical calculator.
  4. State Management: Tracking the current input versus the stored result.

💻 Tech Stack

  • HTML5: Structure of the display screen and keypads.
  • CSS3: Styling the "look and feel," focusing on color contrast and button layout.
  • JavaScript: The brain behind the calculator (handling the math logic).

🏃🏻‍♀️ How to Run Locally

  1. Clone the repository: 
    git clone https://github.com/tsdebug/codsoft_task-3.git
  2. Navigate to the project folder.
  3. Open index.html in your browser.

Built to calculate, coded to learn.