🧮 Modern Vanilla JS Calculator

A sleek, responsive web calculator built with pure Vanilla JavaScript. It features a modern CSS Grid interface, comprehensive keyboard accessibility, and dynamic event handling.

[Live Demo Link Here] (Consider deploying to GitHub Pages and adding the link!)

---

📸 Screenshot

---

📖 Table of Contents

• Features
• Technical Architecture
• Installation & Setup
• Usage
• Future Improvements
• License

---

🖼️ Preview

(Add a screenshot or GIF of your calculator working here)

<img src="link-to-your-image.png" alt="Calculator UI Preview" width="400">

---

🚀 Features

• Complete Keyboard Integration: Fully mapped to physical keyboard events. Supports numbers, numpad operators (+, -, *, /), Enter for calculation, Backspace for delete, and Escape to clear.
• Responsive CSS Grid: The UI utilizes a scalable CSS Grid architecture, ensuring buttons are perfectly aligned and adapt gracefully to different screen sizes.
• Smart Input Handling: * Automatically prevents multiple leading zeros.
  • Replaces common typos (like typing x instead of *) behind the scenes.
  • Validates decimal placement to prevent malformed numbers.
• Safe Error Handling: Implements try...catch blocks to gracefully handle invalid mathematical expressions (e.g., 5++5) without crashing the application.

🧠 Technical Architecture

This project was built to demonstrate core DOM manipulation and efficient JavaScript design patterns without relying on external libraries.

• Event Delegation: Instead of attaching an event listener to every single button, the calculator attaches a single listener to the parent .buttons-grid container. This is significantly better for performance and memory management.
• Native Parsing: Mathematical logic is processed using JavaScript's native capabilities, with careful string sanitization applied before evaluation.

🛠️ Installation & Setup

1. Clone the repository:

   git clone https://github.com/pr0-gramm3r/Calculator.git

2. Navigate to the directory:

   cd Calculator

3. Run the application: Simply double-click the index.html file to open it in your default web browser. No local server or build tools are required.

🖱️ Usage

You can interact with the calculator in two ways:

1. Mouse/Touch: Click the UI buttons directly.
2. Keyboard: - Type numbers directly.
   • Use Enter or = to get the result.
   • Use Backspace to delete the last character.
   • Use Escape to clear the entire screen (AC).

🔮 Future Improvements

• Add a "Dark Mode" toggle.
• Implement a calculation history log.
• Build a custom parser to replace eval() for enterprise-level security.

---

Designed and developed by pr0-gramm3r.

---

How to use this:

1. Copy the text above.
2. Create a file named README.md in your project_3 folder.
3. Paste the text in.