Transformez vos XML avec react-xml-transformer

aka un pâle copie de XSLT

a marqué ce sujet comme résolu.

Hello !

Je me permets de partager ici avec vous, car je pense que ça peut éventuellement en intéresser un ou deux.

Motivations

Pour la petite histoire, je suis en train de travailler sur un éditeur graphique pour du XML-TEI/DocBook/MathBook. Pour faire ça, évidemment on a besoin d’une façon ou d’une autre le transformer en contenu affichable à l’utilisateur, et j’ai choisi de le transformer en HTML pour pouvoir fournir un éditeur sur le Web.

Évidemment, la solution standard serait de faire des transformations en XSLT et de les afficher à l’utilisateur, ce qui n’est, au final, pas très difficile à faire avec un XSLTProcessor() natif ou SaxonJS, qui permet même le XSLT 3. Les problèmes arrivent quand on essaie de modifier le XML source.

J’ai été inspiré par ce blog où l’auteur nous fait une démo de ce qui est possible avec en gros une requête XQuery. Sauf que c’est pas si simple d’exécuter une requête XQuery dans un navigateur; et, de plus, XQuery ne permet nativement pas de modifier du XML.

C’est à ce problème que j’essaie de répondre avec ce projet: éditer et transformer du XML en temps réel.

Comment ça fonctionne

Comme un composant React standard, à l’exception près qu’il est enregistré dans un contexte global. Ensuite, à la façon de XSLT, il suffit d’appliquer le comportement ApplyTemplates fourni, et la bibliothèque détermine automagiquement le bon modèle à utiliser.

Je vous propose de jeter un coup d’oeil au code source de la démo pour vous faire une idée du fonctionnement. Ce qui est intéressant est dans le dossier Components.

État actuel

J’ai actuellement une démo fonctionnelle, qui permet de démontrer le concept avec un résultat que je trouve assez sympa, et qui supporte la plupart des concepts qui me semblent utiles pour l’instant.

Maintenant, il y a encore plein de travail à faire: documenter est une chose, éviter encore quelques rendus inutiles, mais surtout écrire des tests pour garantir la fiabilité du projet. Si vous lisez le TypeScript et que vous avez un peu de temps disponible, j’accueille volontiers toute contribution. (-:

Aperçu

Mise à jour interactive
Mise à jour interactive

Installer et liens

La bibliothèque est sur NPM, donc il vous suffit de faire un petit yarn add react-xml-transformer pour commencer à l’utiliser.

Pour les curieux, GitHub, démonstration et documentation.

Merci pour la lecture, et je prends très volontiers des retours, d’autant plus que c’est ma première bibliothèque TypeScript !

Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte