Funcionalidade de Filtragem

Objetivo

Por último, mas não menos importante, o passo final é adicionar a funcionalidade para filtrar os artigos por tópico, que será implementada usando JavaScript.

Possível Solicitação

Você pode implementar o recurso de filtrar artigos por tópico usando botões HTML e JavaScript?

Resultado

Arquivo index.html

• Adicionamos um bloco nav ao header onde nossos botões de filtragem serão colocados;
• Atribuímos a cada artigo o atributo data-category e o valor correspondente ao tópico;
• Adicionamos o link para o arquivo index.js antes da tag de fechamento body.

Arquivo index.css
Adicionamos alguns estilos para que os botões de filtragem fiquem bonitos.

Arquivo index.js
Colamos o script que implementa a lógica de filtragem.

Tudo isso o ChaGPT nos disse para fazer. Seguimos suas instruções.

Estado do Site

Tutorial em Vídeo

Aqui está. Você conseguiu. Este é o seu site completo e totalmente funcional. Ótimo trabalho!