Projeto

toalha.dev — desafios diários de código, gamificados

Plataforma de desafios diários de programação em eventos gamificados: login com GitHub, execução real de código em 4 linguagens, pontuação com penalidades, placares e até sistema anti-trapaça.

Criador e desenvolvedor

Ficha Técnica

Papel

Criador e desenvolvedor

Stack

reacttypescriptpocketbasecode executiongamificationvite

Resolver um exercício de código por dia é fácil de começar e fácil de largar. O toalha.dev transforma isso em evento: temporadas com data de início e fim, um desafio novo por dia, placar ao vivo, prêmios e uma comunidade competindo junto. O evento "42 dias de código" reuniu mais de 300 participantes resolvendo desafios em JavaScript, Java, C# ou Python — com execução real de código e pontuação dinâmica.

O problema

Plataformas de exercício de código são solitárias e infinitas — não têm começo, meio e fim, e a motivação morre na segunda semana. A aposta do toalha.dev é o formato de evento: prazo, ranking, história diária por e-mail e a pressão social boa de ver seu nome no placar.

Como funciona

  • Login com GitHub, desafio novo liberado por dia dentro do evento.
  • Editor de código próprio no browser: highlight, auto-indentação, fechamento de brackets, undo/redo.
  • Execução real em 4 linguagens (JS, Java, C#, Python) via API Piston, com casos de teste públicos e ocultos.
  • Pontuação dinâmica: penalidades por tempo (com carência proporcional à dificuldade), tentativas, colagem de código e perda de foco.
  • Placares por evento, imagem de compartilhamento gerada em canvas (1080×1920, pronta pros stories) e automação de e-mail diário + newsletter.
  • Painel admin com CRUD de desafios/eventos e import/export em JSON.

Arquitetura

SPA React (Vite) com um ServiceFactory que abstrai o backend atrás de interfaces — a implementação ativa é PocketBase, com uma implementação Firebase completa como alternativa plugável. A execução de código é delegada a estratégias por linguagem.

Visão de componentes e infraestrutura:

Fluxo de uma submissão:

Decisões técnicas que valem a pena contar

Um schema de desafio, quatro linguagens. O maior problema técnico: como validar a solução do usuário em 4 linguagens sem escrever um runner por linguagem por desafio? A resposta é o CodeBuilder — um gerador de código guiado por configuração por linguagem que, a partir de um único JSON declarando parâmetros, tipos e retorno esperado, emite o harness de teste completo. Isso inclui instanciar estruturas complexas (lista encadeada, árvore binária por ordem de nível, B-tree) e serializar o resultado para comparação. Um desafio novo é só um JSON.

Marshalling entre linguagens. Python imprime True, JavaScript espera true. O output da execução é envelopado entre marcadores no stdout, parseado por regex e normalizado antes do JSON.parse — e falha de parsing degrada para erro por caso de teste, nunca derruba a submissão inteira.

Anti-trapaça client-side com honestidade. Numa competição no browser, a "integridade da prova" precisa rodar no cliente. A detecção de DevTools combina quatro heurísticas independentes e só dispara com 2+ sinais simultâneos, para reduzir falso positivo. Troca de aba, colagem e fingerprint do navegador são registrados como telemetria e viram penalidade de pontuação — dissuasão calibrada, não DRM.

Fallback em camadas. Se o backend cai no meio do evento, um serviço com fallback serve os dados do evento a partir de JSON local — o site degrada com elegância em vez de mostrar tela branca pra 300 pessoas.

Stack

React 18 + Vite · TypeScript · PocketBase (+ implementação Firebase alternativa) · API Piston · Tailwind + shadcn/ui · TanStack Query · reCAPTCHA · Nodemailer + ConvertKit · Vercel.

Status

No ar em toalha.dev, com eventos realizados e hall da fama público dos vencedores. Formato validado: temporadas novas são uma questão de calendário, não de código.

Curtiu o projeto?

Se quiser conversar sobre esse projeto, arquitetura ou uma oportunidade de trabalho, é só me chamar. 🚀

contato@racoelho.com.br
Racoelho

Conteúdo sobre desenvolvimento, tecnologia e desafios de programação para impulsionar sua carreira em tech.

Conecte-se

© 2024- 2026 Racoelho. Todos os direitos reservados.

v3.0.19 • Build: 2026-04-17