Flux
Agrégateur de veille technologique RSS et YouTube. Un site statique construit avec Astro et Tailwind CSS, mis à jour automatiquement chaque matin via GitHub Actions.
Fonctionnalités
- Agrégation automatique de flux RSS et chaînes YouTube (cron quotidien à 4h UTC)
- Recherche full-text côté client (Fuse.js)
- Filtrage par catégorie, source et type (articles, podcasts, vidéos YouTube)
- Pagination (15 articles/page)
- Pages articles dédiées avec articles similaires
- Indicateurs de fraîcheur (Nouveau / Récent)
- Marquage des articles non lus
- Pages Sources et À propos
- Flux RSS sortant pour s'abonner
- Dark mode, mobile first, View Transitions
- SEO (meta, Open Graph, sitemap, robots.txt)
Stack
Démarrage rapide
# Installer les dépendances
npm install
# Récupérer les flux RSS (première fois)
npm run fetch-feeds
# Lancer le serveur de dev
npm run dev
Le site sera disponible sur http://localhost:4321.
Ajouter un flux RSS
Modifier le fichier feeds.yaml à la racine du projet :
feeds:
# Blog / RSS classique
- url: https://example.com/feed.xml
name: Mon Blog
categories: [Programmation, Web]
# Podcast
- url: https://example.com/podcast/feed.xml
name: Mon Podcast
type: podcast
categories: [Programmation]
# Chaîne YouTube (url = channel ID)
- url: UCxxxxxxxxxxxxxxxxxxxxxxxx
name: Ma Chaîne (YouTube)
type: youtube
categories: [Programmation, IA]
Catégories disponibles : Programmation, IA, DevOps, Cybersécurité, Cloud, Web.
Vous pouvez en ajouter de nouvelles, elles seront automatiquement prises en compte.
Configuration YouTube
Pour récupérer les vidéos YouTube, une clé API Google est nécessaire :
- Créer un projet dans la Google Cloud Console
- Activer l'API "YouTube Data API v3"
- Créer une clé API (Credentials > API Key)
En local : créer un fichier .env à la racine :
YOUTUBE_API_KEY=votre_clé_ici
En CI : ajouter le secret YOUTUBE_API_KEY dans Settings > Secrets and variables > Actions du repo GitHub.
Skill pour agent de code : yoandev-flux
Flux est également exposé sous forme de skill qui permet à n'importe quel agent de code d'accéder à l'agrégat pour faire de la veille personnalisée, des briefs matinaux et des recherches ad-hoc en langage naturel.
Installation
npx skills add yoanbernabeu/Flux
Prérequis : curl et jq dans le PATH (installés par défaut sur macOS, apt install jq sur Debian/Ubuntu).
Exemples d'usage
Une fois installée, la skill s'active automatiquement sur des prompts comme :
- « Fais-moi ma newsletter du matin sur l'IA, Symfony et le DevOps »
- « Qu'est-ce qui s'est passé cette semaine en tech francophone ? »
- « Trouve-moi des articles récents sur Rust »
- « Résume-moi cet article : »
Plus de détails dans skills/README.md.
Structure du projet
├── feeds.yaml # Configuration des flux RSS
├── data/ # Articles francophones (JSON mensuel, auto-généré)
├── data-world/ # Articles internationaux (JSON mensuel, auto-généré)
├── scripts/
│ └── fetch-feeds.ts # Script de récupération RSS
├── skills/
│ └── yoandev-flux/ # Skill distribuable pour agent de code
├── src/
│ ├── components/ # Composants Astro (ArticleCard, SearchBar, CategoryFilter…)
│ ├── layouts/ # Layout principal
│ ├── pages/ # Pages du site (index, pagination, article, sources, à propos)
│ ├── styles/ # CSS global
│ ├── types/ # Types TypeScript
│ └── utils/ # Utilitaires
├── .github/workflows/ # GitHub Actions
├── netlify.toml # Config Netlify
└── astro.config.mjs # Config Astro
Commandes
| Commande | Action |
|---|
npm install | Installer les dépendances |
npm run dev | Serveur de dev (localhost:4321) |
npm run build | Build de production (./dist/) |
npm run preview | Prévisualiser le build |
npm run fetch-feeds | Récupérer les flux RSS |
Déploiement
Le site est déployé automatiquement sur Netlify à chaque push. L'action GitHub fetch-feeds tourne chaque matin à 4h UTC et commit les nouveaux articles, ce qui déclenche un redéploiement.
Licence
MIT
