View profile

Tech op het web uitgelegd - de A van 🐵

Jos van Essen
Jos van Essen
Ik moet bekennen dat ik nog een flow moet vinden om deze nieuwsbrief te schrijven én versturen. Vorige week was dat meteen een uitdaging omdat ik twee dagen op een congres (The Next Web) was. Excuses, vanaf nu is ie echt wekelijks, tot de onderwerpen op zijn.
Hierover gesproken: ik kreeg de vraag van iemand of er ook onderwerpen mogen worden aangedragen. Het korte antwoord hierop is: graag. Als je graag iets behandeld wil, druk op reply.
Afijn, we duiken er direct in, met uitleg over API’s.
Een API klinkt nogal abstract, net als de afkorting: application programming interface. Ze stellen ontwikkelaars in staat om data op te halen uit externe (of eigen) bronnen.
Maar om API’s te gebruiken hoef je niet persé een programmeur te zijn, en dat ga ik aan je proberen te laten zien met deze do-it-yourself voorbeelden.
Als eerste is het handig om een browser plugin te hebben die je kan helpen om het JSON formaat (dit is het bestandsformaat dat de meeste API’s teruggeven) overzichtelijk te maken. Voor Chrome is JSONview een goede keuze. Ga even naar de Chrome store om deze te installeren, hierna zijn feeds in je browser een stuk overzichtelijker. Voor Safari is zoiets soortgelijks beschikbaar, idem voor Firefox.
We gaan ons nu voorstellen dat we in een team werken waarin de norse backend developer een database heeft gemaakt met een API. We werken in een startup die een geheel nieuwe todo-app bouwt en wij zijn verantwoordelijk om de data uit de API op de pagina’s te tonen.
Ga naar deze link om een JSON bestand te krijgen met daarin 200 todo’s die de bozige ontwikkelaar er alvast in heeft gestopt.
Het formaat dat je hier dus ziet in JSON, dit is een gestructureerde opmaak die heel eenvoudig is te gebruiken met eigenlijk alle programmeertalen. De link die je ziet is het ‘endpoint’ namelijk de basis. Vanaf hier zijn verschillende commando’s mogelijk. Voeg /31 toe achter de URL en je krijgt alleen todo #31 te zien. Zoals je kunt zien hoort todo 31 aan userID 2. Ook hier is een API call voor, namelijk /users/2. Achter deze ‘call’ zit alle informatie van de persoon die deze todo heeft gemaakt.
Kortom: op deze manier kun je als ontwikkelaar heel flexibel data ophalen. Maar je kunt ook data terugsturen. Zoals je in dit voorbeeld ziet is een bepaalde taak completed, of nog niet. Wanneer een gebruiker klikt op een vinkje dan moet dit ook aan de API worden gemeld. Je verstuurt in dit geval een PATCH request naar de API die meldt dat de taak is voltooid.
Het voorbeeld dat ik nu geef is het gebruik van een API die je in je eigen team gebruikt, maar er zijn ook externe API’s om bijvoorbeeld alle rijksmonumenten in Nederland te tonen. Of commerciële API’s zoals die van Buienradar waarmee je eigen weer-kaarten kan bouwen. Ideaal voor bijvoorbeeld boeren die willen weten wanneer ze aan de slag moeten met welke gewassen, of bijvoorbeeld Formule 1 teams die willen weten of het droog blijft op het circuit.
Sterker nog: bijna alle moderne startups en organisaties hebben API’s beschikbaar om (delen van) hun magie beschikbaar te maken voor slimme ontwikkelaars. Denk aan Mailchimp waarmee je een geautomatiseerd e-mail campagne kunt bouwen met de API.
API’s helpen dus om informatie te ontsluiten op een manier die vriendelijk is voor de programmeur. Vaak zijn API’s niet zomaar toegankelijk zoals het voorbeeld dat ik hierboven gaf, en heb je een API-key (en soms een secret) nodig. Hiermee kan de maker van de API in de gaten houden wat er precies met de data gebeurt. API-keys en API-secrets zien er vaak wat random uit, maar dit is ook precies de bedoeling: ze zorgen voor extra beveiliging.

Did you enjoy this issue? Yes No
Jos van Essen
Jos van Essen

JSON, API's, webtokens, CI deployments, JavaScript, Tag Manager: we horen allemaal regelmatig termen voorbij komen waarvan we niet 100% zeker weten of we het ook daadwerkelijk begrijpt. Deze nieuwsbrief laat een licht schijnen op deze materie: tech voor op het web uitgelegd

In order to unsubscribe, click here.
If you were forwarded this newsletter and you like it, you can subscribe here.
Created with Revue by Twitter.