2.2 Geolocation Web API - Working with Data and APIs in JavaScript
ฝัง
- เผยแพร่เมื่อ 22 ส.ค. 2024
- 💻github.com/Cod...
Before diving into communication between client and server (GET and POST requests), let's look at the Geolocation Web API with navigator.geolocation. This data will be sent to the server and stored in a database in upcoming videos.
🔗 Web API Navigator: developer.mozi...
🎥 NEXT LESSON: • 2.3 HTTP Post Request ...
🎥 PREVIOUS LESSON: • 2.1 Server-side with N...
🎥 FULL COURSE: • Working with Data and ...
🚂 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
Welcome to Working with Data and APIs in Javascript!
This course is for aspiring developers who want to learn how to work with data in web applications. How do you retrieve, collect, and store data?
We are now in Module #2! In our previous module, we focused on client-side JavaScript. We now will learn the basics of server-side programming with Node.
📄 Code of Conduct: github.com/Cod...
I feel like I've found a secret room full of gold. Quality content right here!
Yes soo true ;-)
i guess Im randomly asking but does anyone know of a tool to get back into an Instagram account??
I somehow lost the password. I would love any assistance you can give me!
@Johnny Mayson instablaster ;)
i literally just yelled where have u been my whole life! subscribed instantly
A room full of free dynamic webserver gold!
This. Guy
This. Is how teaching is done
This. Makes me happy
How can someone be this good at being good.
An interesting question.
This playlist is so well done. My gf who has never done a lot of coding before is able to follow along from the beginning and she is learning so fast. Thanks for all the great content you make!
So glad I found the playlist to these unlisted videos lol
On TheCodingTrain's TH-cam page, click the "Videos" tab to see a list of All the videos. None of them are actually unlisted.
Or use this URL to go straight to them: th-cam.com/users/shiffmanvideos
For me, the most grateful things that I found in your channel is that you explained the long process in the beginning and then you explained the more effective way to write the code. It really helps me to understand it and be creative in the future. Thanks!
I had a dream where I got to meet TheCodingTrain on a field trip to a university where he was a professor for quantum computers that used Javascript. And no one but me knew who he was. 7/10 would dream again
I have always been more focused on back-end and low-level stuff but have been curious about the basics of web development. I'm very excited to see a series with your level of polish and teaching ability. Can't wait to see this continue!
I watch a lot of TH-cam coding videos. Yours are always some of the best.
Outstanding video! I now understand the client/server interaction much more because of this video, thank you!
I really enjoy all your course
3 years ago , I was watching your videos for fun.
and 2 years later I am working as full stack engineer focused on React , s3 , spring boot.
I love node and I am taking it for fun
thanks sir for such amazing content
This is the best TV show since Sopranos
Finally someone that explains the basics before moving on, even better than the paid service I have, thanks man!
Man, I really love Your energy! Compared to other online tutorials I feel like watching standup vs documentary movies
Came here just to say that you're my best teacher. Thank you so much for your videos :)
This has helped me understand not just more about Node Js but server vs client side code.
You're a very charismatic speaker!
Here comes the God of teaching complex stuff with ease
A nice module to add in future videos will be "nodemon" so you won't have to restart the server every now and then! Spectacular content and explanation! +1 Sub!
You are my hero Sir. Much respect for your amazing way of teaching.
You are a gifted talented instructor. Thank you so much!
I have had issue learning nodejs but this guy made it look so simple
the way you teach is so great
Dan, you really are the Bob Ross of coding.
Wow, just wow, If I ever become a good enough developer, it will be mostly because of you. Thanks for this and everything on your channel.
you are the person in this world i learned most of the things that i never had intererst on your energy is incredible...the country where i live most of my theachers think i'm dumb they have favourite students and not behave equaly with every student.. wise someday i would show your videos to them how to teach anyone..thanks to you daniel for spreding your knowledge you are always going to be my idol
THE BEST CODE TEACHER ON TH-cam THAT IVE SEEN !!!!!
You are the best lecturer I have ever seen
I cant thank you enough for explaining concepts with so much energy and love. Thanks a lot.
how did I not know this channel before?
entertaining, fun, and above all useful!!
Love waking up to these videos, thanks Dan
i hope you are teaching in some school, because the school need your enthusiasm
You are an absolute legend fren!! 🙏🕊
I love the way you move from one presentation to another, it fills me up with energy too :)
Thanks for the content.
This has been one of your most brilliant videos! Congrats! Years ago I used to hang out at NYU CS dept (w/ Ken Perlin, is he still around?) Hello Waverly Place!
CIA teaching us how to geolocate one another 👏💯🌹
Now we know where you work 😉!
By the way, great content.
Cool explanation.
Thank you, Daniel☺️👍
Note: warn about Geolocation API requires secure origins and trusted certificates in order to run. As you use "localhost" literally, is treated as secure origin. So as you are able to run your server from "localhost", you can test the feature. But, some dev environments uses fixed IPs, and therefore they're not able to run geolocation API.
By the way, what about find euclidean - pythagorean distances for closest locations, 3D to cartesian (elevation), Haversine, etc for reverse geo, specially when not third party APIs or map abstractions need to be used (didactic purposes).
Thanks, great job. Gracias, gran trabajo.
i was remotely trying this example and failed and couldnt figure out how to grant permission on my local machine.
@@judgeomega Resources that are not local, to be considered secure, must meet the following criteria: must be served over or wss:// URLs. The security properties of the network channel used to deliver the resource must not be considered deprecated
I feel like i m in class of Professor (Money Heist) 😄😄 U R real great teacher💓 Thank you
Ooh. A video about the map coloring problem would be epic
I think when you zoomed in to show the ° i actually saw all the pixels on you screen lol
Great tutorial by the way cant wait for part 3
I've used it two years ago on mobile and it worked better than Google maps 😂. It worked even on a Nokia phone
Dude…you’re f**king amazing. Thank you
Daniel you are a hero!
Thanks for this, I had no idea that was built in the browser already!
If you're doing ES6 syntax - you might also want to try out destructuring assignments
This is when you pull out multiple (or even just one) of an object's properties into their own variables
// For example
let latitude = position.coords.latitude;
let longitude = position.coords.longitude;
// can be written as
let { latitude } = position.coords;
let { longitude } = position.coords;
// or all together as
let { latitude, longitude } = position.coords
Oh, thank you for these tips!!!
Bro you are just awesome 😎😎
I appreciate your great videos
me before finding this content: Okey I am never going to learn APIs and Databases properly..
me being halfway through: this is actually doable!
rlly thx, without this I would probably be lost haha
wait what? I have not found this guy till now? Is it me or youtube that sucks
Love You man !! Love what You do !! Thank You for aller You do for us 😊😊
The work he does is absolutely amazing! I'm so grateful this exists.
This is great. I love your lesson. Thanks a lot
Great videos, thank for share yours
knowledge with us. Saludos desde Honduras
Who could be so ungrateful to vote thumbs down?
Make something like this always. your are awesome man!
The vibes are totally awesome
That laugh at 10.11 is happiness.
Looking forward to a great 2024!
Thank you for the generous support!
Just a note: Navigator.battery is actually very outdated. The newer version is the Promise-based Navigator.getBattery(), but even that is deprecated in most modern browsers. I think Chrome and Opera are the only ones that still support it, against standards suggestions.
Ah, thank you for the clarification!!
Hey, I was looking for you at stars and found you on earth!!!
Hey , you are doing just amazing ! upload more videos like this
If you really want to update it to ES6 style, you can wrap the getCurrentPosition function in one that returns a promise instead of using callbacks :)
I'm a coding God now 🙉🧠💥
"I can post data and fetch the server's response." There you go :)
I'm having so much fun with this playlist, do you have other new playlists that I could check out?
Let's be honest guys, we all looked up the coordinates as soon as they were revealed, lol
Bruh these 15 min video are shitting on my entire software engineering degree lol
thank u sir.it very useful
Daniel: 9:28
NSA: hold my tracker
Super awesome video! Learned a lot as a beginner! Thanks for all the fun and knowledge you are emitting! fo (let stuff of ['bunch of stuff you can try - suggested by Daniel]'){
timeTakes(stuff) = 5+ hours
};
But so worth it!
Thanks for good knowledge video
Are the coordinates correct? In this case the recording took place in the Broadway block in New York, is that correct?
geolocation doesn’t work for me 100% of the time, it sometimes times out before it can retrieve my location, and even after multiple refreshes, it still keeps timing out
I believe this has to do with the asynchronous nature of the function. Look up how to use async await, it might help
Your shirt is awesome!
It's a bit confusing for me that the client-side javascript is written inside the index.html-file here, and not in a separate index.js file (the server-side javascript file could then me named server.js). This is making it harder for me to understand how the various dependencies should be referenced in a (proper) set-up with the client-side javascript in a separate file. But I will persevere. Otherwise very helpful and well-made content, thanks.
Thanks!
[Violation] Only request geolocation information in response to a user gesture. ------> I get this error message when geolocating. anyone?
I like your tutorials, is it possible to make a real-time chat application in p5.js ?
K. Christian Im also looking for a video like that!
how to overcome the violation : only request geolocation information in response to a user gesture ?
no luck so far , on a mac couldn't make it to work using chrome or safari, on safari the issue is different , is asking for a secure connection, probably something is different on your configuration , but it would be good to know what to change , tested on safari 12,1 , and chrome 74.03729.169
in order to make it work , i have to add : navigator.geolocation.getCurrentPosition(success, error); and the corresponding functions ..
Ur the best from 🇩🇿
awesome love it
Liked, commented and subscribed ❤️
good job sir
Great Tutorials sir new subscriber here, Just wondering if you have a tutorials on working with Fetch api then create a new page when each item will be clicked. Thanks
Pardon me if I missed something but, can you show the hard-coded code for where/how you plugged in the coords to see your marker on the map?
9:40 FBI wants to know your location
hi dan. how to enable writing access logs when we run the index.js via node? I'm positive that there must be some sort of logs for it.
Thanks in a million!
Thank you
If you wrapped all the JS in a function and added a button but it's NOT working you should ensure you didn't capitalize the F in function. I did and couldn't figure it out for 10 minutes.
Sir i am getting wrong geo location
. I have tried diff diff programs in diff diff language.. All those results are very poor.. They are showing my location somewhere else. Some results I read on Google says that our location is detected by IP also my IP address location ia somewhere else..
coding garden with dan ;) i like this content
why did you use text content instead of innerHTML? is there a reason for that?
YOU LIVE ON WAVERLY PLACE I KNEW YOU WERE A GOD DAMNED WIZARD!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
Nice shirt XD 😂 in previous video also, I wrote the similar comment 😂
Does getCurrentPosition() need to be passed an anonymous function or can you make a function elsewhere and pass it that to keep things modular?
I guess I can fire up my laptop and find out.
I'm having an issue. After running my code through node, I get an error saying that navigator is not defined. I have tried importing a navigator module into my node modules folder. Am I missing something? I've been successful with pulling up the geolocation prompt whilst working solely offline and not utilizing any kind of localhost server. Help would be appreciated, thank you!
Hello Dan, I just found your video, would like to play with it, where can I download the current sketch?
I'm looking to build an ambulance tracking system using restful API. could you please help?????