🕸️
[BA] Web Programming
  • Introductie
  • Cursus
    • TypeScript
      • Waarom TypeScript?
      • Nieuw project
      • Wat is een tsconfig.json?
      • Input lezen
      • Type Systeem
        • Basic types
        • Arrays
        • Functions
        • Class
        • Interface
      • Conditionele blok
      • Loops
      • Array methods
      • Exceptions
      • Modules
      • Asynchroon Programmeren
        • Promises
        • Async/Await
        • Fetch
        • JSON
    • Frontend
      • DOM Manipulatie
      • VITE
      • Deployment met Surge
    • Backend
      • Express.js
        • Basis
        • Nodemon
        • Statische Bestanden
        • Request
        • Response
        • Router
      • MySQL
    • Fullstack
      • Van Form tot Database
      • CORS
  • Labos
    • 1. TS: Basis
      • Hello Name
      • BMI Calculator
      • Interest Calculator
      • Uren en Minuten
      • Wisselgeld
      • Name from Email
      • Text Box
    • 2. TS: Arrays & functions
      • Som van getallen
      • Math Fun
      • Array Sum
      • Puntenboek
      • Rot13
      • Pokemon Team
      • Todo List String
      • Tick Tac Toe
      • BMI Calculator Multi
    • 3. TS: Interfaces & classes
      • Recepten
      • Transportmiddelen
      • Movies
      • Filter Numbers
    • 4. TS: Async & fetch
      • Promise All
      • Slow Sum
      • Cocktails Promise All
      • Joke API
      • School API
      • Cocktails API
      • Unix Timestamp API
    • 5. TS: Modules & NPM
      • Math Module
      • Cowsay Module
      • Cat GPT
      • Rainbow Chalk
    • 6. Frontend: VITE & DOM
      • Verander achtergrond
      • Verander tekst
      • Verander divs
      • Verander kleuren
      • Verander kleuren random
    • 7. Frontend: APIs & DOM
      • Cocktail API met Vite
      • Weather API
      • Uitvinders
      • Rick and Morty
    • 8. Backend: Express & Requests
      • Hello Express
      • DadJoke Express
      • Reiskosten server
    • 9. Backend: MySQL & Routing
      • Reiskosten server
      • Taken server
      • Taken server met prioriteit
    • 10. Fullstack: Forms & Express & MySQL
      • Reiskosten app
      • Taken app
      • Pokémon app
Powered by GitBook

AP

On this page
  1. Labos
  2. 4. TS: Async & fetch

Joke API

PreviousCocktails Promise AllNextSchool API

Last updated 2 months ago

Maak een nieuw project aan met de naam joke-api.

Bij het opstarten van de applicatie worden eerst alle categorieën van grappen opgehaald. Die kan je op de volgende URL met fetch ophalen:

https://v2.jokeapi.dev/categories

Nadat je de categorieën hebt opgehaald, kan je de gebruiker vragen om een categorie te kiezen. Vervolgens wordt er de gebruiker gevraagd om het type van de grap te kiezen. De mogelijke types zijn: single, twopart.

Vervolgens wordt er een grap opgehaald van de gekozen categorie en type. Je kan de grappen ophalen op de volgende URL:

https://v2.jokeapi.dev/joke/<categorie>?type=<type> bv. https://v2.jokeapi.dev/joke/Programming?type=single

Let op dat de single grappen een joke veld hebben en de twopart grappen een setup en delivery veld. Hou hier dus rekening mee bij het tonen van de grap.

Na het vertonen van de grap wordt de gebruiker gevraagd of hij nog een grap wil zien. Als de gebruiker ja antwoordt, wordt de gebruiker opnieuw gevraagd om een categorie en type te kiezen. Als de gebruiker nee antwoordt, wordt de applicatie afgesloten.

Voorbeeldinteractie:

Jokes Interactie