markdown-viewer/cloud

Créez des diagrammes d'architecture cloud à l'aide de la syntaxe PlantUML avec les icônes officielles des services AWS, Azure, GCP et Alibaba Cloud. Idéal pour les topologies cloud multi-services et les plans de migration.

Qu'est-ce que cloud ?

Ce skill permet de générer des diagrammes d'architecture cloud à partir de descriptions textuelles en utilisant la syntaxe PlantUML. Il prend en charge les icônes officielles des services des principaux fournisseurs cloud (AWS, Azure, GCP, Alibaba Cloud), ce qui garantit une représentation cohérente et professionnelle des topologies. Il est particulièrement adapté pour concevoir des infrastructures multi-cloud, visualiser des architectures complexes, ou documenter des plans de migration. Le skill interprète le code PlantUML intégré dans le Markdown et génère une image SVG prête à être affichée ou partagée. Il est compatible avec les outils comme Claude Code, Cursor et Codex, et son fonctionnement repose sur l'exécution locale de PlantUML ou l'appel à un service distant.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/markdown-viewer/skills/tree/main/skills/cloud

Installed? Explore more Développement et programmation skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Que fait cloud ?

Créez des diagrammes d'architecture cloud en utilisant la syntaxe PlantUML avec les icônes officielles des services AWS, Azure, GCP et Alibaba Cloud. Idéal pour les topologies cloud multi-services et les plans de migration.

Utilisation

Dans votre fichier Markdown, incluez un bloc de code avec la syntaxe PlantUML et le langage plantuml :

@startuml
!include <aws/common>
!include <aws/Compute/AmazonEC2>
!include <aws/Database/AmazonRDS>

title Architecture de déploiement

EC2(web, "Serveur Web", "t3.medium")
RDS(database, "Base de données", "db.r5.large")

web --> database
@enduml

Fournisseurs supportés

  • AWS : ensemble complet d'icônes (Compute, Storage, Database, Networking, etc.)
  • Azure : icônes pour les services Azure
  • GCP : icônes pour Google Cloud Platform
  • Alibaba Cloud : icônes pour les services Alibaba

Prérequis

  • PlantUML installé localement, ou un serveur PlantUML distant.
  • Les icônes officielles sont disponibles via les bibliothèques standard de PlantUML (!include <aws/...>, etc.).

Exemples

Diagramme multi-cloud

@startuml
!include <aws/Compute/AmazonEC2>
!include <azure/AzureCompute>
!include <gcp/Compute>

EC2(aws_instance, "AWS EC2", "t3.large")
AzureVM(azure_vm, "Azure VM", "Standard_D2s_v3")
GCPCompute(gcp_instance, "GCP Compute", "n1-standard-2")

aws_instance <--> azure_vm : "VPN Inter-cloud"
azure_vm <--> gcp_instance : "Transfert de données"
@enduml

Personnalisation

  • Utilisez des couleurs et des styles pour mettre en évidence des composants spécifiques :
skinparam component {
  BackgroundColor LightBlue
  BorderColor Black
}
  • Ajoutez des notes, des légendes et des flèches directionnelles pour clarifier les flux de données.

Limitations

  • Certaines icônes très récentes peuvent ne pas être disponibles dans les bibliothèques PlantUML ; vérifiez les mises à jour.
  • Les performances peuvent être affectées par des diagrammes très complexes avec de nombreux nœuds.

Références

Individual skills in this repo

This repo contains 13 individual skills — each has its own dedicated page.

markdown-viewer/archimate

Create ArchiMate enterprise architecture diagrams using PlantUML stdlib macros. Best for TOGAF viewpoints, layered EA modeling (Business/Application/Technology), motivation analysis, and migration planning.

markdown-viewer/architecture

Create layered system architecture diagrams using HTML/CSS templates with color-coded tiers and grid layouts. Best for technology stacks, microservices topology, and multi-tier application design.

markdown-viewer/bpmn

Create business process diagrams using PlantUML syntax with BPMN, EIP, and Lean Mapping stencil icons. Best for workflow automation, approval chains, message-based integration patterns, and value stream mapping.

markdown-viewer/canvas

Create spatial diagrams with free-positioned nodes using JSON format. Best for concept maps, knowledge graphs, and planning boards requiring precise x/y coordinate control.

markdown-viewer/data-analytics

Create data pipeline and analytics architecture diagrams using PlantUML syntax with database/analytics stencil icons. Best for ETL pipelines, data lakes, real-time streaming, data warehousing, and BI dashboard design.

markdown-viewer/graphviz

Create directed/undirected graphs using DOT language with automatic layout. Best for dependency trees, call graphs, package hierarchies, and module relationships requiring fine-grained edge routing.

markdown-viewer/infocard

Create editorial-style information cards using HTML/CSS in Markdown. Best for knowledge summaries, data highlights, event announcements, and single-topic content cards with magazine-quality typography.

markdown-viewer/iot

Create IoT architecture diagrams using PlantUML syntax with device and sensor stencil icons. Best for smart home, industrial IoT (IIoT), fleet management, edge computing, and sensor network layouts.

markdown-viewer/mindmap

Create hierarchical mind maps using PlantUML @startmindmap syntax. Best for brainstorming, topic decomposition, study notes, and decision trees with automatic radial layout, left/right branches, and per-node styling.

markdown-viewer/network

Create network topology diagrams using PlantUML syntax with mxgraph device icons (Cisco, Citrix, etc.). Best for LAN/WAN layouts, datacenter interconnects, and physical/logical network design.

markdown-viewer/security

Create security architecture diagrams using PlantUML syntax with identity, encryption, firewall, and compliance stencil icons. Best for IAM flows, zero-trust models, encryption pipelines, and threat detection architectures.

markdown-viewer/uml

Create UML diagrams using PlantUML syntax. Best for software modeling — Class, Sequence, Activity, State Machine, Component, Use Case, and Deployment diagrams with concise text-based notation and auto-layout.

markdown-viewer/vega

Create data-driven charts with Vega-Lite (declarative) and Vega (programmatic). Best for statistical visualization of numeric data — bar, line, scatter, heatmap, area, radar charts, and word clouds.

Skills associés