Um PWA passo a passo
Do painel da Vitrine ao ícone na tela inicial do Android.
O caminho inteiro tem quatro passos, e três deles são do Android — não da linguagem.
1. O painel#
dataforge
adopt Arcane.Vitrine as V
action pagina():
V.titulo("Chão de fábrica")
colunas := V.colunas(2)
colunas[0].metrica("Em produção", 12)
colunas[1].metrica("Parados", 3)
V.frame([
{"maquina": "prensa 1", "estado": "ok"},
{"maquina": "prensa 2", "estado": "parada"},
])
V.atualizar_a_cada(5)
s := V.testar(pagina)
s.rodar()
assert "Chão de fábrica" in s.texto()
out "o painel responde — e é o mesmo no celular"2. Os arquivos do PWA#
bash
$ dataforge mobile pwa --nome="Chão de fábrica" --em=publico3. O HTML#
text
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#0d1017">
<script>navigator.serviceWorker?.register('/sw.js')</script>4. O HTTPS#
Sem ele o Android não oferece instalar, e não há aviso: o botão simplesmente não aparece. As três formas que funcionam:
| Forma | Quando |
|---|---|
| um proxy com certificado (nginx, Caddy) | o painel roda na sua rede, e você controla o servidor |
| um túnel (Cloudflare, ngrok) | para mostrar a alguém hoje |
| hospedagem estática + API | quando a página é estática e o dado vem por HTTP |
O Kiln não tem TLS — ele roda sobre o http.server do Python. Em produção pública, o nginx ou o Caddy vai na frente, e isso está escrito na página dele também.
Conferir que ficou instalável#
- Abra no Chrome do Android e veja se aparece "Adicionar à tela inicial" com ícone próprio (sem manifesto, ele oferece um atalho comum).
- Nas Ferramentas do Desenvolvedor: Application → Manifest e Service Workers.
- Desligue a rede e recarregue: com o service worker, a página abre; sem ele, dá erro de conexão.
- Instale, abra pelo ícone, e confira que não há barra de endereço — é o
display: standalonefuncionando.