Comment Récupérer les données d'une API avec Fetch en moins de 15 minutes avec Exemples (2021)

Поделиться
HTML-код
  • Опубликовано: 22 янв 2025

Комментарии • 81

  • @parabeaute8176
    @parabeaute8176 8 месяцев назад

    Merci, oui une vidéo complète est intéressant

  • @vadminhokerlz3879
    @vadminhokerlz3879 2 года назад

    Bonjour j'ai un souci avec fetch associée a la boucle while pour parcourir une table sql. Ca me retourne et affiche tous les éléments. comment peut on faire du css ou js sur chaque élément un a un. Le fait qu'un seul bout de code avec un seul id se répète grâce a while mais retourne plusieurs éléments. Quelle indice utiliser si on veut styliser ou ajouter des actions à chaque éléments. Merci

  • @amarmatallah824
    @amarmatallah824 3 года назад +1

    Continue on a besoin de toi

  • @sciences-sci
    @sciences-sci Год назад

    Excellent, bien expliqué, je comprend mieux maintenant

    • @NadfriJS
      @NadfriJS  Год назад

      Génial que cela a pu t'aider

  • @mahfoud8027
    @mahfoud8027 3 года назад +1

    Salut, chez moi ça ne fonctionne pas, "Uncaught (in promise) ReferenceError: output is not defined" ? Merci

    • @NadfriJS
      @NadfriJS  3 года назад

      Tu as bien l'élément output dans le html ? Car il ne le trouve pas

  • @aminazahid9134
    @aminazahid9134 3 года назад +1

    Merci bcp pour ce tuto très bien expliqué ! (Tu parles un peu vite parfois 😆). En tout cas je m’abonne :)

    • @NadfriJS
      @NadfriJS  3 года назад +1

      Oui désolé, quand je parme vite c'est que je vois que je suis à la bourre sur le temps que je me suis donnée sur la video 😓

    • @nestonkaplid6531
      @nestonkaplid6531 Год назад +1

      Tu règles la vitesse de progression.

  • @Mohamed-tj6kb
    @Mohamed-tj6kb Год назад +1

    Tu n'a pas récupéré le champ et le button avec leurs id et pourtant le code a fonctionné ! comment ça ??

  • @armandbessala6252
    @armandbessala6252 Год назад

    Merci beaucoup pour cette vidéo, Fetch js me cassait la tête. Donc merci encore.

  • @MarckPivi
    @MarckPivi 10 месяцев назад

    je me suis abonne... meilleure video...merci

    • @NadfriJS
      @NadfriJS  9 месяцев назад

      Merci à toi 😊

  • @lalumiere8456
    @lalumiere8456 3 года назад

    tellement bien expliquée. Merci vraiment pour cette video

    • @NadfriJS
      @NadfriJS  3 года назад

      Merci à vous 😊

  • @jrelwaldo
    @jrelwaldo 2 года назад

    Excellentes explications!

  • @yaydeyoutube8806
    @yaydeyoutube8806 Год назад

    Franchement tu me sauve la vie merci ! super tuto

  • @felanaletrangeraosolosolof7722
    @felanaletrangeraosolosolof7722 3 года назад

    Mais c'est tellement clair, merci

  • @noco2605
    @noco2605 2 года назад

    Très bien expliqué, merci!

  • @salahbelhadj4271
    @salahbelhadj4271 2 года назад

    merci pour cette explication claire précise

  • @amalbnmhd1670
    @amalbnmhd1670 3 года назад

    Merci pour le tuto c'est super bien expliqué!

    • @NadfriJS
      @NadfriJS  3 года назад

      Avec plaisir 😊

  • @jodrediangienda5234
    @jodrediangienda5234 3 года назад

    Merci pour ce tuto très clair !

    • @NadfriJS
      @NadfriJS  3 года назад

      Merci à vous 😊

  • @steevenjackson667
    @steevenjackson667 Год назад

    Merci pour les explications

  • @colinnoiret7228
    @colinnoiret7228 3 года назад

    Merci vraiment bien expliqué 👍

    • @NadfriJS
      @NadfriJS  3 года назад

      De rien et merci

  • @sciences-sci
    @sciences-sci Год назад

    j'ai déjà suivi une formation api, la ou on ne comprend pas et là tu l'a bien expliqué c'est la reponse et tu dis bien dans la deuxième repose2, dans la formation que j'ai suivi il n'explique pas il applique et ne développe pas, il y à bien 2 réponses 1 en json et l'autre traduite

    • @NadfriJS
      @NadfriJS  Год назад

      Merci pour ton retour

  • @tyland777
    @tyland777 2 года назад

    Bonne explication 👍

  • @oliviercolas2024
    @oliviercolas2024 Год назад

    Est-il facille de fetcher la base BAN pour avoir les adresses des code postaux ?

    • @NadfriJS
      @NadfriJS  Год назад

      Il y a des script deja tout fait pour cela, par exemple celui ci : vicopo.selfbuild.fr/

    • @oliviercolas2024
      @oliviercolas2024 Год назад

      Merci, l'idée est d'avoir les adresses complete et ce script peut le faire ? @@NadfriJS

  • @bibianemakoubi9928
    @bibianemakoubi9928 2 года назад

    Bonjour merci beaucoup pour ce tutoriel très intéressant, j'y suis car SOS sur une erreur 503 Fetch que je rencontre, pouvez-vous m'aider svp ? Et je ne vois pas votre code discord.

    • @NadfriJS
      @NadfriJS  2 года назад +1

      Salut, viens directement sur le discord et pose ta question dans la section backend

  • @MoiFust
    @MoiFust 3 года назад +2

    Très bon tuto dommage que tu n'expliques pas la méthode POST, mais j'ai bien compris pour la méthode GET, (j'ai regardé ta chaine elle me plait je me suis abonné :) ).

    • @NadfriJS
      @NadfriJS  3 года назад +1

      Merci, j'ai voulu expliqué le POST, mais j'ai pas trouvé d'API gratuite pour faire les test. Il aurai fallu le faire soi-même, et la vidéo aurait été trop longue, dans une prochaine vidéo peut-être

  • @Younes-he7li
    @Younes-he7li 3 года назад

    Merci beaucoup c'est super sympas de ta part

    • @NadfriJS
      @NadfriJS  3 года назад

      De rien et merci

  • @BacaryDiédhiou-j5j
    @BacaryDiédhiou-j5j Год назад

    Je vous remercie vraiment

  • @choanlpoto
    @choanlpoto 2 года назад

    Saluuut Merci pour cette video, j'ai une question 2an apres je sais pas si tu la verra mais je tente quand meme : a 10min tu appelle le button qui a un id btn en js avec btn.onclick(). Comment ça se fait que js fait le lien avec l'id en HTML sans que tu aies besoin d'ecrire une const avec getElementById ? Merci !

    • @NadfriJS
      @NadfriJS  2 года назад +2

      Je sais c'est magique :) . En fait, les ids sont uniques, donc JS est assez intelligent pour comprendre qu'il faut chercher l'element en question dans le HTML s'il n'est pas dans le code. Apres c'est à eviter, car si quelqu'un repasse derriere ton code, il risque de ne pas comprendre d'ou vient cette variable.

    • @choanlpoto
      @choanlpoto 2 года назад

      @@NadfriJS genial merci pour la reponse ! J'avais jamais vu.

  • @aichetoumechry6957
    @aichetoumechry6957 3 года назад

    c'est sympa , mais j'ai reproduis exactement ce que tu as fait pourtant ça ne marche et quand j'écris console.log('quelque chose') ça ne m'affiche jamais quelquechose . . .

    • @NadfriJS
      @NadfriJS  3 года назад

      salut, tu peux copier ton code ici

    • @aichetoumechry6957
      @aichetoumechry6957 3 года назад

      @@NadfriJS ah oui , c'est con , mais le problème c'était que je n'avais pas écrit un lien vers mon fichier javascript😂

    • @NadfriJS
      @NadfriJS  3 года назад

      @@aichetoumechry6957 C'est en trouvant la réponse à son problème par soi même qu'on évolue ;)

  • @Sam-wv8fg
    @Sam-wv8fg 3 года назад

    Merci pour tuto. pas compris l astuce du double reponse.

    • @NadfriJS
      @NadfriJS  3 года назад

      Tu peux venir sur mon discord pour en discuter

  • @improvemyvalue
    @improvemyvalue Год назад

    Bonne video 🧠 I agree ✅
    Ca marche pareil avec l'API de youtube ?
    Si je veux par exemple afficher ma dernière playlist youtube sur mon site web ?!...

    • @NadfriJS
      @NadfriJS  Год назад +1

      Hello, tant que l'API ne demande pas de clé, ca marche, il se peut que l'API de youtube demande une clé, et dans ce cas, c'est un peu plus complexe, faudra ajouter un header en option dans le fetch contenant ta clé, mais je pense que tu peux trouver un tuto sur youtube pour ca

    • @improvemyvalue
      @improvemyvalue Год назад

      ​@@NadfriJS tu es un bon, je te remercie de ton retour, je sais comment orienter mes recherches maintenant 💎

  • @salahbelhadj4271
    @salahbelhadj4271 2 года назад

    merci encore pour cette video

  • @honkhonkv2236
    @honkhonkv2236 3 года назад

    Merci chef !

  • @benlaounykone3732
    @benlaounykone3732 2 года назад

    now i am in a good mood

  • @melissacouturier5644
    @melissacouturier5644 2 года назад

    Merci pour ce Tuto! Pourrais tu expliquer la première option avec function?

    • @mohammed-iyadbjj5284
      @mohammed-iyadbjj5284 2 года назад +2

      Salut, il n'y a pas grand interet à utiliser function ici, ça alourdit l'ecriture et la comprehension du code, les fonctions fléchées ont été créés pour cela, si tu veux plus d'info sur les fonctions, tu peux regarder cette video ruclips.net/video/ofSnF9CqZKE/видео.html

  • @mahmoudsahali9448
    @mahmoudsahali9448 3 года назад

    super merci, svp un exemple d'utilisation de fetch avec post. merci

    • @NadfriJS
      @NadfriJS  3 года назад +1

      Le probleme c'est qu'il faut avoir une base de donnée sur laquelle pouvoir faire les test de POST/PUT/DELETE. Mais je vais surement faire une video sur comment utiliser FIREBASE, à ce moment on verra ces methodes

  • @benjaminfranklin5843
    @benjaminfranklin5843 2 года назад

    Merci beaucoup

  • @KorkoFr
    @KorkoFr 3 года назад

    Petites coquilles (je suppose que tu les a vues mais au cas ou je précise) :
    * 3:50 : tu n'es pas sur le bon appel, tu es sur la récupération du fichier script, non sur l'appel à l'API qui est 2 lignes en dessous. D'où le fait que dans "response" tu ais du contenu, littéralement le contenu du script.
    * 4:57 : absolument rien à avoir avec le fait de mettre un ";" après un then(), tu peux mettre un ";" évidemment ! Il est juste optionnel en javascript ici car le saut à la ligne sert aussi de séparateur de commandes. Tu as juste oublié de fermer ton then().

    • @NadfriJS
      @NadfriJS  3 года назад

      Merci pour ton retour, il doit surement avoir d'autres coquilles, je les coupe pas toutes au montage sinon le tournage de la vidéo serait trop chronophage 👍

  • @felixfale964
    @felixfale964 2 года назад

    Merci

  • @coderlady_
    @coderlady_ 3 года назад

    Limpide, mais ou est 'await' dans fetch ici?

    • @NadfriJS
      @NadfriJS  3 года назад

      Avec les then, pas besoin d'utiliser await async, car ça renvoie un promesse automatiquement, c'est comme si await était déjà inclus. D'ou l'importance d'effectuer toutes ses taches dans les then.

    • @coderlady_
      @coderlady_ 3 года назад

      @@NadfriJS ok merci

    • @KorkoFr
      @KorkoFr 3 года назад

      @@coderlady_ Le await c'est pour récupérer en variable directement la première valeur retournée par une Promise.
      Exemple : en ayant une fonction bidon() { return new Promise((resolve, error) => resolve('foo')); }
      Soit tu fais bidon().then(a => console.debug(a)); /* a === 'foo' */
      Soit tu fais var a = await bidon(); /* a === 'foo' */
      Dépend de si tu peux attendre le retour de ta fonction de manière asynchrone (avec le then qui sera appelé comme une callback, plus tard, quand l'appel aura terminé) ou si tu veux absolument le résoudre de manière synchrone et que le reste de ta fonction appelante a besoin du résultat directement (avec await) mais ça implique que la fonction appelante soit elle aussi asynchrone (async function toto() { var a = await bidon(); }) donc elle même retournera une Promise, etc etc.