D4mations.com

10.4: Loading JSON data from a URL (Asynchronous Callbacks!) – p5.js Tutorial



This video covers begins the process of working with APIs. The first step is just using a URL instead of a local JSON file. How does this change your code? How do you use a callback to known when the data is ready?

All examples: https://github.com/shiffman/Video-Lesson-Materials

Contact: https://twitter.com/shiffman

Next video:

JavaScript basics:

HTML/CSS basics:

Full Data playlist:

Help us caption & translate this video!

http://amara.org/v/QbuF/

Original source

d4mer

, , , , , , , , , ,

30 responses to “10.4: Loading JSON data from a URL (Asynchronous Callbacks!) – p5.js Tutorial”

  1. caution: tl;dr posted at head…

    Short : Diggin' the videos. This is my goto when I'm working through understanding a concepts and need visual explanations for stackoverflow/serverfault issues.

    Long:
    Thanks for being vulnerable (emotionally) enough to make a video about your knowledge of this and explain a lot of this stuff coherently. It takes a great deal of courage to stand up in front of people and do this, so I certainly can relate with that performance anxiety. It's nice to have an instructor who's not overly ego-driven and belittling with sharing their knowledge. I'm relatively intimidated by this new realm of deep-diving i'm exploring; To know there are experts who I can relate with and who are trying alternative methods to spread their knowledge is freakin awesome. Really enjoying the green-screen/example/visual illustration educating style. Thanks for being real about who you are and keep those videos coming.

  4. @The Coding Train I need to read a json from webservice using HTML. The service returns json and it is working fine with Postman. Could you please help me in identifying where the issue is. I am trying out ajax calls.

  6. You are just and amazing programmer great job!!!! I don't know how many years you've worked for being so amazing like that. However, for me, you are one of the best developers that I've watch his video.

  17. In a more modern way, you can now use the Fetch API:

    fetch( " test.json " )
    .then( response => response.json() )
    .then( json => console.log( json ) );

    All modern browsers support Fetch API. (Internet Explorer doesn't, but Edge does!)

  19. Thank you so much for these videos! It's the third I'm looking without a break! You're extraordinary! I love you! And don't be ashamed, you have a beautiful voice when you sing!
    Thanks to you again!

  23. I was really struggling with a lot of the basic concepts like callback, jsonp etc while trying to finish my building a quote machine FCC challenge. Then I came across your video … then boom — magic happened. doubts cleared. You make coding so much fun and your energy is contagious! I'm now much more prepared to tackle the challenge thanks to you. Already subscribed and can't wait to watch the other videos! Thanks again!

  29. Do you have, or plan on making any vanilla JS API tutorials? I know this is specific to p5 but I'm hoping to learn about API calls and handling the returned JSON data within vanilla JS. Or if anyone has any links to videos related to this, it would be greatly appreciated!

  30. FUCK IT! An Oct 30, 2015 Video with 39,004 views instead of 390,004 or more 🙁 Keep em up @The Coding Team, this is how I always handle my business English class 🙂

    Ain't sure how to get away with the jQueryUI autocomplete feature 🙁 Here's my JSON File: programs.json and below is my code with a few json rows and It'd be insane to have a million rows hard-coded in the function. My question is how can I implement the autocomplete from my programs.json file and / or from my Postgres database. It's a Django project though:

    <script>
    $( function() {
    var availableTags = [
    "ActionScript",
    "AppleScript",
    "Asp",
    "BASIC",
    "C",
    ];
    $( "#tags" ).autocomplete({
    source: availableTags
    });
    } );
    </script>

    Any help would be highly appreciated 😀

Leave a Reply