3.1 API calls from Node.js (Weather data from Dark Sky) - Working with Data and APIs in JavaScript

Подписаться 1,7 млн

Просмотров 144 тыс.

50% 1

💻github.com/Cod...
Welcome to Module 3! I covered a lot about node.js in the previous module, but there are still a few key elements left to discuss!
In this module, I build the "Weather Here" project (based on example by Joey Lee). In this first video, I demonstrate how to connect to an external API from node.js itself. Later, I'll look at how to hide an API key as well as deploy a project to publicly accessible web server.
🎥 NEXT LESSON: • 3.2 Open Air Quality A...
🎥 PREVIOUS LESSON: • 2.5 Database Query - W...
🎥 FULL COURSE: • Working with Data and ...
🔗 Dark Sky API: darksky.net/dev
🔗 Node.js: nodejs.org/en/
🚂 Website: thecodingtrain....
💖 Patreon: / codingtrain
🛒 Store: www.designbyhu...
📚 Books: www.amazon.com...
🎥 Coding Challenges: • Coding Challenges
🎥 Intro to Programming: • Start learning here!
🔗 p5.js: p5js.org
🔗 Processing: processing.org
📄 Code of Conduct: github.com/Cod...

Опубликовано:

3 окт 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 141

@KalyanSingh-sd3jw Год назад

Three Years later and i can't find a better vid than this for resolving cors.Thank you for the beginner friendly and clear explanations.

@Sondly Год назад

Just wanted to say thanks for this video. I was struggling with properly using a 3rd party API. Most tutorials on RU-vid show how to use 3rd party APIs but not on how to setup a route so the user/client doesn't have access to your key! This was super valuable, in ANY REAL WORLD APPLICATION, you don't want the user to have access to that key! They could run up your bill etc! Thank you for the video.

@stevenrivadeneira990 3 года назад

This is an amazing series. A note regarding node-fetch as of 09/18/21: When I ran "npm install node-fetch", it gave me an error because node-fetch got upgraded to v3 and was wanting me to use "import" instead of "require". Make sure you update your .json to run node-fetch to version 2.0.0 if you see the same issue, and then it will work! Just paying it forward =) Thank you so much for these videos!!!

@mahmoudalsayed3041 3 года назад

you are a legend :D

@aislayer2866 2 года назад

thanks sooooooooooooooooooooooooooooooooooooo much

@averagegodotenjoyer 2 года назад

Saved the day. Thanks.

@Roudrix118230 2 года назад

Thank you very much, my dude

@dokidoki408 2 года назад

Man I should have read the comment section first I, lol. I also found a solution from stackoverflow on how to solve this problem, were you first uninstall fetch-node ("npm uninstall node-fetch") than install fetch-node v2 ("npm install node-fetch@2").

@kaxbyrita9279 2 года назад

I’ve watched through the Coding Train videos for about a year now, and i’m still amazed that this quality stuff is just out there for everyone to enjoy for free. So huge thanks.

@alpachino468 3 года назад

I don't think I've ever seen a more cheerful, bubbly, coder before... I'm usually banging my head in pure frustration whenever I have to explain anything code-related to anyone, especially my bosses...

@oxygenmoldova Год назад

Man you are a treasure, thank you for your effort and all of the content that helped thousands of people to become better devs and struggle less with reading answers on stackoverflow

@Bradenxd12 4 года назад

This was exactly the explanation I was looking for when it comes to CORS. It has been quite a confusing topic for me until now, excellent video!

@progressnwimuelekara2167 2 года назад

Just seeing this channel for the first time (I wonder how it's possible that it took so long) and I already like how you explain things.

@alexf7552 3 года назад

I'm working on a personal project to develop some web dev skills and this video just helped me immensely with a problem that i've been struggling with the last couple of days. Thank you!

@leerenae313 3 года назад

Amazing this is such a great reference, short, concise and straight to the point! You're an amazing teacher thankx for putting this up for free ☺

@kardes8528 Год назад

I want to say thanks for this and all other videos that you make. You make my days with whole those videos and the energy that you give us. You are the one of the bests who has all the attraction during the video with covering whole knowledge. Thank you Daniel with all my heart :)

@lilrex2015 5 лет назад

Still awesome, loving this video series. I vote for an OAUTH2 series at some point.

@sanchitverma2892 5 лет назад

vote

@pablovm578 5 лет назад

Thanks to his advice i was able to do this from scratch play.google.com/store/apps/details?id=com.supercalamar.spaceout

@godetarnaud1005 4 года назад

You guessed it right at the beginning of the video (well around 5min) dark sky api isn't an option anymore (it got brought by Apple and stopped allowing new sign ups) so I'll follow along using Open wheater api (it seems to be pretty similar and also ask to create an account) I'll comment again if it's a success and share the code on github if others are interested :D (btw this video series is awesome ! I really enjoyed going until there ^^)

