CalculatorX ✨

A modern, feature-rich web calculator built with a clean, responsive UI and a focus on a great user experience. This project was developed using modern web technologies like Vite and Tailwind CSS, resulting in a fast, efficient, and highly customizable application.

➡️ Live Demo ⬅️

---

📋 Features

This isn't just a basic calculator. It includes a variety of features designed for a better user experience:

• Dual-Theme Interface: Toggle between a sleek dark mode and a clean light mode. Your preference is saved locally!
• Test Mode: An interactive mode to practice your arithmetic skills! The calculator generates problems for you to solve and tracks your score.
• Standard Arithmetic Operations: Perform addition, subtraction, multiplication, and division (with whole number results in test mode).
• Advanced Operations: Includes percentage (%) and sign change (+/-) functionalities.
• Operation History: The last completed calculation is always visible for quick reference in normal mode.
• Full Keyboard Support: Use your physical keyboard for all inputs and functions.
• Responsive Design: A great user experience on both desktop and mobile devices.
• Modern UI: Built with Tailwind CSS and enhanced with custom icons from the Lucide icon set.

---

🛠️ Tech Stack

• Vite: For a blazing-fast development experience and an optimized build process.
• Tailwind CSS: A utility-first CSS framework for rapid and consistent UI development.
• Vanilla JavaScript (ES6+): All logic is handled with modern, clean JavaScript without any external frameworks.
• Lucide Icons: For clean, lightweight, and consistent icons.
• GitHub Pages: For deployment.

---

🚀 Getting Started

To get a local copy up and running, follow these simple steps.

Prerequisites

You need to have Node.js (which includes npm) installed on your machine.

Installation & Usage

1. Clone the repository:

   git clone [https://github.com/ericpastorm/CalculatorX.git](https://github.com/ericpastorm/CalculatorX.git)

2. Navigate into the project directory:

   cd CalculatorX

3. Install NPM packages:

   npm install

4. Run the development server:

   npm run dev

   The application will be available at http://localhost:5173/ (or another port if 5173 is in use).

---

📦 Deployment

This project is configured for easy deployment to GitHub Pages.

1. Make sure the base property in vite.config.js matches your repository name (e.g., base: '/CalculatorX/').
2. Run the deploy script:

   npm run deploy

   This command will build the project and push the contents of the dist folder to the gh-pages branch.

---

👤 Author

Eric Pastor

• Portfolio: ericpastor.dev
• GitHub: @ericpastorm

---

📄 License

This project is licensed under the MIT License.