Build a coronavirus map with fetch & mapbox

Поділитися
Вставка
  • Опубліковано 5 лис 2024

КОМЕНТАРІ • 61

  • @JadJoubran
    @JadJoubran  4 роки тому +3

    Learn JavaScript 👉 learnjavascript.online
    React Tutorial 👉 react-tutorial.app

  • @TinaNiaki
    @TinaNiaki 4 роки тому +15

    This is one of the most helpful programming videos I've EVER come across. Amazing way to break things down and explain your logic as you progress through the code Jad. Thank you and please keep these coming.

    • @JadJoubran
      @JadJoubran  4 роки тому

      Thank you so much 😁 I already started planning the next one

  • @edisvelicanin8854
    @edisvelicanin8854 4 роки тому +3

    you should be making more of these videos. very insightfull. definitely cheking your course.

  • @yusufyesilyurt2754
    @yusufyesilyurt2754 2 роки тому

    You made it look so simple. This is great.

  • @Justin-tq3em
    @Justin-tq3em 3 роки тому +1

    I enjoyed the video. Currently retaking your fundamentals course then moving to the next course. I like seeing HOW you are setting up the file structure and getting the data.

  • @jonahg6564
    @jonahg6564 4 роки тому +2

    SImple and extremely clear! A good teacher can explain and you did very well! Ive been trying to figure this out for a while now! Earned a sub for sure

    • @JadJoubran
      @JadJoubran  4 роки тому

      Thanks Jonah :D happy o hear! Make sure to checkout my courses, they follow the same teaching style ;)

  • @BotsOne
    @BotsOne 4 роки тому +1

    Thanks a lot Jad! I just got this working using a free coronavirus API from rapidAPI. I added a few more colors and a popup that says the country name and how many cases there are when you hover over a marker too. Planning on adding global stats to the corner next! Great tutorial can't wait for more!

    • @JadJoubran
      @JadJoubran  4 роки тому

      oh nice awesome! Feel free to share the link if you end up deploying it, would be nice to check it out :D

    • @brianwachira
      @brianwachira 4 роки тому

      Yeah can you explain how you did this. I am trying to add hover effects and I cant find clear tutorials

    • @gitikasonker
      @gitikasonker 4 роки тому

      can you share the link?

  • @jatinc6058
    @jatinc6058 4 роки тому +1

    Thanks for this. Why did you not use Live Server within VSCode? Also, are you using Fetch to get your maps via API?

  • @thebinsohail
    @thebinsohail 4 роки тому

    I request you to make a JavaScript Series like beginners to pro.
    Your teaching style is amazing

    • @JadJoubran
      @JadJoubran  4 роки тому

      It's already there as an interactive course ;)
      Programming concepts for beginners: learnprogramming.online
      JavaScript for developers who already know the programming concepts: learnjavascript.online
      Same teaching style, more interactive.

  • @ritsk4338
    @ritsk4338 4 роки тому +1

    You are awesome. Subscribed. From India

  • @hellyski
    @hellyski 4 роки тому +6

    Great video! Would love to see more of this type of material. 🙏

    • @JadJoubran
      @JadJoubran  4 роки тому

      Thanks! Already planning the next video ;)

  • @tasaduqhaqaq979
    @tasaduqhaqaq979 4 роки тому +1

    i want to find the user location and based on user's location i want to show the user the available restaurants in his/her area. Could you please guide me for that

  • @drashtikaneriya3138
    @drashtikaneriya3138 4 роки тому +1

    Can I fetch value from Autocomplete Searchbox to database?

  • @huzaifabinzahoor
    @huzaifabinzahoor 3 роки тому +1

    Absolutely Great work. Can you please provide the code as well?

  • @thelazygunner
    @thelazygunner 4 роки тому

    is it possible to style the marker other than just changing the color such as making it a circle or displaying the case number when hovered? I checked mapbox on custom markers but the tutorials use geoJson to populate the map so I don't know how to do this without using the geojson and instead use a API which returns the long and lat values just like you have in your video.

  • @EscOfficial
    @EscOfficial 4 роки тому +1

    Yo Brother, can you show us how to hover each country and display a popup with the infected ammount?

  • @naghamalsayegh4551
    @naghamalsayegh4551 3 роки тому

    Thanks for making this.
    I just wanna ask if you can help me with plotting circles instead of markers as in the app of coronavirus

  • @pellegrinoernesto
    @pellegrinoernesto 4 роки тому +2

    you deserve 100x subs 😎

  • @justpassingbylearning
    @justpassingbylearning 4 роки тому +1

    so there isnt a get-latest anymore just checkpoints and places

  • @dylanlalonde
    @dylanlalonde 4 роки тому +1

    Thanks for making this Jad!

    • @JadJoubran
      @JadJoubran  4 роки тому

      :D

    • @JadJoubran
      @JadJoubran  4 роки тому

      @Dylan Lalonde Looks like it, thanks! For some reason I didn't get a notification about this comment

  • @zoro3048
    @zoro3048 4 роки тому +1

    It would be so helpful, if you can provide the source code for this..

  • @PedroFerrareziGamer
    @PedroFerrareziGamer 4 роки тому

    Hello, I'm from Brazil, I have some doubts about the map of the covid-19.
    I need to do a job for school, I'm in the last year, can you take any questions from me?
    Can I make a heat map using google API?
    Can I use the firebase on the backend?
    my goal is to make a heat map of covid-19 to teach at school, but i can't find tutorials on the internet demonstrating how to make such a map with google API and using firebase as a database.
    Would it be too much to ask you to make a video demonstrating how to do such projects? I would be very grateful, hug from Brazil
    * used translator *

  • @munjikahalah
    @munjikahalah 4 роки тому

    where can I find this data you guys?

  • @khanas1000
    @khanas1000 4 роки тому

    while using it with node.js on server side i am getting this error
    ReferenceError: self is not defined
    any fix??
    (I am using node with Express.js for backEnd and EJS for templating )

  • @SteveNgaiCheeWeng
    @SteveNgaiCheeWeng 3 роки тому

    Map starts at 11:52

  • @fabricioaraujo7642
    @fabricioaraujo7642 4 роки тому +1

    Please make some content about PWA, thanks for nice content :)

  • @gmstabloid
    @gmstabloid 4 роки тому +2

    Thank youuuuuu!!!!!!!!!!!!!

  • @ArpitDhamija
    @ArpitDhamija 4 роки тому

    from where i can get the dataset

  • @oumarsekisinde797
    @oumarsekisinde797 4 роки тому

    Hello Jad, thanx for the great work, however, i was trying out this with every step you took, but got errors , i sued thoug a phar file but it does not work either
    1have failed to copy that json url link from the site ,
    2 VM85:1 Uncaught SyntaxError: Unexpected end of JSON input
    at JSON.parse ()
    at showNeg.js:241
    at XMLHttpRequest.onDefaultReadyStateChangeHandler (s
    3 the "report" reference un defined
    I thank

    • @JadJoubran
      @JadJoubran  4 роки тому +1

      It's most likely because coronavirus.app changed their API completely

    • @oumarsekisinde797
      @oumarsekisinde797 4 роки тому

      Jad Joubran , thanx though man

  • @GeeksDen
    @GeeksDen 4 роки тому

    Sir please provide link of data which you used in that map
    Please sir

    • @GeeksDen
      @GeeksDen 4 роки тому

      Thank you sir I got that 😎😎

    • @AnandaChaudharyOfficial
      @AnandaChaudharyOfficial 4 роки тому

      Can you provide me that link of data of current cases??

  • @jaedon01
    @jaedon01 4 роки тому

    Do you know sketchware

  • @ChillerDragon
    @ChillerDragon 4 роки тому +1

    Riding the hype :D

  • @nahida4444
    @nahida4444 4 роки тому

    Anyone knows why my map is not showing up in chrome? In firefox, it works well.

    • @JadJoubran
      @JadJoubran  4 роки тому

      do you have the height on the map?

    • @nahida4444
      @nahida4444 4 роки тому

      @@JadJoubran -I set height = 100vh in style

  • @nafiaaaitmoh8270
    @nafiaaaitmoh8270 4 роки тому

    salut vous pouvez donnez code source ????

    • @JadJoubran
      @JadJoubran  4 роки тому

      github.com/jadjoubran/coronavirus-map

  • @Matonias
    @Matonias 4 роки тому +1

    Real life Plague Inc.