@BrianKiddDevDesign Год назад

Did it work using Open weather api?

@geoffwagner4935 11 месяцев назад

wow those rover cameras are amazingly clear

@heavygruff 4 года назад

6 days left until I finish the requirements of my bachelors in software engineering and this refresher has been clearer than any of my instructors have been able to explain anything. Thank you. Happily hitting that subscribe button.

@devilnight6610 5 лет назад

Let's share this video to your friends who have the same passion! People : The Coding Train is Quality Contents RU-vidr? Me : Yes.

@alexsandergutierrezgoncalves 5 лет назад

very cool these classes, it is difficult to find classes in Portuguese with a level of content well explained, so I watch English with subtitles kk

@destinationveritas406 5 лет назад

Loving your video series on this topic so far. These videos have answered some questions I've had for a few days now that I haven't seen covered, or at least not in a clear manner, in other tutorials here on RU-vid or even on Udemy. Keep up the fantastic work! Looking forward to watching more of your content.

@aliaksandrhn1 2 года назад

You make great videos and manage to do it in a fun way. Your personality is endearing. Thank you.

@personzen8028 Год назад

old but gold, thank you

@piotrkalman1562 2 года назад

You are a magician. I've been looking for a solution for a week. Thank you so much :)

@swiftpotato6746 4 года назад

So I was trying to get data from an API and kept getting the CORS error. I was fetching from the client side but then I clicked and remebered this video! Thanks man :D

@matteol1356 3 года назад

Dark Sky doesnt work anymore, I tried using another API from another web site called "open weather" and it works just fine, it also has an easy to read documentation!

@jamesharrington2385 4 года назад

I really love this teaching format with the presentation style.

@JustinSulak 4 года назад

"The risk here is the Dark Sky API may not exist anymore...". *Foreshadowing*

@atharvparlikar8765 3 года назад

these fucking bots

@heksqer1022 5 лет назад

Love your way of teaching ! Looking forward to this series.

@andrewwee8450 2 года назад

"This is my API key" -> famous last words

@annahri 5 лет назад

I hope there's someone like you (or you!) to have series on .NET CORE!

@mkhalidumer 4 года назад

Hi Daniel, thanks for being here always :) You have got a unique style of explaining, really appreciate your effort and time you put to create these tutorials :) may I ask a question, ? why node-fetch, why not request ?

@kreddy241 3 года назад

You are the best - I've learned so much from you. Appreciate your vids!

@danfeinstein4424 2 года назад

"Dark Sky might change a little by the time you do this..." "Dark Sky is closing its API in 2023 and is no longer accepting new signups" lol

@vasyaqwe2087 2 года назад

This helped so much! You're amazing!

@harjotsingh8671 2 года назад

I love this guy.

@anubislockward3750 2 года назад

Just so you know...the Dark Sky API is no longer accepting new subscriptions.

@theodoredwernicki5729 2 года назад

Would you recommend any other weather api ?

@Pdrum2 4 месяца назад

@@theodoredwernicki5729I would use national weather service

@yourteacher4353 5 лет назад

Thank you, Daniel. Top notch as always.

@prabhatsingh7713 4 года назад

You are genius brother....!!

@punjabitech5546 3 года назад

Thank You. Your channel is awesome

@m5amisi896 3 года назад

wow, I love you man. you saved me.

@gme0ver24 5 лет назад

Super useful content, thanks!

@andylib 4 года назад

While watching (end of March 2020, during Corona) I just got the notification that apple acquired Dark Sky and will be shutting down these services: - the iOS app will be continued, website and android app will be shut down at the beginning of July 2020 - the API will be available until the end of 2021 .. what a bummer

@jamesjassi37 4 года назад

could you please tell me how to find similar api ?

@BenjaminCarlson 4 года назад

@@jamesjassi37 Here's a similar one I found that I'm going to be using to build the same thing but in flutter! www.climacell.co/weather-api/

@snacksy7754 4 года назад

This one is not as easy to use but run by a Norwegian government institution so will probably not disappear any time soon URL: api.met.no/weatherapi/locationforecast/2.0/compact? PARAMATERS: lat=60.10&lon=9.58 Tempature at: response.properties.timeseries[0].data.instant.details.air_tempature So yeah not as easy to use 😅

@Ketrixx Год назад

04:30 - and the risk comes true, Dark Sky API doesn't exist anymore it was replaced by WeatherKit REST API

@ItsANoBrainer 5 лет назад

You should do a video in this series that utilizes Websockets using the WS javascript library! I think it would fit very well with the server theme.

@SimonTiger 5 лет назад

0:52 That's also true in the original Data Selfie App project!

@SimonTiger 5 лет назад

So I don't know why you've done that in this project, but not in the Data Selfie one.

@jonathan-._.- 5 лет назад

