Skip to content

Latest commit

 

History

History
61 lines (49 loc) · 3.2 KB

README.md

File metadata and controls

61 lines (49 loc) · 3.2 KB
Raw

Interactive Calculator 🧮💻

Project Overview

The Interactive Calculator is a web-based application designed to perform basic arithmetic operations through a graphical user interface. This project aims to provide users with a simple, intuitive, and visually appealing tool for conducting basic mathematical calculations.

Features

  • Basic Arithmetic Operations: Addition, subtraction, multiplication, and division.
  • User Interface: Clear and easy-to-use buttons for digits (0-9), operators (+, -, *, /), and additional functions like decimal point and all-clear (AC).
  • Real-Time Display: Immediate display of input and results.
  • Error Handling: Manages invalid inputs and operations robustly.
  • Responsive Design: Adapts to various screen sizes for optimal usability on different devices.

Technologies Used

  • HTML: For structuring the content and elements of the calculator.
  • CSS: For styling the calculator, enhancing its visual appeal and usability.
  • JavaScript: For implementing the functionality, handling user input, performing calculations, and updating the display.

Project Structure

interactive-calculator/
│
├── index.html
├── style.css
└── script.js

Setup and Usage

  1. Clone the Repository: 
    git clone https://github.com/yourusername/interactive-calculator.git
  2. Navigate to the Project Directory: 
    cd interactive-calculator
  3. Open the index.html File: Open the index.html file in your preferred web browser to load the calculator.

How to Use

  1. Load the Calculator: Open the index.html file in a web browser.
  2. Input Numbers and Operators: Click on the buttons to input numbers and select arithmetic operations.
  3. Perform Calculations: Press the equals button (=) to display the result of the current operation.
  4. Clear the Screen: Use the AC (all-clear) button to reset the calculator and start a new calculation.

File Descriptions

  • index.html: Defines the calculator's layout, including the screen and buttons, and includes necessary metadata and links to external CSS and JavaScript files.
  • style.css: Provides styling for the calculator, ensuring a user-friendly and aesthetically pleasing design. Utilizes CSS Grid for arranging the buttons and Flexbox for centering the calculator on the page.
  • script.js: Contains the logic for handling user interactions, performing calculations, and updating the display. Manages the state of the calculator, including the current display value, operands, and operator.

Contributing

Contributions are welcome! Please fork the repository and create a pull request if you have any improvements or suggestions. For major changes, please open an issue first to discuss what you would like to change.

Acknowledgements

  • Inspired by traditional physical calculators and modern web-based calculator applications.
  • Created with guidance from various online tutorials and documentation.

Enjoy using the Interactive Calculator! If you have any questions or feedback, feel free to reach out.

Feel free to customize the README file with your own GitHub repository URL and any additional information specific to your project.