An open API service indexing awesome lists of open source software.

https://github.com/gabyfachini/calculator

⌛In progress | A simple calculator application built with HTML and JavaScript that performs basic arithmetic operations.
https://github.com/gabyfachini/calculator

calculator calculator-javascript html web

Last synced: 5 months ago
JSON representation

⌛In progress | A simple calculator application built with HTML and JavaScript that performs basic arithmetic operations.

Awesome Lists containing this project

README

          

# 🧮 Calculadora JavaScript

Uma calculadora simples e funcional desenvolvida com **HTML**, **CSS** e **JavaScript**, capaz de realizar operações aritméticas básicas. A calculadora suporta tanto interações via **mouse** quanto via **teclado**, exibe **data e hora em tempo real** e conta com **efeito sonoro opcional**.

---

## 🚀 Funcionalidades

- ✅ Operações básicas: **adição (+), subtração (−), multiplicação (×), divisão (÷) e porcentagem (%)**
- ⌨️ Suporte para **entrada via teclado e mouse**
- 📋 Funcionalidade de **copiar e colar valores** (Ctrl + C e Ctrl + V)
- 🕒 Exibição de **data e hora em tempo real**
- 🔊 **Efeito sonoro de clique**, que pode ser ativado/desativado com **duplo clique no botão AC**
- ⚠️ **Tratamento de erros** para entradas ou operações inválidas

---

## 🛠️ Tecnologias Utilizadas

- **HTML5** — Estrutura da interface
- **CSS3** — Estilização e responsividade
- **JavaScript (ES6)** — Lógica e interatividade

---

## 📦 Estrutura do Código

- A lógica principal está encapsulada na classe **`CalcController`**, responsável por:

### ✔️ Gerenciar:

- 🎯 Eventos de clique e teclado
- ➕ Processamento das operações matemáticas
- 📲 Atualização do display da calculadora, data e hora
- 🔊 Controle do áudio (on/off)
- 📋 Funções auxiliares como **copiar e colar**

---

## 💡 Como Usar

1. Faça o download dos arquivos do projeto.
2. Abra o arquivo **`index.html`** no seu navegador de preferência.
3. Utilize a calculadora normalmente, clicando nos botões ou digitando pelo teclado.

---

## 📸 Prévia

> ![Calculator](https://github.com/user-attachments/assets/457e2592-cc59-4d13-b8f1-637bc8fa6602)

---

## 💻 Passo a Passo: Clonar Repositório no GitHub com Git

### Pré-requisitos

Certifique-se de que você tem o **Git** instalado na sua máquina.

### Passo 1: Localize o Repositório no GitHub

* Acesse o GitHub e navegue até a página do repositório que você deseja clonar.
* Procure pelo botão verde que diz **"Code"** (Código).

### Passo 2: Copie a URL de Clonagem

* Clique no botão **"Code"**.
* Você verá algumas opções (HTTPS, SSH, GitHub CLI). Para a maioria dos usuários, a forma mais simples é **HTTPS**.
* Copie a URL que aparece no campo do HTTPS (ex: `https://github.com/usuario/repo.git`).

### Passo 3: Abra o Terminal (ou Prompt de Comando)

Abra o seu terminal, Prompt de Comando (Windows) ou PowerShell.

### Passo 4: Navegue até o Diretório Desejado

Use o comando `cd` (change directory) para ir para a pasta onde você quer que o projeto seja salvo na sua máquina.

**Exemplo:**

```bash
cd ~/Documentos/Projetos
```

### Passo 5: Execute o Comando git clone
Use o comando git clone seguido da URL que você copiou no Passo 2.

### Passo 6: Verifique a Clonagem e Acesse a Pasta
O Git criará uma nova pasta com o nome do repositório (ou o nome que você especificou) e baixará todo o código para ela.
Pronto! O repositório foi clonado e você pode começar a trabalhar no código.