Le but de cet exercice est d'utiliser le endpoint suivant :

https://restcountries.com/v3.1/name/${name}

afin de créer un input de type text qui génère une liste (option > select) à partir du moment où l'utilisateur a entré au moins 2 caractères

Vous aurez besoin pour cela :

  • d'utiliser la méthode fetch (et donc le mécanisme des promesses),
  • de gérer l'événement "input" sur la balise de type input
  • de créer à la volée des éléments du dom (ici des "options")

Première étape :

Vous faites cet exercice en js "vanilla". Vous séparez le code avec d'un côté la construction du DOM et de l'autre l'appel à un service (classe FetchCountries).

Deuxième étape :

Vous faites cet exercice en ts en utilisant webpack

Troisième étape :

Vous utilisez RxJs afin de :

  • attendre (debounceTime) 200ms sans que l'internaute ait entré une lettre pour faire la requête http
  • vérifier qu'il y a bien eu un changement dans l'input avant de faire  la requête http
  • ...