API Feed est le nom donné à un petit projet que j’avais imaginé il y a déjà un petit temps de cela et que je mets en ligne aujourd’hui. L’idée est de créer une liseuse d’API, soit un outil qui permettrait de lire une API distante depuis un site pour en afficher rapidement un résultat. L’objectif étant de voir très vite à quoi ressemble le type de données rencontrées.
Le style
Sans prise de tête, j’ai mis en ligne le célèbre framework « Tailwind » à travers sa feuille de style téléchargée depuis le site officiel. Ainsi, avec des classes adaptées, j’ai pu créer des cartes (cards) qui me permettent d’afficher toutes les données en boucle par la suite. (comme je l’avais fait ici, pour WordPress).
Le dev
C’est surtout à travers le JS qu’on peut analyser l’objectif de l’outil. En fait, je vérifie chaque valeur des clés qui me sont renvoyées et j’effectue une vérification de leur type. C’est-à-dire que je vérifie si elles sont de type « texte« , si c’est un « tableau » ou un « objet« . Et même une « date » ou une « URL« . En fonction de cela, je peux ensuite les imbriquer dans des éléments HTML qui afficheront le rendu stylisé grâce aux classes précitées. Et le tout est bouclé.
API Feed en dépôt
Le tout est déposé sur Github et vous pouvez consulter le code JS via ce lien :
https://github.com/ProjetsMerlin/Api-Feed/blob/main/script.js
Mais pour un aperçu de ce que cela peut réaliser, voilà le lien du projet :
https://github.lintermediaire.be/apifeed
Comme vous pourrez le voir, je vous ai mis un drop-down qui vous permet de choisir entre 5 APIs connues du web. Mais vous pouvez également essayer d’encoder votre URL à travers le champ prévu à cet effet.
