Bootstrap 5 - Tabela interativa com paginação.

Veja como fazer uma tabela paginada e interativa com #javascript e #bootstrap 5.

Funcionalidades Implementadas:

Ordenação:

• Clique nos cabeçalhos das colunas para ordenar
• Ícones visuais indicam a direção da ordenação (crescente/decrescente)
• Suporte para ordenação numérica (ID, idade, peso) e alfabética (nome, cidade)

Pesquisa:

• Campo de busca que filtra em tempo real
• Pesquisa em todas as colunas (nome, cidade, idade, peso, ID)
• Botão para limpar a pesquisa
• Contador mostrando quantos registros estão sendo exibidos

Design e UX:

• Interface responsiva com Bootstrap 5
• Ícones Bootstrap Icons para melhor visual
• Animações suaves e efeitos hover
• Badges para IDs e ícones para cidades
• Design moderno com cards e sombras
• Feedback visual quando não há resultados

Demonstração