Comando: cat .colophon.md
Colophon
A ideia
O site é uma janela de terminal. Cada página é a saída de um comando, e os próximos comandos aparecem no fim de cada página como links, então dá para navegar sem digitar nada. Com JavaScript, o último prompt de cada página vira um terminal de verdade, e Ctrl+K (⌘K no Mac) abre uma paleta de comandos com as páginas e as ações. Os três caminhos saem da mesma fonte de conteúdo, e tudo se lê sem JavaScript: o terminal e a paleta são outro caminho, nunca o único.
Stack
- Astro 7 gera HTML estático; Preact fica reservado para as partes interativas.
- TypeScript estrito em tudo, com o conteúdo validado por schema no build.
- Uma função no servidor, a do formulário de contato, com envio pelo Resend.
- Hospedagem na Vercel, com deploy só depois de o CI passar inteiro: lint, tipos, testes unitários e de integração, build e testes no navegador, com e sem JavaScript, incluindo acessibilidade.
Cores e tipos
A janela segue o Terminal do macOS: fundo quase preto, prompt verde, diretórios e links em azul, erros em vermelho e, na seção de segurança, roxo, a cor do purple team, que junta ataque e defesa. Esse tema escuro é o padrão para todo mundo, seja qual for a configuração do sistema. O tema claro, no estilo do perfil “Basic” do Terminal, só entra quando você escolhe: no botão “tema” da barra de status, com theme papel no terminal ou pela paleta. Um teste lê as cores do próprio código e confere o contraste AA da WCAG de cada cor de texto contra cada fundo da janela, nos dois temas.
O texto usa IBM Plex Mono. A barra de título usa a fonte de interface do sistema, com IBM Plex Sans como reserva, e o CV impresso sai em IBM Plex Sans. As duas são servidas pelo próprio site, sem requisição a terceiros.
A chuva
A chuva de código do fundo é feita de dados reais: o hash do build que você está vendo, os nomes dos comandos do terminal e os caminhos dos arquivos. Ela não passa por baixo do texto e começa rápida. Para quem pede menos movimento no sistema, ela começa desligada, e dá para ligar se quiser; com as cores forçadas do modo de alto contraste, fica sempre desligada. O botão “chuva” da barra de status pausa e retoma, e no terminal rain on|fast|calm|off escolhe entre rápida (on e fast são a mesma), calma e desligada. Ela para quando a aba fica oculta, pausa depois de cinco minutos sem atividade e volta quando você mexe na página, e fica calma com a bateria fraca.
Segurança do próprio site
- CSP por hash em todas as páginas e
frame-ancestors 'none', além de HSTS,nosniff, Referrer-Policy e Permissions-Policy. - Nenhum HTML montado a partir de string: uma regra de lint reprova
innerHTMLe APIs parecidas. - Formulário validado no servidor, com honeypot, token de tempo, rate limit e orçamento diário de envios.
- Varredura de segredos no CI e uma guarda de privacidade que impede que nomes de clientes ou repositórios privados entrem num commit.
- Regras de reporte.
Processo
Decisões registradas com contexto, prós e contras; testes automatizados para o núcleo do shell, os comandos, o formulário e a chuva; testes no navegador para cada página, com e sem JavaScript; e nada vai para produção sem o CI verde.