Créer un widget RSS simple avec JavaScript
L'RSS a plus de 20 ans. Il reste l'un des meilleurs moyens de partager des actualités, des blogs et des podcasts.
De nombreux développeurs utilisent des frameworks lourds pour afficher des flux RSS. Ce n'est pas nécessaire. L'RSS n'est que du XML. Votre navigateur peut lire le XML nativement.
Vous pouvez créer un widget RSS propre et responsive en utilisant uniquement du JavaScript natif et du CSS.
Comment ça marche :
- Utilisez l'API Fetch pour récupérer les données XML.
- Utilisez DOMParser pour transformer ce XML en un document lisible.
- Parcourez les éléments pour extraire les titres, les liens et les descriptions.
- Affichez les données sous forme de grille de cartes.
Un problème courant est le CORS. Si un serveur bloque votre requête, le navigateur l'interrompt. Vous pouvez résoudre cela en utilisant un proxy comme allorigins.win. Pour les projets professionnels, utilisez un Cloudflare Worker pour gérer les requêtes.
Caractéristiques clés de cette approche :
- Pas d'installations npm ni de bibliothèques externes.
- Taille de fichier réduite et chargement rapide.
- Fonctionne avec n'importe quel flux RSS 2.0 standard.
- Facile d'ajouter des filtres par catégorie.
Vous pouvez étendre ce widget en ajoutant :
- Un rafraîchissement automatique pour garder le contenu à jour.
- Une barre de recherche pour trouver des articles spécifiques.
- Le stockage local pour mettre les données en cache.
- La prise en charge du mode sombre via des variables CSS.
Arrêtez de vous tourner vers des outils lourds quand les API natives fonctionnent parfaitement.
Source : https://dev.to/debate_me_af4b65ae011518f/build-a-simple-rss-feed-widget-in-vanilla-javascript-1803