https://github.com/emmanuelmarcosdeoliveira/calculator
Calculadora com React e TailwindCSS
https://github.com/emmanuelmarcosdeoliveira/calculator
react swc tailwindv4 vite
Last synced: 3 months ago
JSON representation
Calculadora com React e TailwindCSS
- Host: GitHub
- URL: https://github.com/emmanuelmarcosdeoliveira/calculator
- Owner: emmanuelmarcosdeoliveira
- Created: 2025-05-07T14:20:01.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-05-18T01:22:34.000Z (about 1 year ago)
- Last Synced: 2025-06-21T17:02:05.362Z (about 1 year ago)
- Topics: react, swc, tailwindv4, vite
- Language: JavaScript
- Homepage:
- Size: 37.1 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🧮 Calculadora | OFS
[](https://react.dev/)
[](https://vitejs.dev/)
[](https://tailwindcss.com/)
[](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
[](https://eslint.org/)
---
## 📋 Índice
- [📖 Sobre o Projeto](#-sobre-o-projeto)
- [🚀 Tecnologias Utilizadas](#-tecnologias-utilizadas)
- [🏗️ Arquitetura e Padrões](#️-arquitetura-e-padrões)
- [⚙️ Configuração e Instalação](#️-configuração-e-instalação)
- [📁 Estrutura do Projeto](#-estrutura-do-projeto)
- [👨💻 Desenvolvedor](#-desenvolvedor)
- [Contribua para o Projeto](#-Contribua para o projeto)
---
## 📖 Sobre o Projeto
Uma calculadora web moderna desenvolvida com React e TailwindCSS, oferecendo uma interface elegante e funcional para cálculos matemáticos. O projeto inclui histórico de operações persistente e design responsivo.
### ✨ Funcionalidades
- 🧮 Operações matemáticas básicas
- 📊 Histórico de operações
- 💾 Persistência de dados no localStorage
- 📱 Design responsivo
- 🎨 Interface moderna com gradientes
---
## 🚀 Tecnologias Utilizadas
### **Frontend**
- **React 19.1.0** - Biblioteca JavaScript para construção de interfaces
- **Vite 6.3.5** - Build tool e dev server
- **TailwindCSS 4.1.5** - Framework CSS utilitário
- **JavaScript ES6+** - Linguagem de programação
### **Ferramentas de Desenvolvimento**
- **ESLint 9.25.0** - Linter para JavaScript
- **SWC** - Compilador JavaScript rápido
- **Bun** - Runtime JavaScript e package manager
---
## 🏗️ Arquitetura e Padrões
### **Padrões de Projeto**
- **Context API** - Gerenciamento de estado global
- **Component-Based Architecture** - Componentes reutilizáveis
- **Custom Hooks** - Lógica reutilizável
- **CSS-in-JS com TailwindCSS** - Estilização moderna
### **Estrutura de Componentes**
```
src/
├── components/ # Componentes reutilizáveis
│ ├── Calculator.jsx # Componente principal da calculadora
│ ├── Button.jsx # Botões da calculadora
│ ├── Display.jsx # Display de resultados
│ └── ...
├── context/ # Context API
│ └── CalculatorContext.jsx
├── hooks/ # Custom hooks
└── constants/ # Constantes do projeto
```
---
## ⚙️ Configuração e Instalação
### **Pré-requisitos**
- Node.js (versão 18 ou superior)
- Bun (recomendado) ou npm
### **Instalação**
1. **Clone o repositório**
```bash
git clone https://github.com/emmanuelmarcosdeoliveira/calculator
cd calculator
```
2. **Instale as dependências**
```bash
# Com Bun (recomendado)
bun install
# Ou com npm
npm install
```
3. **Execute o projeto**
```bash
# Desenvolvimento
bun dev
# ou
npm run dev
# Build para produção
bun build
# ou
npm run build
```
4. **Acesse o projeto**
```
http://localhost:5173
```
### **Scripts Disponíveis**
- `dev` - Inicia o servidor de desenvolvimento
- `build` - Gera build de produção
- `preview` - Visualiza o build de produção
- `lint` - Executa o linter
---
## 📁 Estrutura do Projeto
```
calculator/
├── src/
│ ├── assets/ # Recursos estáticos
│ ├── components/ # Componentes React
│ ├── context/ # Context API
│ ├── hooks/ # Custom hooks
│ ├── constants/ # Constantes
│ ├── App.jsx # Componente principal
│ ├── main.jsx # Ponto de entrada
│ └── index.css # Estilos globais
├── public/ # Arquivos públicos
├── index.html # HTML principal
├── vite.config.js # Configuração do Vite
├── package.json # Dependências e scripts
└── README.md # Documentação
```
---
## 👨💻 Desenvolvedor
**Desenvolvido por Emmanuel Oliveira | OFS**
- 🚀 Desenvolvedor Full Stack
- 💻 Especialista em React e JavaScript
- 🎨 Apaixonado por UI/UX
- 📚 Sempre em busca de aprendizado
---
Emmanuel Oliveira
developed by 💖 [Emmanuel Oliveira](https://www.linkedin.com/feed/?trk=homepage-basic_sign-in-submit)
© Todos os Direitos Reservados
## Contribua para o projeto
> Clique na seta abaixo e veja como você pode contribuir para o projeto
Como fazer uma contribuição ao Projeto ?
- Familiarize-se com a documentação do projeto, que geralmente inclui guias de instalação.
- Explore o código do projeto para entender sua estrutura e funcionamento.
**Faça um Fork**
- Crie uma cópia (fork) do repositório original em sua conta do GitHub.
**Clone o Repositório**
Isso criará uma cópia local do projeto, onde você poderá fazer suas modificações.
**Crie uma Nova Branch:**
- Crie uma nova branch para isolar suas alterações.
- Isso facilita a organização do seu trabalho e a criação de pull requests.
**Faça as Alterações:**
- Crie funcionalidades, mude estilos ou resolva `bugs` que iram contribuir para a melhoria do Projeto.
**Crie um Pull Request:**
- Inclua uma descrição clara das suas alterações e explique como elas resolvem o problema ou melhoram o projeto.
- Solicitação: Envie um pull request para o repositório original, solicitando que suas alterações sejam incorporadas ao projeto.
**Revise e Responda a Feedback:**
- Colabore: Os mantenedores do projeto podem solicitar alterações ou fornecer feedback sobre o seu código.
## Contact
[](https://www.linkedin.com/in/emmanuel-marcos-oliveira/)
[](https://wa.me/5511968336094)
😁Obrigado por chegar até aqui!
## License
Released in 2025 This project is under the **MIT license**
[`voltar ao topo`](#-calculadora--ofs)
**⭐ Se este projeto foi útil para você, considere dar uma estrela!**
