Carte interactive des événements géopolitiques construite avec Next.js et l'API Valyu

Je suis récemment tombé sur un projet intéressant appelé globalthreatmap. L'auteur a construit un centre de commandement interactif pour surveiller la géopolitique, les bases militaires et les incidents dans le monde entier en temps réel. Si vous vous êtes déjà retrouvé rivé aux tableaux de bord des cartes de conflit ou si vous vous intéressez aux outils OSINT, ce projet attirera certainement votre attention.

Pourquoi c'est nécessaire

Regrouper des nouvelles dispersées sur les événements internationaux en une image unifiée a toujours été un défi. Typiquement, vous devriez suivre des dizaines de chaînes Telegram, d'agrégateurs de nouvelles et de bases de données.

L'auteur du dépôt a décidé de visualiser ce flux sur une carte Mapbox sombre. Le résultat est un tableau de bord où les événements géopolitiques sont liés à des coordonnées, catégorisés et soutenus par un contexte historique pour chaque pays.

Ce que le projet peut faire

L'écran principal vous accueille avec une carte interactive et un flux d'événements. Décomposons comment tout est structuré dans l'interface :

• Carte interactive avec regroupement. Les points d'incidents sont groupés lorsque vous zoomez. Il y a un mode carte de chaleur et un défilement automatique autour du globe.
• Couche des bases militaires. Les bases américaines (marqueurs verts) et les installations de l'OTAN (marqueurs bleus) sont tracées sur la carte. Cliquer ouvre une carte avec le nom de l'installation, le type et le pays d'implantation.
• Contexte historique au clic sur un pays. Sélectionnez un pays sur la carte, et l'application affiche deux listes : les conflits actuels et les guerres historiques avec les dates et les résultats.
• Dossiers d'entités. Vous pouvez entrer le nom d'une organisation, d'une PMC ou d'une personnalité politique pour générer un rapport analytique approfondi avec une exportation CSV structurée et une présentation PowerPoint.

Un détail intéressant : lors de la génération d'analyses, le projet exclut délibérément Wikipedia des sources de recherche, en s'appuyant sur des résumés de nouvelles externes et des rapports via l'API Valyu Answer.

Architecture et pile technologique

D'un point de vue technique, le projet est écrit de manière propre et moderne. Sous le capot, il utilise une pile fraîche :

• Next.js 16 avec App Router comme fondation de l'application
• Mapbox GL JS et react-map-gl pour le rendu de cartes vectorielles
• Tailwind CSS v4 pour le style de l'interface
• API Valyu (client valyu-js) pour la recherche d'événements, la génération de réponses et la recherche approfondie
• Zustand pour la gestion de l'état de la carte côté client
• Zod pour valider les schémas de données entrants

L'application prend en charge deux modes de fonctionnement : auto-hébergé (déploiement entièrement autonome avec votre propre clé API) et mode d'autorisation via Valyu OAuth.

La structure des répertoires suit les modèles standard de Next.js :

globalthreatmap/
├── app/
│   ├── page.tsx                # Главный дашборд
│   └── api/                    # Роуты для событий, отчетов и баз
├── components/
│   ├── map/                    # Компоненты карты и модалок
│   ├── feed/                   # Лента событий
│   └── search/                 # Поиск по сущностям
├── lib/
│   ├── valyu.ts                # Интеграция с Valyu API
│   └── geocoding.ts            # Извлечение геокоординат
└── stores/
    └── map-store.ts            # Стейт карты в Zustand

Comment déployer localement

Vous aurez besoin de Node.js 18+ et des clés API pour les services Mapbox et Valyu pour commencer. En option, vous pouvez ajouter une clé OpenAI pour permettre une extraction de géolocalisation plus précise à partir du texte.

Clonez le dépôt et installez les dépendances :

git clone https://github.com/unicodeveloper/globalthreatmap.git
cd globalthreatmap
npm install

Créez un fichier .env.local à la racine du projet :

NEXT_PUBLIC_MAPBOX_TOKEN=your_mapbox_token_here VALYU_API_KEY=your_valyu_api_key_here NEXT_PUBLIC_APP_MODE=self-hosted # Опционально: улучшенный парсинг локаций через OpenAI OPENAI_API_KEY=your_openai_api_key_here

Démarrez le serveur de développement local :

npm run dev

Après cela, l'interface sera accessible à http://localhost:3000.

Réflexions et conclusions

Le projet est intéressant comme exemple prêt à l'emploi d'une interface géo-complexe construite avec React. Si vous envisagez de développer votre propre tracker d'événements, votre tableau de bord de surveillance d'infrastructure ou votre outil d'analyse OSINT, vous pouvez trouver ici des modèles utiles pour travailler avec Mapbox GL et l'état frontend.

Une note à garder à l'esprit : générer des dossiers détaillés de 50 pages via Deep Research prend 5 à 10 minutes, car l'API interroge des centaines de sources. Mais pour les tâches initiales de collecte de faits, c'est une option parfaitement viable. Le code source est ouvert sous licence MIT, vous pouvez donc librement utiliser les modules de carte et de géocodage pour vos propres projets personnels.