Ferramentas de Desenvolvedor
Um conjunto de utilitários cotidianos para desenvolvedores — converter cores, gerar hashes criptográficos, trabalhar com timestamps Unix e decodificar JWTs.
Tarefas rápidas
Um clique abre a ferramenta já configurada para a tarefa.
Ferramentas para Desenvolvedores - Cores, Hashes, Timestamps e JWT
Esta é a categoria das pequenas conversões que interrompem o trabalho de verdade. Um design entrega uma cor HEX e o CSS quer HSL. Uma linha de log traz um timestamp Unix e você precisa saber que horas eram no seu fuso. Uma API devolve um token e é preciso ver o que há dentro. Uma página de download publica um SHA-256 e cabe conferir o arquivo. Nenhuma é difícil; todas são chatas na mão, e as quatro funcionam aqui sem conta.
O que há nesta categoria
| Ferramenta | O que faz | Quando usar |
|---|---|---|
| Conversor de Cores | Converte entre HEX, RGB e HSL | Uma paleta está numa notação e a sua folha de estilos quer outra |
| Gerador de Hash | Calcula MD5, SHA-1, SHA-256 e SHA-512 de um texto ou de um arquivo | Verificar um download, comparar dois arquivos ou gerar uma chave de cache |
| Conversor de Timestamp | Converte timestamps Unix em datas legíveis e de volta, entre fusos horários | Um log, uma coluna de banco ou uma resposta de API traz um número onde deveria haver uma data |
| Decodificador JWT | Separa um JSON Web Token e mostra cabeçalho, payload e validade | Você está depurando autenticação e precisa ver os claims |
| Removedor de CSS não utilizado | Mantém só o CSS que a página usa, a partir de uma exportação Coverage do Chrome ou do HTML | Um tema ou construtor de páginas carrega muito mais CSS do que a página precisa |
| Formatador de código | Formata ou minifica HTML, CSS, JavaScript e SQL, com dialetos SQL e a linguagem detectada automaticamente | Um bundle, um template ou uma consulta chegou como uma única linha ilegível, ou um trecho precisa ficar o menor possível |
| Explicador de expressões cron | Lê um agendamento cron em linguagem simples, campo por campo, com as próximas execuções no horário local ou em UTC | Um job roda na hora errada, ou você precisa ter certeza do que uma linha do crontab faz antes de publicá-la |
| Calculadora de Sub-rede | Rede, broadcast, faixa de hosts, máscaras e tipo de endereço para IPv4 e IPv6, e divide uma rede em sub-redes | Você está escrevendo uma regra de firewall, o plano de uma VPC ou a configuração de um roteador, e a faixa precisa estar exatamente certa |
| Analisador de User Agent | Lê o navegador, o motor, o sistema operacional e o dispositivo em qualquer string de user agent, e identifica crawlers de buscadores e de IA | Uma linha de log, um relatório de analytics ou um relatório de bug mostra um user agent que você precisa entender |
| JSON para Tipos | Transforma uma amostra de JSON em tipos TypeScript, Go, Python, C# ou Rust, ou em um JSON Schema | Uma API devolve JSON e o seu código precisa de modelos tipados para ele |
Notações de cor e por que vale conhecer HSL
HEX e RGB descrevem exatamente a mesma coisa com caligrafias diferentes: #4F46E5 é rgb(79, 70, 229), três canais de 0-255 escritos em hexadecimal em vez de decimal. Converter entre eles é mecânico.
HSL é um modelo genuinamente diferente, e por isso merece o seu lugar. Descreve uma cor como matiz (posição na roda de cores, 0-360), saturação (quão viva, 0-100%) e luminosidade (0-100%). O ganho prático: escurecer uma cor em 10% para um estado hover é uma única mudança num número, e montar uma paleta de tons relacionados significa manter matiz e saturação fixos e caminhar pela luminosidade. Fazer o mesmo em HEX significa recalcular três canais e adivinhar.
Contraste é a outra razão. Texto precisa de uma razão de contraste de pelo menos 4,5:1 contra o fundo para cumprir o WCAG AA em tamanhos normais. A luminosidade em HSL prevê muito melhor onde você está do que encarar um código hexadecimal.
Hashes: para que servem e para que não
Uma função hash transforma qualquer entrada numa impressão digital de comprimento fixo. A mesma entrada sempre dá a mesma saída; mudar um caractere dá uma completamente diferente; e não se volta do hash para a entrada. Isso faz dos hashes a ferramenta certa para verificar integridade e a errada para guardar senhas.
| Algoritmo | Saída | Situação |
|---|---|---|
| MD5 | 128 bits | Quebrado para segurança. Colisões podem ser fabricadas de propósito. Serve como soma de verificação sem fins de segurança ou chave de cache |
| SHA-1 | 160 bits | Quebrado desde 2017. Ainda aparece em sistemas antigos e nos IDs de objeto do Git; não escolha para nada novo |
| SHA-256 | 256 bits | O padrão atual para verificar arquivos, assinaturas e certificados |
| SHA-512 | 512 bits | A mesma família com digest maior, muitas vezes mais rápido em hardware de 64 bits |
O uso do dia a dia é verificar um download: o site publica um SHA-256, você calcula o hash do arquivo recebido com o gerador de hash, e as duas strings batem caractere por caractere ou não batem. Isso pega tanto um download truncado quanto um espelho adulterado.
Para o que hashes não servem é para senhas. Um SHA-256 simples de uma senha é atacável a bilhões de tentativas por segundo em hardware comum. Guardar senhas exige uma função lenta, com sal e feita para isso - bcrypt, scrypt ou Argon2 -, cara de propósito. Se você está fazendo hash de senha com algo da tabela acima, isso é um bug. O gerador de hash tem uma aba bcrypt exatamente para isso: ela gera um hash bcrypt com o custo que você escolher e verifica uma senha contra um hash armazenado, e a página do bcrypt a abre diretamente.
Timestamps Unix e a confusão de fusos
Um timestamp Unix conta segundos desde a meia-noite UTC de 1 de janeiro de 1970. Ele não tem fuso horário, e é exatamente por isso que os sistemas o usam: é um instante inequívoco e qualquer linguagem consegue transformá-lo em hora local para exibição. Um número de dez dígitos são segundos; um de treze são milissegundos, que é o que Date.now() devolve em JavaScript e uma causa muito comum de datas aterrissando em 1970 ou no ano 55000.
O conversor de timestamp vai nos dois sentidos e mostra o resultado em UTC ao lado da sua hora local, que costuma ser a comparação de que você realmente precisa ao ler um log escrito num servidor de outra região. Duas datas que vale conhecer: 2147483647 é o último segundo que cabe num timestamp de 32 bits com sinal, em janeiro de 2038, e 0 é a própria época - um timestamp 0 ou uma data de 1 de janeiro de 1970 quase sempre significa que um valor nunca foi definido.
Ler um JWT
Um JSON Web Token são três segmentos Base64 seguros para URL separados por pontos: um cabeçalho dizendo qual algoritmo o assinou, um payload de claims e uma assinatura. O decodificador JWT separa tudo e mostra os dois primeiros como JSON legível, com exp e iat convertidos em datas - normalmente a pergunta inteira quando uma requisição está sendo rejeitada.
Duas coisas precisam ficar claras. Primeiro: o payload não é criptografado. Qualquer um com o token consegue ler todos os claims, então um JWT não é lugar para nada privado. Segundo: decodificar não é verificar. Ler os claims diz o que o token afirma, não se a assinatura é válida. Só o servidor que tem a chave pode responder isso, e nenhuma ferramenta de navegador deveria pedir que você cole o seu segredo de assinatura para descobrir.
Como um token é uma credencial viva enquanto for válido, importa onde você o cola. Este decodificador roda inteiramente no seu navegador - o JavaScript analisa o token na sua máquina e nada é enviado a lugar nenhum, o que você pode confirmar no painel de rede.
Categorias relacionadas
- Ferramentas de codificação - sob um JWT existe Base64 seguro para URL, e saber disso explica a maioria das falhas de decodificação.
- Geradores - criam os identificadores e segredos que estas ferramentas depois inspecionam.
- Ferramentas de texto - formate o JSON que sai de um payload decodificado.
- Ferramentas de imagem - converta recursos enquanto avança na mesma tarefa de design.