In this case query params would probably be the preferred choice as you have 2 variables with the same 'importance' - for path paramers im usually expecting a sort of inheritance structure like weather/:country/:state/:city where each path paremeter is a subset of the one before

@fcs_96 5 лет назад

Nice lesson. Thanks

@yulinglin8508 3 года назад

Save my life! Thanks a lot!!!

@Programmerprith 3 года назад

Sir can you please suggest any other api like dark sky

@PauloMiello 2 года назад

Thank you!!

@yuriihusak1959 5 лет назад

Hi! I love what you are doing, thanks! I was wondering why don't you use the advanced destructing ES6 feature for variables assignment, like: const { lanlon } = request.params; const [ lat, lon ] = lanlon.split(","); Mostly, it is shorter... But in spite of that your channel is still the most interesting on youtube

@TheCodingTrain 5 лет назад

Thanks for the tips!

@omars.162 5 лет назад

Awesome video! Quick question, what is your terminal setup?

@TheCodingTrain 5 лет назад

This workflow video series might help! ru-vid.com/group/PLRqwX-V7Uu6Zu_uqEA6NqhLzKLACwU74X

@c810549 5 лет назад

Hi , thank you so much for the great video. I’m also interested in learning „URL query string“, can you please point me out which video from you I could watch ? Thanks again for the amazing video.

@ViswasHaridas 5 лет назад

Hey, you might be looking for 'Template literals', which is a feature introduced in ES6. Basically, you use backticks ( ` ) instead of quotes ( " ) to enclose your string, and you can put any js expression inside these: ${} Here's an example: const name = 'Chun'; const mood = 'happy' console.log(`I'm ${name} and I feel ${mood}!`); // I'm Chun and I feel happy! Docs: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

@joe_3y3s 5 лет назад

Could you do some of these vids with testing? There is such a lack of test driven tutorial vids out there!

@bpc1026 4 года назад

Darksky does still exist in the same manner..... although it appears Apple just bought them and they have closed signups and the API will not be available starting 2022 :/

@getorvillized7499 5 лет назад

At the beginning of the video, it sounded like you were going to cover different hosting options. When are you going to go over that part? :)

@TheCodingTrain 5 лет назад

Check the full playlist, it's the last one! ru-vid.com/group/PLRqwX-V7Uu6YxDKpFzf_2D84p0cyk4T7X

@getorvillized7499 5 лет назад

@@TheCodingTrain Ok, thanks.

@TheUnown4 2 года назад

does post and get really matter if you can get data via post response or post data via get request?

@Varshakumari-uz8uo 3 года назад

Your teaching style is fabulous. But when I am writting same code to call third party API I am getting error.

@someoneoutthere1866 4 года назад

Apple discontinuing API since they bought DarkSky

@geoffwagner4935 11 месяцев назад

The mot important take away here , is the "cors", i really thought node.js just had a better fetch, turn out it' because it's a server not a client

@yashchaudhary3544 3 года назад

We can send lat and long from client to server via request parameters while making the get request. Someone correct me if I am wrong

@hayderjabur6258 4 года назад

so what is the best way to make a request from client side or server side ?

@vvill-ga 4 года назад

If you are here for the tutorial to learn how to access an api with node.js the video starts at 5:00...

@clementvanhecke2832 5 лет назад

Checkout Netatmo's weathermap, very similar !

@ujjavalsinghvlog7545 5 лет назад

woah we can save check ins to session or local storage instead database :O

@אביחימסלאווי 3 года назад

Hi .. I build a server api one my local computer that only says hello . It works with request from postman an it works with request the from the browser ..but it doesn't work from a fetch call its show the same CROD error what to do .

@jonathan-._.- 5 лет назад

I wonder if thers a procy pass endpoint for node ?

@mythic126 5 лет назад

Gave me an idea.

@daybreak_eats 3 года назад

Can someone help me understand why the request from the browser received the CORS error, but not from the server, which I presume was requested from the same public IP (origin) as the client? Or is that mentioned in an earlier video?

@RupertBruce 2 года назад

The server has its IP address and can be set up to hold the API key securely as explained in the video. The client is on the user's machine which has its own IP address and the browser restricts what the javascript has access to. You are in control of the server and you have the key. The user is in control of the client so it is not safe to send your key, just the data that the server acquires using your key.

@anvakondakciu4154 4 года назад

