Visualisation de l’API Hacker News avec HCL et SQL

Dans le dernier épisode, nous avons examiné un tableau de bord Steampipe qui joint les résultats de recherche sur diverses API. Ce tableau de bord de métarecherche est entièrement défini dans un code qui mélange deux langages : SQL pour interroger les API et HCL (HashiCorp Configuration Language) pour transmettre les résultats dans un tableau de bord.

Cette approche des tableaux de bord en tant que code s’appuie sur la philosophie de l’infrastructure en tant que code. Nous pensons que les tirets sont un autre type d’infrastructure qui devrait être définie dans le logiciel, gérée dans des référentiels contrôlés par version et embarquée à partir de référentiels.

Dans cet épisode, nous examinerons un tableau de bord qui explore les éléments publiés sur Hacker News. Il en illustre plusieurs dans lesquels Steampipe peut participer à des workflows définis par logiciel.

Voici le tableau de bord en action.

Et voici le démarrage rapide pour l’exécuter par vous-même.

Les visualisations couvrent plus de 15 000 histoires depuis le 21 juin. C’est bien plus d’histoire que vous ne pouvez en tirer facilement à partir de l’API Hacker News en une seule gorgée. Alors, d’où viennent les données historiques ? C’est dans le dépôt !

Histoire

Toutes les heures, une action GitHub vérifie le référentiel, exécute Steampipe, recherche de nouveaux éléments, les exporte vers un fichier CSV, valide ce fichier et le pousse vers l’origine. Ainsi, lorsque vous clonez ou mettez à jour le référentiel, vous obtenez de nouvelles données. Avec Steampipe et le plugin CSV installés, voici comment vous visualisez le tableau de bord.

cd ~/steampipe-samples/all/hackernews
./update.sh
steampipe dashboard

Et puis visite https://localhost:9194. Répéter ./update.sh à tout moment pour extraire et incorporer des données actualisées. L’action GitHub, planifiée pour s’exécuter toutes les heures, effectue les opérations suivantes.

• Consulter le dépôt
• Installer Steampipe dans le coureur GitHub
• Installez le plugin Hacker News
• Interrogez les dernières histoires et envoyez la sortie dans un fichier CSV
• Valider le nouveau fichier CSV et pousser les modifications

J’étais en retard à la soirée GitHub Actions mais j’y suis maintenant. C’est un si joli moyen d’accumuler durablement de petits clichés !

Pour ceux qui comptabilisent les points, il existe trois instances de Steampipe dans ce flux de travail :

#1 prend les instantanés dans une action GitHub en utilisant le plugin Hacker News.
#2 construit la table dans votre base de données Steampipe locale, en utilisant le plugin CSV.
#3 lance le serveur de tableau de bord local auquel votre navigateur se connecte.

HCL + SQL

Le panneau Sources propose une liste de sélection de domaines et trouve des histoires dont les URL correspondent à un domaine sélectionné. Voici la requête SQL qui lit toutes les URL et extrait leurs domaines. La partie la plus délicate est l’expression régulière, mais c’est vrai pour les regex dans toutes les langues. Le SQL lui-même est simple et facile à comprendre.

with domains as (
  select distinct
    substring(url from 'http[s]*://([^/$]+)') as domain
  from
    hn_items_all
)
select
  domain as label,
  domain as value
from
  domains
order by
  domain

Le HCL qui crée la liste de sélection est également simple et facile à comprendre.

input "domain" {
  width = 3
  sql = <
C'est le modèle partout : SQL pour obtenir les données, un mince wrapper HCL pour transmettre les résultats dans un widget.  Ces deux saveurs de code, qui définissent ensemble le tableau de bord, naissent dans un dépôt, y évoluent et se déploient à partir de là.  Dans les systèmes à code faible ou nul, toutes les mêmes informations résident dans un magasin de données géré par une application.  Vous devrez peut-être (je l'ai déjà fait) exporter ces informations afin d'enregistrer l'évolution du système dans un référentiel.  Il vaut mieux l'avoir toujours là.
Le but des systèmes à code faible ou nul est, bien sûr, d'envelopper le code dans des outils qui libèrent la créativité des personnes qui ne codent pas.  Il n'y a pas encore de tels outils pour ce combo HCL + SQL, mais il peut y en avoir.  Les systèmes définis dans le code sont intrinsèquement conviviaux pour les outils qui lisent et écrivent ce code.  Le référentiel Hacker News, par exemple, inclut un exemple fantaisiste qui anime un graphique en modifiant par programmation un fichier de tableau de bord et en modifiant certaines valeurs HCL.
Bien que je n'aie pas utilisé d'analyseur pour cet exemple, il existe bien sûr des analyseurs HCL et SQL qui restituent le code sous forme de données.  Dans un épisode précédent, nous avons montré comment un autre plugin Steampipe transforme les fichiers Terraform en tables Steampipe, permettant ainsi un vérificateur de conformité qui valide les définitions Terraform.  Au fur et à mesure que vous construisez et faites évoluer des tableaux de bord, ne voudriez-vous pas les valider de la même manière ?  Une architecture as-code garantit que c'est possible.

