Really good. The reason I love this channel is it contains everything including the deployment. Deployment is important too, without proper guidance you will spend hours to figure out all the configs and combine front and backend.. I've been there and it's a headache.
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
This channel is already the best source for JS training on YT. My projection is that it's just a matter of time to explode in popularity, the author of this channel just deserves it. Excellent content with excellent presentation.
Hello guys. For those getting error during importing material ui in latest version of react just add --legacy-peer-deps at the end of the statement. It will work fine. It took a lot of time for me to solve it but this project is quite good to miss.
I watched this video on my phone and somehow I feel so confident to go ahead and build something similar by my own, all because of your great explanation ❤️
As a new student to React, I just want to thank you for this! You do a great job of explaining fundamentals as you wiz thru the project. Learned so very much! Thank you, thank you, thank you!
@@javascriptmastery something really weird happening around the 1:02:50 mark for me. when I initially change from the getPlacesData() to getPlacesData(bounds...) it works... however upon reload/refresh, it no longer works. Something to do with that initial state of getting current position and passing it along? Not sure... perhaps others have this issue as well.
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
your words, Pronunciations are carefully selected and SOOTHES to hear, somewhat it become tutorial + AMSR. it feels so good to be overwhelmed by your videos ^^
While I do appreciate the tutorials Adrian, please do the due diligence of uploading the code you actually used in the video, not an older version of code. Like many have said, there are tons of bugs which occur even if you code a long, line-by-line with the video. For example: 1. Getting the Google Maps API to properly display (you have to setup a trial account with payment information) 2. Filter parsing errors and exceptions How come there is no explanation in the video? This isn't the first time either. I believe mentioning common bugs and errors, as well as how to solve them should be provided - it's great content and does not detract from your video. Even if you're feeling lazy, a comment or updated description would help a ton. There are tons of people having errors in the comments but it does not seem like you want to help them out. It really is an unnecessary game of checking and accounting for the differences in the video code versus the GitHub code - missing variables, different variable names etc. I highly suggest anyone reading this to not fall for botted comments and to actually read the reviews of people who attempted this project.
In all honestly I believe he shouldn't put all the issues in the project. Yes, it takes more time. Yes you'll have to skim your code more often. However, I've had these issues before with him and others too. It made me be self sufficient went debugging & error handling. The fact that you are suddenly left without proper documentation forces you to look for creative solutions and/or adjust some parts to make it better or more suitable.
@@GetTheGames It's not helpful. If we are following along as beginners and face an error that isn't expected, it makes us lose focus from the main point of the video. Then it becomes an entirely different tangent of try to fix it by going through 10 different forums. However, if he tells us how to fix errors, we get an understanding of how to debug and fix a similar problem in future.
Destructuring of navigator.geolocation.getCurrentPosition in the useEffect in App.js was incorrect in video. It should be "coords", not "coordinates": useEffect(() => { navigator.geolocation.getCurrentPosition(({ coords: {latitude, longitude} }) => { setCoordinates({ lat: latitude, lng: longitude }); }) }, []);
I really love geo-info map related projects! Please teach more projects like this or expand more functions based on this project! Thank you for providing all these high-quality videos!
@@javascriptmastery Oops something went wrong this page does not load Google map correctly.see the javascript console for technical details After run this message is shown is anyone have solution for this
@@AbhishekKumar-nd1sgExperienced this issue earlier. Turns out I had accidentally left one part of the code as is (following the source code) where you need to supply in your API key, replacing ''
What a coincidence.. Been working on a portfolio project of a travel web app and was stuck on what API to use. You just sorted my problem I have been thinking for a whole week. Can't wait to see what I get out of this. Amazing tutorial as always.
1:10:13 haha I just paused the video and I said, until here it looks amazing, then you say, here on JavaScript Mastery we go a step further! That's super cool, excellent work!
Aaaaaand my man drops another bomb!! The amount of JS that I've learnt & improved just by following your videos is insane. Always progress bro, God speed.
I really appreciate your React project videos. Thank you! Can't wait to do this one. I have liked, commented and subscribed. I am definitely interested in your upcoming platform.
I love many of your lessons. But this is one of my favorite. I can say that my words cannot express enough my gratitude to you. Thank you so much for your kindness, Teacher!
YOU ARE AWESOME!!! OMFG I cant express my appreciation for this tutorial and your whole channel - its so helpful for junior devs like in programmers journey
Hi Adrian, I just wanted to thank you for your help, I think you're very patient and professional, and I'm looking forward to take one of your classes!
This is awesome, Thank you very much, sir. you are my best learning facilitator on youtube. Is this the next to the "Memories" video playlist? if not, We can't wait to see the next tutorial for the live chat and google Maps functionalities... Keep it up, sir.
i am wowed, GOD when i would become guru like you JS Wiz you're fucking amazing your tutorial is making me become like i was only learning HTML, CSS , JAVASCRIPT but ever since i joined your channel i have diverted React and Tailwind God Bless You Bro.
You are the best Tech CZcamsr I know, you truly deserve 10 billion subscribers, because you aren't doing SIMPLE TUTORIALS, you are teaching people a REAL JOB, that can CHANGE THEIR LIFE. I hope the best for you and your family ♥
Hi... I'm a huge fan. Love the content. In this tutorial though I found that the RadipApi Travel Advisor API has changed from the one in your video. We are therefore unable to complete the tutorial, which is a shame as it would be great to be able to add it to my portfolio. Would be great if you could help resolve the matter. Many thanks. Keep up the great work!!!
You deserve millions of subscribers and likes as well , I just cannot thank you enough for making this kinda project tutorials. These contents are only available in your channel in youtube. Thank You so much Adrian Sir. ☺❤❤❤
@@javascriptmastery Hi, Is the app. based entirely on html css JS + yahoo/Google services or uses some other frameworks too like Angular, Vue etc. Any info on the backend? Thx
Started learning React js and found ur video just in time to enhance my skill many thanks to u for bringing one after another free video which is like a paid course love from Nepal
you truly are amazing and you never cease to astound me with the quality of what you prodiuce AND THEN publish so that people like me get free access. Saying thank you just doesn't do you justice but thank you.
Hey at 1:02:46 i kept getting an error saying bounds was null. It wasn't until I changed the useState of bounds from useState(null) to useState() and then it worked...I did everything step by step but couldnt get the null part to work
1:05:11 TypeError: Cannot read property 'sw' of null Console: no error Any chance to give some advice? L.E.: (1:16:23, Adrian refer to this error... finally!)
it's completely mind-blowing when it comes to newbies like me. I was a supper exciting project that I've ever seen, didn't feel any boring. I just fall in love on your channel. You project is a great inspiration for me as well. 😍
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
Really awesome tutorial. Could you please create a e-commerce shopping website with all features (like filter,color,variants, product details,) using react hooks and context api?
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
Gem , You are a gem . Just loved the way you explained all the concepts .. I request you to make more similar videos (working with API) , you dont know how much it helped me , I was in need of this project and you just dropped one , Love you Javascript Mastery !!
For those who are trying to make this project, I will say that their is no alternative of google maps API yet, as google has taken the free trial of google maps API to use. So, it will be better that you just skip making this project and if you want to learn use of APIs then yeah you can see the video completely otherwise my suggestion is to leave it and work on another project.
I keep on getting problems with the filter method, here is the message: "Unhandled Rejection (TypeError): Cannot read properties of undefined (reading 'filter')" How can I solve this issue? Thanks for any help.
@@enriquedonaire5378 Hi Enrique, I also had problems with "places.length" I think the issue is with hooks not translating well between the App to the Map, and the Header. have you solved the issue?
@@javascriptmastery You're welcome! Quick question. I'm working on the project at the moment (great so far). But Do I have to pay for the google maps API? If yes, is there anyway that I can avoid the cost?
You are a Torchbearer for us, who really learn web development and explore some ideas and gain deep knowledge about it. So thank you for giving us valuable and priceless love.
Getting an error "this page can't load Google Maps correctly". It seems to load for a second and then it shows me a "for developement purposes only" screen where the map should be. Any ideas?
Thank you soo much for the help full videos. These videos are so clean && help full. Now this month is my last mouth for my progression period and I'm doing pretty fine in the job I hope they will extend my contract after this month, again thank you so much !!
Brilliant tutorials as ever. Although the Travel Advisor API has been deprecated, so you can no longer finish the working project with the API used in the video. Does anyone know of another API that can be used instead?
Almost done with the video but I had to stop to comment. THANK YOU! for putting this out. Just liked and subbed and I hope you keep growing. I'm really impressed with the thorough explanation of each step and why its done. Whenever I had a question, all I had to do is watch for about 5 more seconds before you explained it. Great work!
is it mandatory to enabling billing (entering credit card no) to use google map API key, as it is showing This page can't load Google Maps correctly. error in my case
@@vanshsehgal9475 no bhai, i think there is no way out without a cc, so I hv postponed this project till I get a jugaad, learning advanced javascript concepts now ;)
@@javascriptmastery thanks I hope you will make soon with friend request and profile and private post etc and Polish our skill . Thanks for your great toturial
@@sakshi-ok8zu no I dropped the idea of doing this project because Google maps API is also not free and you have to setup a billing account for using Google maps on your website
@@navendraagrawal Yes it's not free but money wont be automatically debited. I created a billing account. But even after creating one I am not able to use the API's.
Is anyone else getting the "TypeError: Cannot read property 'sw' of null" when trying to have the navigator.geolocation get the lat and long from Chrome? This is at the 1:01:50 mark on the video? I can see that my browser settings are set to allow the REACT app to allow for location and earlier when it was hard coded with London or Tokyo it worked. This video is amazing and would love to get unstuck from this part. I never did see the bounds being set in the console.
@@severedghost I'm not sure exactly what you mean.. Can you share the spot in the code where you do that. A little earlier in the video I didn't see the bounds being returned either.. I've looked at the code on GitHub and it looks either the same or it is just the final code at the end of the project so that doesn't help.
You Are Indeed A JavaScript Master. Learned alot from your vidoes and teaching my students too to transfer my knowledge so they can earn a better livelihood . Thanks Again ❤❤❤ Love from Pakistan 🇵🇰❤
fantastic project with a lot of new concepts, I'm doing this project by following your NextJS 13.4 video. Can you please make the project on "Screen Sharing" concepts? Many thanks from Pakistan
Very Good explanation. But in the initial part of List.js , when we try to iterate over places array using map we need to pass place ={place.name} as prop. instead of place={place}. Since, I find the first approach giving me array contents successfully on the screen. But , anyways, thanks a lot for your effort to explain so well and comprehensive. Doing a great job.
Those people who get Attempted error on the terminal, saying that you failed to import CssBaseLine from @material-ui/core, you should split CssBaseLine from {Grid} and import it from other line individually. import CssBaseLine from '@material-ui/core/CssBaseline'; using this line bellow the {Gird} would help you to solve the problem. I so suffered from that problem :(
Hello mate, since you don't need to import react from react, you can use _rafce when creating your component that will not write Import react anymore :P
since the uagae of google maps and places api is paid, can we use any other free api for the same use like rapid api !! I hope you suggest some for us..
There is a small error in google maps component -> we can't have a dynamic variable (changing value) for defaultCenter prop, i.e before - after - in case of a dynamic variable as Coordinates which gets changed on change of view of the map, we should have *static variable like {lat:0, lng:0}* This worked for me, if I'm wrong please correct me Cheers!!! 👉👈 👐 Thank you for the project, very well done✌✌
@@javascriptmastery Do you mind doing a short on Three.JS Master or incorporate it in your next project? I know its not a trend but it is a great tool.
JavaScript Mastery PRO launching soon! Be the first one to find out about it - javascriptmastery.eo.page 🔥
I'm getting Unhandled Rejection (TypeError): Cannot read property 'filter' of undefined
Please help
any advice?
@@yogitachaudhari2952 same do you found any solution?
@@harshhb18 no
@@yogitachaudhari2952 did uh filled uh billing details..
From SEO & APIs to full MERN CRUD apps this guy keeps giving us one banger after another
That's the goal! 🔥
Really good. The reason I love this channel is it contains everything including the deployment. Deployment is important too, without proper guidance you will spend hours to figure out all the configs and combine front and backend.. I've been there and it's a headache.
I'm glad you like it! 😊
@@javascriptmastery hey i am getting error TypeError: places.map is not a function in List.jsx pls help
@@yashkamboj8025 I think you miss [ ] sign
hi, can you plz tell me whether the project uses hooks or not?
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
This channel is already the best source for JS training on YT. My projection is that it's just a matter of time to explode in popularity, the author of this channel just deserves it. Excellent content with excellent presentation.
Hello guys. For those getting error during importing material ui in latest version of react just add --legacy-peer-deps at the end of the statement. It will work fine.
It took a lot of time for me to solve it but this project is quite good to miss.
THANKS A LOT MAN!!!!
Bro what for Google and other
What about Google map react
Thank you so much for this
Thank you so much...was searching a lot for the solution
I watched this video on my phone and somehow I feel so confident to go ahead and build something similar by my own, all because of your great explanation ❤️
You can do it!
As a new student to React, I just want to thank you for this! You do a great job of explaining fundamentals as you wiz thru the project. Learned so very much! Thank you, thank you, thank you!
Thank you so much!
@@javascriptmastery something really weird happening around the 1:02:50 mark for me. when I initially change from the getPlacesData() to getPlacesData(bounds...) it works... however upon reload/refresh, it no longer works. Something to do with that initial state of getting current position and passing it along? Not sure... perhaps others have this issue as well.
disregard! :) you fix it at 1:16
hi, can you plz tell me whether the project uses hooks or not?
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
your words, Pronunciations are carefully selected and SOOTHES to hear, somewhat it become tutorial + AMSR. it feels so good to be overwhelmed by your videos ^^
While I do appreciate the tutorials Adrian, please do the due diligence of uploading the code you actually used in the video, not an older version of code. Like many have said, there are tons of bugs which occur even if you code a long, line-by-line with the video. For example:
1. Getting the Google Maps API to properly display (you have to setup a trial account with payment information)
2. Filter parsing errors and exceptions
How come there is no explanation in the video? This isn't the first time either. I believe mentioning common bugs and errors, as well as how to solve them should be provided - it's great content and does not detract from your video. Even if you're feeling lazy, a comment or updated description would help a ton. There are tons of people having errors in the comments but it does not seem like you want to help them out.
It really is an unnecessary game of checking and accounting for the differences in the video code versus the GitHub code - missing variables, different variable names etc. I highly suggest anyone reading this to not fall for botted comments and to actually read the reviews of people who attempted this project.
what is the solution to getting googlemaps to work after the keys are verified?
In all honestly I believe he shouldn't put all the issues in the project. Yes, it takes more time. Yes you'll have to skim your code more often. However, I've had these issues before with him and others too. It made me be self sufficient went debugging & error handling. The fact that you are suddenly left without proper documentation forces you to look for creative solutions and/or adjust some parts to make it better or more suitable.
@@GetTheGames It's not helpful. If we are following along as beginners and face an error that isn't expected, it makes us lose focus from the main point of the video. Then it becomes an entirely different tangent of try to fix it by going through 10 different forums. However, if he tells us how to fix errors, we get an understanding of how to debug and fix a similar problem in future.
did you able to build this ?
Destructuring of navigator.geolocation.getCurrentPosition in the useEffect in App.js was incorrect in video.
It should be "coords", not "coordinates":
useEffect(() => {
navigator.geolocation.getCurrentPosition(({ coords: {latitude, longitude} }) => {
setCoordinates({ lat: latitude, lng: longitude });
})
}, []);
I really love geo-info map related projects! Please teach more projects like this or expand more functions based on this project! Thank you for providing all these high-quality videos!
Glad you like it Blair!
Do you know why is necessary to have maps script in the public html? Which is uses the same key as in the Map.js ?
@@javascriptmastery Oops something went wrong this page does not load Google map correctly.see the javascript console for technical details
After run this message is shown is anyone have solution for this
@@AbhishekKumar-nd1sgExperienced this issue earlier. Turns out I had accidentally left one part of the code as is (following the source code) where you need to supply in your API key, replacing ''
Unbeliavable! It might be the 1st time I sat and watched all the way through a 2h tutorial video. Don't regret it. Thanks so much!!
hi, did you completed the map part without any errors?
What a coincidence.. Been working on a portfolio project of a travel web app and was stuck on what API to use.
You just sorted my problem I have been thinking for a whole week. Can't wait to see what I get out of this.
Amazing tutorial as always.
That's phenomenal, enjoy!
Best wishes
Bro how did you solve the problem of "For development purpose only on Google Maps"? I'm getting this watermark on google Maps
@@codeella2947 did you solve it ?
1:10:13 haha I just paused the video and I said, until here it looks amazing, then you say, here on JavaScript Mastery we go a step further! That's super cool, excellent work!
Thank you! 🙌
We can't thank you enough JS.
It's really hard to get such projects for free...thanks so much for blessing us with this 🙌🏾💙
Enjoy! 😊
Aaaaaand my man drops another bomb!! The amount of JS that I've learnt & improved just by following your videos is insane. Always progress bro, God speed.
Thank you so much man!
-----------GETTING THIS ERROR PLEASE HELP--------------------------
(anonymous function)
C:/Users/lenovo/Desktop/project_travel_advisor-master/src/App.js:45
42 |
43 | getPlacesData(type, bounds.sw, bounds.ne)
44 | .then((data) => {
> 45 | setPlaces(data.filter((place) => place.name && place.num_reviews > 0));
| ^ 46 | setFilteredPlaces([]);
47 | setRating('');
48 | setIsLoading(false);
Your content is the best man. I’ve learned more from you in 2 months than every other resource . I’m super excited for your platform!!
You'll love it. I'll try to get it ready as soon as possible!
@@javascriptmastery appreciate you! Would love to hear your story also (how you started coding , etc) .
I really appreciate your React project videos. Thank you! Can't wait to do this one. I have liked, commented and subscribed. I am definitely interested in your upcoming platform.
Thank you so much!
Have uh made this project???
I love many of your lessons. But this is one of my favorite. I can say that my words cannot express enough my gratitude to you. Thank you so much for your kindness, Teacher!
Nhưng mà api bị lỗi rồi bạn
YOU ARE AWESOME!!! OMFG I cant express my appreciation for this tutorial and your whole channel - its so helpful for junior devs like in programmers journey
You're very welcome!
This is the beauty of internet… you are such a genius and kind soul! Thanks for sharing!!!
Thank you! 😊
Hi Adrian, I just wanted to thank you for your help, I think you're very patient and professional, and I'm looking forward to take one of your classes!
This channel is so underrated i dont understand people, why does this guy doesn't have million subscribers?
Maybe in the future :)
This is awesome, Thank you very much, sir. you are my best learning facilitator on youtube. Is this the next to the "Memories" video playlist? if not, We can't wait to see the next tutorial for the live chat and google Maps functionalities... Keep it up, sir.
Thanks you! This is a standalone project 👌
i am wowed, GOD when i would become guru like you JS Wiz you're fucking amazing your tutorial is making me become like i was only learning HTML, CSS , JAVASCRIPT but ever since i joined your channel i have diverted React and Tailwind
God Bless You Bro.
This is amazing. You're the best!
Thank you, you are! 😊
Now I can spend my Weekend productively by building this project!!
Thanks, JavaScript Mastery!!!
Enjoy! 😊
same here bro
Thank you very much for your work. Your tutorials leveled up my programming skills AF :D
I'm glad to hear that! 👌
You are the best Tech CZcamsr I know, you truly deserve 10 billion subscribers, because you aren't doing SIMPLE TUTORIALS, you are teaching people a REAL JOB, that can CHANGE THEIR LIFE.
I hope the best for you and your family ♥
Thank you so much Noureddine! I wish you all the best!
Hi... I'm a huge fan. Love the content.
In this tutorial though I found that the RadipApi Travel Advisor API has changed from the one in your video. We are therefore unable to complete the tutorial, which is a shame as it would be great to be able to add it to my portfolio. Would be great if you could help resolve the matter.
Many thanks.
Keep up the great work!!!
yeah Im having the same issue, getting 403 forbidden errors?
@@agny369 any suggestion what to do?
You deserve millions of subscribers and likes as well , I just cannot thank you enough for making this kinda project tutorials. These contents are only available in your channel in youtube. Thank You so much Adrian Sir. ☺❤❤❤
Always doing the magic
Thanks Eslam!
@@javascriptmastery
Hi,
Is the app. based entirely on html css JS + yahoo/Google services
or uses some other frameworks too like Angular, Vue etc.
Any info on the backend?
Thx
Started learning React js and found ur video just in time to enhance my skill many thanks to u for bringing one after another free video which is like a paid course love from Nepal
Enjoy! 😊
sad that most of the api and also the mui packages and usage are depracated can u do another video like this but updated ?
you truly are amazing and you never cease to astound me with the quality of what you prodiuce AND THEN publish so that people like me get free access. Saying thank you just doesn't do you justice but thank you.
Hey at 1:02:46 i kept getting an error saying bounds was null. It wasn't until I changed the useState of bounds from useState(null) to useState() and then it worked...I did everything step by step but couldnt get the null part to work
@JavaScript mastery any solutions ?
Yes change null to empty object like ({})
The feeling when it finally runs after countless errors is unbeatable✨
Did you use Google api only ? And is it free?
1:05:11
TypeError: Cannot read property 'sw' of null
Console: no error
Any chance to give some advice? L.E.: (1:16:23, Adrian refer to this error... finally!)
Same here, idk what to do
@@megamario58 see my later edit, it will be corrected
@@calinpuscas you are a legend thanks
it's completely mind-blowing when it comes to newbies like me. I was a supper exciting project that I've ever seen, didn't feel any boring. I just fall in love on your channel. You project is a great inspiration for me as well. 😍
Thank you so much! ❤️
@@javascriptmastery
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
Really awesome tutorial. Could you please create a e-commerce shopping website with all features (like filter,color,variants, product details,) using react hooks and context api?
Great idea! 👌
@@javascriptmastery I am eagerly waiting for this one.. thanks
did u successfully implemented the project ????
As i was not able to do beacuse they are asking billing details
@@shubhamphadatre4497 same here how do you solved
I’m always blown away by you’re work! Thank you for the amazing projects. I am super excited about the new platform.
Thank you Paul!
on my react application which i am creating using the video " I am getting for development purpose only" and there is greyish thing on screen ---if anybody knows what to do to remove the grey thing and the I am development.... please help .
Great tutorial, keep it up man! I hope you make react native tutorial like Uber clone, it would be cool :)
Great idea!
Gem , You are a gem . Just loved the way you explained all the concepts .. I request you to make more similar videos (working with API) , you dont know how much it helped me , I was in need of this project and you just dropped one , Love you Javascript Mastery !!
Thank you! Will do!
hi, did you completed the map part without any errors?
Ya it showed me error in the map the map was not visible it showed goggle map not supported , does it require billing?
@@artandjournaling1908 Yes it requires billing. I was stuck on the same error too. You need to create a billing account to use google maps platform.
For those who are trying to make this project, I will say that their is no alternative of google maps API yet, as google has taken the free trial of google maps API to use. So, it will be better that you just skip making this project and if you want to learn use of APIs then yeah you can see the video completely otherwise my suggestion is to leave it and work on another project.
I added my debit card details to Google maps API and used it. I wasn't charged!!
Is there any other way to use Google maps Api in free
@@smritichandra3372 I can't able to add credit card details . Is there any alternative way to use ...
@@smritichandra3372 is it charge or not ??
I love your projects man. I have learned a lot from you. Keep going and never stop what you are doing now.
Thank you so much!
Unmatched video 🔥🔥..only of its kind on CZcams
That's the goal! 🔥
@@javascriptmastery can you make video on how to choose the right libraries for a project in react and how to use it too....means like a guide
is someone stuck with the "maps javascript api" part as it is required a billing account to move further.
++
yes bro, me too.
You are great sir, Because of your memories project i got a job..... Please encourage us doing such type of projects 😍😍😍😍
Amazing job, congrats! 🔥🎉
@@javascriptmastery 😍😍😍😍
Error: You must include a `google` prop ---getting this error after 34:38 map section. Can anyone help?
May God bless you. This is absolutely mind-blowing that you're sharing your knowledge with us for utterly free. I can't thank you enough!
Thank you!! 🙌
I keep on getting problems with the filter method, here is the message: "Unhandled Rejection (TypeError): Cannot read properties of undefined (reading 'filter')" How can I solve this issue? Thanks for any help.
I have the same problem and I've tried everything but it doesn't work : (
@@enriquedonaire5378 Hi Enrique, I also had problems with "places.length" I think the issue is with hooks not translating well between the App to the Map, and the Header. have you solved the issue?
the problem is when u r not getting data from backend. so best practice would be place ? operator before properties i.e. places?.length
@@arcosd63 you have not been able to solve this problem yet?
@@astra_______ I got it going a while back, but it took me a while to figure it out.
How do people dislike a video so great??? howwwww. Well done sir. I just started your video and Youre doing a great job
Thank you so much 😀
@@javascriptmastery You're welcome! Quick question. I'm working on the project at the moment (great so far). But Do I have to pay for the google maps API? If yes, is there anyway that I can avoid the cost?
You are the Man and I salute to you that you are sharing a valuable, even Paid Project with us. Many Many Prayers for you.
My screen just went blank no errors no nothing i cant see the header, Map and the list any suggestions?
Same problem
I think rapid api has stopped working
You are a Torchbearer for us, who really learn web development and explore some ideas and gain deep knowledge about it. So thank you for giving us valuable and priceless love.
Glad you like it! 😊
Tech Torchbearer
Getting an error "this page can't load Google Maps correctly". It seems to load for a second and then it shows me a "for developement purposes only" screen where the map should be. Any ideas?
did u successfully implemented the project ????
As i was not able to do beacuse they are asking billing details
@@shubhamphadatre4497 ya same prob brother🙂🙂
@@shubhamphadatre4497 same prblm
The api we using is a free version so we can complete the tutorial but we see the developer only overlay
@@usamasaleem5624 is it worth to make this project???
Thank you soo much for the help full videos. These videos are so clean && help full. Now this month is my last mouth for my progression period and I'm doing pretty fine in the job I hope they will extend my contract after this month, again thank you so much !!
Good luck! 😊
Brilliant tutorials as ever.
Although the Travel Advisor API has been deprecated, so you can no longer finish the working project with the API used in the video. Does anyone know of another API that can be used instead?
That explains why mine wasn’t working
Surprisingly, I finished my project even though the API was deprecated. when you test the endpoints It would generate the results.
I'm going to create about 100 accounts here on youtube to like all this guy's videos!
Haha thank you! 👌
Awesome ❤️🔥
One question, where can I get your paid courses?
Like do you teach on udemy or other websites?
I'm releasing a new platform soon, you'll love it!
Almost done with the video but I had to stop to comment. THANK YOU! for putting this out. Just liked and subbed and I hope you keep growing. I'm really impressed with the thorough explanation of each step and why its done. Whenever I had a question, all I had to do is watch for about 5 more seconds before you explained it. Great work!
Bro how did you solve the problem of "For development purpose only on Google Maps"? I'm getting this watermark on google Maps
thank you so much i learn a lot by watching you videos and follow them. you teach very well i have done many projects with you
Thank you so much!
Does anyone know how to fix this?
Unhandled Rejection (TypeError): Cannot read properties of undefined (reading 'filter')
(anonymous function)
42 |
43 | getPlacesData(type, bounds.sw, bounds.ne)
44 | .then((data) => {
> 45 | setPlaces(data.filter((place) => place.name && place.num_reviews > 0));
| ^ 46 | setFilteredPlaces([]);
47 | setRating('');
48 | setIsLoading(false);
Did you find a solution yet? I can't find it anywhere...
@@randerins Sorry I did not, decided to just ignore the tutorial and build my own from scratch.
@@randerins Did you find the solution?
This Channel is awesome for react developer.
#NeedMoreTutorial
Thank you
Thank you!
is it mandatory to enabling billing (entering credit card no) to use google map API key, as it is showing This page can't load Google Maps correctly. error in my case
did u get the solution?
@@vanshsehgal9475 no bhai, i think there is no way out without a cc, so I hv postponed this project till I get a jugaad, learning advanced javascript concepts now ;)
@@theguptacircle8550 okk. Cool!!!
I am new to programming but your channel has been incredible. I will definitely be paying for your courses. I want to be under your mentorship
Thank you so much! 🔥
I will be happy if you make Facebook clone with react and firebase with friend request and other Facebook functionality like an dislikes
Great idea!
@@javascriptmastery thanks I hope you will make soon with friend request and profile and private post etc and Polish our skill . Thanks for your great toturial
You really are an amazing and awesome teacher. I learned a lot from you. thanks....thanks...thanks
Thank you so much!
The open weather map api is no longer available please suggest an alternative
have you found any alternative?
@@sakshi-ok8zu no I dropped the idea of doing this project because Google maps API is also not free and you have to setup a billing account for using Google maps on your website
@@navendraagrawal ah okay, thanks for replying!
@@navendraagrawal Yes it's not free but money wont be automatically debited. I created a billing account. But even after creating one I am not able to use the API's.
@@navendraagrawal please which projects did you do in place of this?
This is awesome! I'm absolutely building this! Thank you!
Have fun! 🔥
Is anyone else getting the "TypeError: Cannot read property 'sw' of null" when trying to have the navigator.geolocation get the lat and long from Chrome? This is at the 1:01:50 mark on the video? I can see that my browser settings are set to allow the REACT app to allow for location and earlier when it was hard coded with London or Tokyo it worked. This video is amazing and would love to get unstuck from this part. I never did see the bounds being set in the console.
I would suggest to compare your code with the code from the GitHub repository linked in the description. Good luck in fixing the error 👌
I'm having this same error,
It seems to work if you add the coordinates to the dependency array that sets the coordinates in the App component
@@severedghost I'm not sure exactly what you mean.. Can you share the spot in the code where you do that. A little earlier in the video I didn't see the bounds being returned either.. I've looked at the code on GitHub and it looks either the same or it is just the final code at the end of the project so that doesn't help.
I got stuck with the same error, and looking at final code does not help, as its name implies, it is FINAL code, which has lots of changes...
@@shafigh6916
@Richard Meadows
in app.js file declare bounds like this.
const [bounds, setBounds] = useState({});
instead of null , pass an empty object tr
Thank you for yet another fantabulous video, JavaScript Mastery. This is awesome! 🙌
Thank you Ahmad, means a lot!
Thank you !. Amazing way of presentation and clear and step by step . You are so enthusiastic teacher
Thank you so much! ❤️
Is that API is free?
not anymore
Thank you so much. Next.js instead of react would hv been dream come true. ANyways I ll code along using next.
Great idea for the future!
First like!!!!
Thanks Giuseppe! 😊
Love the projects you bring, they are interesting to make and there are so many things to learn.
first
Great job 👌
@@javascriptmastery Please do some react native builds 🥺🥺
you really deserve title of js master(king of js )❤
Haha thank you! ❤️
I must say you are a blessing in disguise!!
Thanks for the wonderful tutorial
Thank you so much! 👌
You Are Indeed A JavaScript Master. Learned alot from your vidoes and teaching my students too to transfer my knowledge so they can earn a better livelihood . Thanks Again ❤❤❤
Love from Pakistan 🇵🇰❤
Thank you so much! ❤️
@@javascriptmastery My Pleasure ❤❤
You're the best, I can build my own projects because of your tutorials!
I'm so glad to hear that!
Its my first complete tutorial with you. And It was Awesome, I learned a lot of new things. Thanks buddy
Glad to hear that!
did u successfully implemented the project ????
As i was not able to do beacuse they are asking billing details
@@shubhamphadatre4497
what is the problem with this project ? cuz i want to start with it t practise on react ?
@@ahmedsamir-ic5tq There is problem with google maps js api becoz even if we enter the credentials then also it doesn't work
fantastic project with a lot of new concepts, I'm doing this project by following your NextJS 13.4 video. Can you please make the project on "Screen Sharing" concepts?
Many thanks from Pakistan
What an awesome idea from you to create this tutorial! 😊I just cant wait to start working on this project with your guidance! ❤️
Good luck! 😊 ❤️
Have uh made it??
Very Good explanation. But in the initial part of List.js , when we try to iterate over places array using map we need to pass place ={place.name} as prop. instead of place={place}. Since, I find the first approach giving me array contents successfully on the screen.
But , anyways, thanks a lot for your effort to explain so well and comprehensive.
Doing a great job.
I am going to use this one as the final project of my frontend internship 🔥
have you completed this project then please share me your github link please as soon as possible 🥲🥲
@@adityagunale1590 can you share ur github with that project?
Those people who get Attempted error on the terminal, saying that you failed to import CssBaseLine from @material-ui/core, you should split CssBaseLine from {Grid} and import it from other line individually.
import CssBaseLine from '@material-ui/core/CssBaseline';
using this line bellow the {Gird} would help you to solve the problem. I so suffered from that problem :(
Bro i also had this error few times but i solved it. Thanks for sharing this problem and the solution.
457693
Hello mate, since you don't need to import react from react, you can use _rafce when creating your component that will not write Import react anymore :P
It's just an old habit that I have haha
thanks for this course God bless you
So nice of you
i assure that those will people dislike your video who don't know javascript and programming
Hopefully they'll learn :)
thanks bro for making this course free
No problem 👌
since the uagae of google maps and places api is paid, can we use any other free api for the same use like rapid api !! I hope you suggest some for us..
Ohhh wow I love this idea!🔥😍 Thanks for your awesome tutorials!🙌🏻
Thank you so much! 🔥🎉
I like this! Good example to guide how to hook popular APIs into React clearly.
There is a small error in google maps component -> we can't have a dynamic variable (changing value) for defaultCenter prop, i.e
before -
after - in case of a dynamic variable as Coordinates which gets changed on change of view of the map, we should have *static variable like {lat:0, lng:0}*
This worked for me, if I'm wrong please correct me
Cheers!!!
👉👈
👐
Thank you for the project, very well done✌✌
You are such a inspiration sir...Now I have to add Another project in to do list.
Thank you so much!
Really awesome. I find this series really educating especially because standards deployed are industry level of things
You deserve more than a like and a comment... Salute Master👮♂️
Thank you so much Christian!
@@javascriptmastery Do you mind doing a short on Three.JS Master or incorporate it in your next project? I know its not a trend but it is a great tool.
The React.js master is back with a banger! Awesome project..
Thank you!
The content of this channel is amazing. Thanks a lot for such great tutorials.
You're very welcome!