Unfortunately, in June 2020 the Dark Sky API is not accepting any new sign-ups :(

@gokselkucuksahin 3 года назад

15:30 Or, we could use array destructuring; const [lat, lon] = request.params.latlon.split(',');

@NIronwolf 3 года назад

I'm thinking why bother to split it at all? Just pass in ${latlon} to the URL literal. A bunch of code to parse it then reassemble it exactly as it was.

@zicada7661 5 лет назад

Why don't darksky offer a POST endpoint i wonder. Seems easier to send lat and lon in the request-body instead of having to combine and then split the two parameters in the url.

@mart3323 5 лет назад

there's a bunch of rules called the 'REST principles' that guide what the URL should look like and which verb (GET vs POST vs ...) you should use for each request Most API's try to follow that because existing tools take advantage of those semantics (for example browsers will warn you if you try to refresh a page opened with a POST request, telling you that it will resend the request and it might cause something to happen twice) The effort of having to split/join two numbers and put them in the right place is trivial enough that it's not even a consideration

@gabrielfono844 Год назад

I am not sure why I can't see the src folder

@gabrielfono844 Год назад

sorry mistake I solved my issues since I come from java background , I was little bit confused thanks your tutorials are amazing

@johncerpa3782 5 лет назад

Awesome

@kaizen9451 5 лет назад

When's your 3rd book, Daniel? :P

@magdalenaduma1660 4 года назад

Hi i try use different ApI from openweathermap.org/, ale path looks like this: `api.openweathermap.org/data/2.5/weather?appid=MY_KEY&lat=${lat}&lon=${long}`, how can i route parameters from this path without "/"? in express we have a hint, but i dont know how: Route path: /users/:userId/books/:bookId Request URL: localhost:3000/users/34/books/8989 req.params: { "userId": "34", "bookId": "8989" } Please help me, where am I must looking for answer? :)

@kureysalp 4 года назад

Tahnks for this video series they are awesom but I have a problem. When I typed ${variable} for parameters code takes it as a text its color not turning to blue. What is wrong in here?

@kureysalp 4 года назад

I passed parameters with putting + between text and variable bur I wonder why ${} didn't work for me

@davidchen4495 4 года назад

Late reply but it’s back quote not single quote

@nvurt 3 года назад

@@davidchen4495 Thanks for adding this.

@Arisekiwi 5 лет назад

Hi Daniel, I am running into problems with the geo location. I can successfully run the "data selfie app" in Chrome and Firefox but it is not geo locating at all. And there are no errors in the console or in google developer tools. The app works for taking images and storing the data in the db but no location data... Weird. Have you had any problems? This issue also occurs in module3. Kind Regards.

@TheCodingTrain 5 лет назад

hmmm, maybe you have some security settings on your computer that block the browser from geolocating?

@Arisekiwi 5 лет назад

@@TheCodingTrain I thought about that, So I modified the settings in my browser to no avail. My next point of call is another laptop. Good news is though the image saving and comment check in side are working perfectly.

@geoffwagner4935 11 месяцев назад

i''ve done so many fetch i'm not even sure why i tried node-fetch lol

@kjyhh 5 лет назад

Very basic technic of a client request and response to server and to another server. #nodejs

@asturnebur 5 лет назад

is this video upload again?

@geoffwagner4935 11 месяцев назад

More important 2023 than dark sky(meh it is important i did want to know who apple's api was), node.js has a convenient fetch now since one i in e6 and express is not. the fetch-node npm just become incredibly inconvenient now.

@Mmustafa-v4j 4 года назад

Noooooo Dark sky is no longer accepting new registrations.

@bacho7410 5 лет назад

How can I send something from server to client without client requesting it?

@stabgan 5 лет назад

you need ro ask permission and also the client may need to be subscribed to webhooks

@TheCodingTrain 5 лет назад

You could also investigate websockets

@praful728 5 лет назад

Can you take session on npm Mqtt.

@DayV_ 5 лет назад

Video on npm: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-s70-Vsud9Vk.html

@ivansakal1224 5 лет назад

Are we gonna see some Python content anytime soon?

@darkceptor44 5 лет назад

Why do you use const so much, isn't it best practice to use var for variables that you're not gonna use outside of the functions?

@jochenpanjaer980 5 лет назад

Best practise is to use const and let.

@lilrex2015 5 лет назад

var gives you global scope access and as such, you can screw with the assignment which can cause problems. Let is local scoped, and Const prevents reassignment. it is better to use Const.

@darkceptor44 5 лет назад

@@lilrex2015 I thought var was actually local scope not global, anyway const will cause an error and interrupt the entire thing if it's null, I think using var and manually checking would be safer because you could make it run anyway and account for the error.

@lilrex2015 5 лет назад

@@darkceptor44 if the information if going to be dynamic whether that be from user input or just data manipulation you would ideally use Let over var, CONST is used when you know exactly what's coming in and want a permanent setting. So in a fetch, the URL for the destination server should normally be a const.

@jochenpanjaer980 5 лет назад

@@darkceptor44 if const turns out to be null, it is null for a good reason. you can then check for null of falsy data and handle it appropriately. data flow and documentation is important. without writing actual documentation, const gives you already a good insight that the data will not change. I use const about 10 times more often than let. And I (and my team) never use var.