𝗖𝗼𝗻𝘀𝘁𝗿𝘂𝗮 𝘂𝗺 𝗪𝗶𝗱𝗴𝗲𝘁 𝗥𝗦𝗦 𝗦𝗶𝗺𝗽𝗹𝗲𝘀 𝗰𝗼𝗺 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁
O RSS tem mais de 20 anos. Continua sendo uma das principais formas de compartilhar notícias, blogs e podcasts.
Muitos desenvolvedores usam frameworks pesados para exibir feeds RSS. Você não precisa deles. RSS é apenas XML. Seu navegador pode ler XML nativamente.
Você pode construir um widget RSS limpo e responsivo usando apenas vanilla JavaScript e CSS.
Como funciona:
- Use a Fetch API para obter os dados XML.
- Use o DOMParser para transformar esse XML em um documento legível.
- Percorra os itens para extrair títulos, links e descrições.
- Renderize os dados em uma grade de cards.
Um problema comum é o CORS. Se um servidor bloquear sua requisição, o navegador a interromperá. Você pode resolver isso usando um proxy como o allorigins.win. Para projetos profissionais, use um Cloudflare Worker para lidar com as requisições.
Principais características desta abordagem:
- Sem instalações npm ou bibliotecas externas.
- Tamanho de arquivo pequeno e carregamento rápido.
- Funciona com qualquer feed RSS 2.0 padrão.
- Fácil de adicionar filtros de categoria.
Você pode estender este widget adicionando:
- Atualização automática para manter o conteúdo atualizado.
- Uma barra de pesquisa para encontrar posts específicos.
- Local storage para fazer o cache dos dados.
- Suporte a modo escuro usando variáveis CSS.
Pare de recorrer a ferramentas pesadas quando as APIs nativas funcionam perfeitamente.
Fonte: https://dev.to/debate_me_af4b65ae011518f/build-a-simple-rss-feed-widget-in-vanilla-javascript-1803