O que é o Git Pills
Git Pills é um catálogo interativo de 27 ferramentas, repositórios e recursos de IA cuidadosamente selecionados. Cada "pill" (pílula) traz uma descrição objetiva, o problema que resolve, como usar e casos de uso reais.
O objetivo é ser uma referência rápida para desenvolvedores que querem descobrir as melhores ferramentas de IA disponíveis no GitHub, desde agentes autônomos até geradores de vídeo e ambientes de desenvolvimento.
27 Pills
Repositórios e ferramentas pesquisados e documentados manualmente.
Busca Inteligente
Pesquise por nome, descrição, tags ou categoria em tempo real.
4 Views
Grid, Kanban, Grafo e Feed — escolha a visualização ideal para você.
Pill do Dia
Gere vídeos MP4 para redes sociais usando Remotion.
Como Navegar — As 4 Views
O app oferece 4 formas diferentes de visualizar o catálogo. Alterne entre elas usando os ícones no canto superior direito da interface.
View Grid
Cards dispostos em grade com 4 colunas (responsivo). Hover revela gradiente colorido e botão de detalhes. Ideal para explorar o catálogo visualmente.
View Kanban
4 colunas organizadas por categoria: Agentes, Ambientes, Geradores e Recursos. Permite comparar ferramentas dentro de cada categoria.
View Grafo
Visualização interativa com nodes e arestas. Clique e arraste nodes para reorganizar. Conexões mostram pills relacionadas. Powered by react-force-graph-2d.
View Feed
Lista densa e compacta com highlight de busca. Ideal para navegar rapidamente por muitos itens ou encontrar algo específico.
A view preferida é salva automaticamente no estado da aplicação. Use Grid para explorar, Feed para buscar rápido e Grafo para ver conexões entre ferramentas.
Como Filtrar o Catálogo
Dois mecanismos de filtragem trabalham em conjunto: a barra de busca e os filtros por categoria.
Barra de Busca
Digite qualquer texto na barra de pesquisa no topo. A busca é feita com debounce de 200ms nos campos: nome, headline, descrição, tags, categoria e linguagem. O highlight de matches aparece na View Feed.
Filtros por Categoria
Clique em uma ou mais categorias abaixo da barra de busca para filtrar: Agents, Environments, Generators, Resources. A seleção múltipla é suportada — o filtro funciona como OR (mostra pills de qualquer categoria selecionada).
Combinando Filtros
Busca e categoria funcionam juntos com AND. Exemplo: buscar "python" + categoria "Agents" mostra apenas agentes relacionados a Python. Limpe a busca clicando no X ou apagando o texto.
O contador no topo mostra quantas pills correspondem aos filtros ativos. Se nenhuma pill for encontrada, uma mensagem de "nenhum resultado" é exibida.
Detalhes de uma Pill
Clique em qualquer card para abrir o drawer lateral com informações completas sobre a ferramenta. O drawer desliza da direita com animação suave.
Tab "O que é"
Descrição completa, problema que resolve, solução proposta, linguagem, estrelas no GitHub e links.
Tab "Como Usar"
Passo a passo de instalação e uso básico, com exemplos de comandos e configuração.
Tab "Casos de Uso"
Cenários reais de aplicação — quando e por que usar essa ferramenta no seu workflow.
Fechar o Drawer
Clique no X no canto superior direito do drawer, clique fora dele (no overlay), ou pressione a tecla Escape.
Pills Relacionadas
Ao final do drawer, uma seção "Pills Relacionadas" mostra ferramentas similares ou complementares. Clique em qualquer uma para navegar direto.
Pill do Dia — Gerar Vídeo com Remotion
O projeto inclui uma subpasta /remotion/ com uma composição independente para gerar
vídeos verticais (1080×1920, reels/shorts) de qualquer pill.
Timeline do Vídeo (15 segundos)
| Tempo | Cena | Descrição |
|---|---|---|
| 0–2s | Logo | 💊 Git Pills intro animado |
| 2–5s | Typewriter | Headline da pill digitada letra a letra |
| 5–10s | Card | Card principal com nome, descrição e stars |
| 10–13s | Tags | Tags e categoria aparecem em cascata |
| 13–15s | CTA | Call-to-action com link do projeto |
Como gerar
# 1. Entrar na pasta remotion
cd remotion
# 2. Instalar dependências (só na primeira vez)
npm install
# 3. Gerar vídeo de uma pill específica (use o ID)
node render.mjs hermes-agent
# 4. O arquivo MP4 é salvo em:
# public/videos/pill-of-the-day-hermes-agent.mp4IDs disponíveis (exemplos)
Todos os IDs válidos estão em remotion/pills.json. O arquivo é uma cópia standalone dos dados, sem dependência do src/ do projeto principal.
Deep Link — Compartilhar uma Pill
Você pode compartilhar o link direto para uma pill específica usando o parâmetro
?pill=id na URL. Ao acessar o link, o app carrega e abre automaticamente o drawer
da pill correspondente.
Exemplos de deep links
# Abrir pill do hermes-agent diretamente
https://gitpills.ddw1sl.easypanel.host?pill=hermes-agent
# Abrir pill do superpowers
https://gitpills.ddw1sl.easypanel.host?pill=superpowers
# Abrir pill do awesome-mcp
https://gitpills.ddw1sl.easypanel.host?pill=awesome-mcpSe o ID informado não existir no catálogo, o parâmetro é ignorado e o app carrega normalmente sem abrir nenhum drawer.
Como encontrar o ID de uma pill
Via URL do navegador
Abra o drawer de qualquer pill. A URL é atualizada automaticamente com o parâmetro ?pill=id. Copie direto da barra de endereços.
Via arquivo de dados
Consulte src/shared/data/pills.data.ts — cada pill tem um campo id no início do objeto.