Markup
Interface em HTML puro
A interface é definida em uma única página HTML, incluindo alternadores de moeda, modal de teclado, painel de informação, modal de ajuda e áreas dinâmicas para conversões entre BTC, SATS e moedas fiduciárias.
Stack principal
O que sustenta esta ferramenta de conversão de Bitcoin e por que ela é mais rica do que uma página estática básica.
Estilo
CSS customizado
O sistema visual é totalmente customizado e inclui identidade visual, comportamento responsivo, suporte a teclado mobile, assets de ícones e suporte a dark mode.
Estrutura JavaScript
Separação entre core e app
O projeto separa a lógica de conversão de baixo nível da orquestração de interface. Isso torna preço, formatação, tradução, interação e renderização mais sustentáveis do que um script único.
Dados ao vivo
API externa de preço do Bitcoin
O app usa preços em tempo real para as conversões e para acompanhar variação, então ele é estático na estrutura, mas depende de uma fonte externa de mercado para entregar toda a funcionalidade.
Experiência
Recursos multilíngues e mobile
A calculadora suporta inglês e português, inclui tratamento específico para Android, fluxo com teclado customizado, lógica de dark mode e interações mais ricas com modais e painéis.
Os valores em BTC também são exibidos com espaçamento fino agrupando as oito casas decimais (por exemplo, 1.23 456 789), o que facilita a leitura dos valores em sats.
Modelo de runtime
Sem bundler ou framework
O projeto não tem manifesto de pacotes nem framework frontend. Ele se mantém leve ao depender de JavaScript de navegador, assets locais e um pequeno conjunto de scripts organizados manualmente.
Como roda
A calculadora combina assets estáticos com dados de mercado em tempo real dentro do navegador.
1
O navegador carrega a estrutura estática
index.html carrega a interface principal, assets de ícone, estruturas de modal e os arquivos JavaScript de entrada.
2
A lógica central inicializa a conversão
js/core.js concentra a lógica de moeda, a formatação de exibição, os dados de tradução e o comportamento principal da calculadora.
3
A lógica da aplicação conecta a UI
js/app.js coordena animações, painéis informativos, dark mode, tratamento de Android e o fluxo interativo dos displays e modais.
4
Dados de mercado atualizam a tela
O app busca preços de Bitcoin em uma fonte externa e usa esses dados para calcular equivalências entre BTC/SATS e moedas fiduciárias, além de mostrar variações por período.
5
O estado do usuário fica no navegador
Interações como idioma e preferência de dark mode são tratadas localmente, o que mantém o app leve, mas ainda bastante dinâmico.
Mapa da arquitetura
O projeto é estático, mas é organizado mais como um pequeno aplicativo artesanal do que como uma página única de demonstração.
Arquivos principais
index.htmlInterface principal, marcação dos modais, carregamento de assets e pontos de entrada dos scripts.
css/styles.cssTodos os estilos, layout, responsividade e modos visuais.
js/core.jsLógica de conversão, dicionário de tradução e comportamento de formatação.
js/app.jsInterações da UI, comportamento de modais e painéis, dark mode e lógica específica de mobile.
assets/Assets de marca e interface, como ícones e imagens.
archive/Versões anteriores ou experimentais mantidas para referência.
Análise da Arquitetura
index.html css/styles.css js/core.js js/app.js assets/ archive/
Este é um bom exemplo de projeto que continua sendo “HTML/CSS/JS puro”, mas já tem profundidade suficiente de interação para se comportar como um pequeno produto.
Dados e armazenamento
O app mistura preços em tempo real com preferências e estado de interação salvos no próprio navegador.
Dados externos
Os preços vêm de uma API
A calculadora usa preço de Bitcoin em tempo real em vez de apenas valores fixos.
A conversão depende desses dados de mercado estarem disponíveis.
A visualização de preço inclui janelas de variação em diferentes períodos.
Isso deixa o projeto mais dinâmico do que uma calculadora estática offline.
Estado local
Preferências ficam no navegador
A preferência de idioma é tratada localmente.
O dark mode é persistido em localStorage.
Tratamentos de Android e fluxo de teclado ficam no navegador.
Não existe conta, backend de persistência nem banco de dados.
Comandos para rodar
O app pode ser aberto diretamente ou servido por qualquer servidor estático mínimo.
Uso local
open index.html # ou python -m http.server
O README sugere servir com um pequeno servidor local, mas o projeto em si não tem etapa de instalação nem build.
Ambiente esperado
O que o projeto precisa
Nenhuma configuração de package manager.
Nenhum framework em runtime.
Nenhuma variável de ambiente.
Acesso à rede para buscar o preço ao vivo do BTC.
Resumo final
BTC Calculator é um app estático orientado ao navegador construído com HTML, CSS e JavaScript modular vanilla, mas vai além de um utilitário estático simples ao incorporar dados de mercado do Bitcoin em tempo real, interface multilíngue, dark mode e interações específicas para mobile.