Cela dit, coder les tableaux de bord Steampipe en pur HCL + SQL est facile, amusant et extrêmement productif.  Voici deux de mes choses préférées qui le rendent ainsi.
Montage en direct
Lorsque vous modifiez le code du tableau de bord dans un éditeur qui enregistre automatiquement, le tableau de bord réagit immédiatement.  Comme indiqué ici, cela est vrai pour les modifications apportées à la fois au code HCL qui orchestre les données et au code SQL qui les récupère.


Il s'agit d'une sorte d'interface de manipulation directe : "une approche des interfaces qui implique une représentation continue des objets d'intérêt ainsi que des actions et des retours rapides, réversibles et incrémentiels".  (Wikipédia)
Bret Victor est un grand défenseur de cette approche.  Dans ce segment de Inventing on Principle, il cloue le problème que la manipulation directe résout.
J'ai ce code, et j'ai cette image ici, et je dois maintenir la correspondance entre les deux dans ma tête.
Plus il faut de temps pour voir les résultats des modifications de code, plus il est difficile de maintenir ce mappage.  La rétroaction immédiate est inestimable et trop souvent indisponible.  Nous l'avons pris pour acquis lors du codage des débuts du Web, mais maintenant, il y a souvent une étape de construction qui contrecarre la manipulation directe.
Lors du codage d'un tableau de bord Steampipe, vous obtenez un retour immédiat de HCL et SQL.  J'ai écrit beaucoup de requêtes Postgres ces dernières années.  Les écrire dans un environnement qui actualise les résultats de la requête au fur et à mesure que je tape, ou affiche les messages d'erreur Postgres lorsque je fais des erreurs, a été transformateur.
Sensibilité Web
Le codage des tableaux de bord Steampipe me rappelle les débuts du Web à d'autres égards également.  Les liens, par exemple, sont des citoyens de première classe des tableaux de bord Steampipe, et ce n'est pas toujours vrai de nos jours.  Le panneau Soumissions relie les noms d'utilisateur à un autre tableau de bord qui explore toutes les soumissions d'un utilisateur sélectionné.  Tout fonctionne exactement comme un développeur Web s'y attendrait.
Il y a aussi un bouton Afficher la source.  Rappelez-vous Afficher la source ?  Avant, c'était important sur le web.  De nos jours, il ne vous montre généralement que le bruit de ligne minimisé.  Mais le combo HCL + SQL me rappelle le premier combo HTML + JS - dans le bon sens !  Voici un aperçu des sources derrière l'un des panneaux du tableau de bord.


En plus de la rétroaction directe, ce type d'observabilité a aidé le premier web à décoller.  Vous voyez quelque chose, vous vous demandez comment cela a été fait, vous voyez la source, vous apprenez et vous imitez.  Les constructeurs Web débutants ne peuvent plus participer à ce type de cercle vertueux.  Les constructeurs de tableaux de bord débutants Steampipe le peuvent, et cela augure bien pour un écosystème florissant.
Visualisez les données à la vitesse de la pensée
Parce que Steampipe étend Postgres, vous pouvez utiliser n'importe quel outil pour créer des tableaux de bord soutenus par des données Steampipe.  Si vous maîtrisez Metabase, Tableau ou un autre outil qui se connecte à Postgres, la superpuissance de l'API à la table de base de données de Steampipe accélérera votre capacité à visualiser des données provenant de diverses sources dans ces environnements.  Mais si vous essayez de créer un tableau de bord à la manière de Steampipe, faites-moi savoir comment cela se passe.  D'après ma propre expérience, c'est le moyen le plus rapide et le plus agréable de transformer une idée en un tableau de bord utile.