Build Weather App Using React Native | React Native Tutorial & Project | JavaScript Code | Beginners

Source Code & More: / bugninza
Hello guys, My name is Rohit Kumar Thakur. In this video, I will show you, how to make a weather application using react native expo. I am using openweathermap for the weather API. This platform and reliable. You can use openweathermap for learning purposes. React Native Expo is a cross-platform framework, which gonna helps you to build mobile apps for both Android & iOS devices. The code part is not that much tough. You just have to follow the video to get the desired output. Happy Hacking
𝐁𝐨𝐨𝐤 ( 𝐅𝐫𝐨𝐦 𝐂𝐨𝐝𝐞 𝐓𝐨 𝐂𝐨𝐧𝐧𝐞𝐜𝐭𝐢𝐨𝐧𝐬: 𝐀 𝐃𝐞𝐯𝐞𝐥𝐨𝐩𝐞𝐫’𝐬 𝐠𝐮𝐢𝐝𝐞 𝐭𝐨 𝐛𝐮𝐢𝐥𝐝𝐢𝐧𝐠 𝐚 𝐬𝐨𝐜𝐢𝐚𝐥 𝐜𝐚𝐫𝐞𝐞𝐫 )
Amazon India: amzn.eu/d/axYh0B4
Amazon Worldwide: a.co/d/acqJOYR
Gumroad (pdf): ninza7.gumroad...
Topics covered:
✅ Beautiful UI-UX
✅ Weather App for Android Using react native expo
✅ Weather App for iOS using react native expo
✅ How to use openweathermap API
✅ Integrating openweathermap with react native expo
✅ Use of expo-location to get the precise location of the user.
✅ Get hourly weather report for the next 24 hours.
✅ Amazing Weather App With decent UI using react native
Openweathermap: openweathermap...
My social Links:
Instagram: / _ninza7
Twitter: / _ninza7
Website: ninza7.me
Video widgets edited by: / kaushal_2319
Music Source: NCS
Tags: react native, react native tutorial, react native app, react native project, react native tutorial for beginners, react native navigation, react native expo, react native full course, react native animation, react native crash course, react native app development, react native app tutorial, react native app project, react native android, react native ios, react native android app, react native CLI, react native crash course, create react native app, code step by step react native, react native design, deploy react native app, react native tutorial in Hindi, react native navigation, what is react native, react native projects, learn react native, react native setup, react native expo tutorial for beginners, react native UI, react native expo, expo react native, react native expo tutorial, small projects in react native, Weather app, react native expo project for beginners weather app using expo
#reactjs #javascript #reactnative #ios #android #react

[@BugNinza]

Link used:
url: api.openweathermap.org/data/2.5/onecall?&units=metric&exclude=minutely&appid=${openWeatherKey}
Weather Icon 1: openweathermap.org/img/wn/${current.icon}@4x.png
Weather Icon 2: openweathermap.org/img/wn/${weather.icon}@4x.png
Do subscribe and keep supporting

[@mreal_Wakusei]

can you provide source code of this as I am facing problem with your writing errors?

[@BugNinza]

You can request codes for up to 3 videos by joining the "Elite Ninza Army" membership. You can join here: ruclips.net/channel/UCLTAVHeuoOyc4aFIA1o6Xygjoin

[@JokeryEU]

you dont need to go up every time to add the import just do ctrl+space at the end of the word and you will get the list of imports

[@themalelibrary5072]

Hey bug thanks for making this video, but i get this error 'TypeError: undefined is not an object (evaluating 'forecast.current.weather')'

[@BugNinza]

Recheck your code. Everything is well tested. You can DM me on my social media handle for further queries and quick response. Happy hacking 😉

[@FA-BCS-ALIRAZAUnknown]

same error how the error was solved anyone

[@joegreen1531]

This is wonderful. Do you have the code posted anywhere? Github?

[@helloneighbor975]

Which extension do you use for auto completing code

[@BugNinza]

Copilot

[@sekoutraore69]

Thanks for the video. Very simple coding.

[@BugNinza]

Glad it helped

[@labtopico928]

i need to ask to to add rnfe in visual studio code in 1:04 minute

[@BugNinza]

Add extension es6 or es7 to your vs code

[@labtopico928]

@@BugNinza THNX

[@mohammadayaansiddiqui7125]

At 3:22 what url did u used? where can i get it?

[@BugNinza]

api.openweathermap.org/data/2.5/onecall?&units=metric&exclude=minutely&appid=${openWeatherKey}

[@B.Maksym]

@@BugNinza its paid version

[@xinyu3650]

the weather icon link is not found

[@BugNinza]

${current.icon} information should be correct

[@xinyu3650]

@@BugNinza but it is 404 not found

[@symanhnguyen6631]

thank you about this example

[@BugNinza]

I'm glad it worked. Keep supporting

[@i8avenger63]

Hello Rohit, Thank you for this amazing tutorial, i am getting some error after complete bundling the application request for location permission (first time running) but after that error occurs "Something went wrong" can you please tell if its an API issue of something else? there is no error on terminal tho

[@BugNinza]

Retry after some time, may be some technical issues occurred. You can tell me more about your error on my social handle. I'll be happy to hear

[@alphatechlk]

@@BugNinza I have the same problem please help

[@alphatechlk]

Also I get this error in first compilation :- [Unhandled promise rejection: TypeError: undefined is not an object (evaluating 'forecast.current.weather')]

[@FA-BCS-ALIRAZAUnknown]

same issue with me

[@lan.__.e]

@@FA-BCS-ALIRAZAUnknown ​ did you try this: const current = forecast.weather[0]; and when fetching don't use onecall if you don't have paid version. Use the default url from Open Weather API ending with: org/data/2.5/weather?
And for fetching this: const response = await fetch(`${url}&lat=${location.coords.latitude}&lon=${location.coords.longitude}&APPID=${openWeatherKey}`);