🔴 Build Weather App Using React Native | React Native Projects | Beginners

  Рет қаралды 73,106

Code With Nomi

Code With Nomi

Жыл бұрын

Hello everyone 👋, today we are going to make a very cool fully functional weather app in react native. you will learn a lot in this single video and you can add this project to your portfolio as well.
make sure you like this video and subscribe the channel for more react native videos.
🚀 Source Code: links.codewithnomi.com/weathe...
🏞️ Assets: drive.google.com/file/d/1UNUf...
Weather API : www.weatherapi.com
Add TailwindCSS in React Native : • Food Delivery App with...
Add Navigation in React Native : • Food Delivery App with...
If you appreciate my work and you would like to support my channel: www.buymeacoffee.com/syednoman
🚨 more videos on react native:
Food Recipe App with Reanimated : • 🔴 Build Food Recipe Ap...
AI Voice Assistant with ChatGPT & DALL-E : • 🔴 Build a React Native...
Movie App : • 🔴 Build Movie App Usin...
Travel App UI : • 🔴 Travel App UI | Reac...
Coffee App UI: • 🔴 Coffee App UI - Reac...
KZfaq Clone App: • 🔴 KZfaq Clone - Reac...
Login | SignUp UI : • 🔴 Login | SignUp UI - ...
Fast Food App : • 🔴 Fast Food App UI - R...
App Store UI : • 🔴 App Store UI - React...
Fruit Shop UI : • 🔴 Fruit Shop UI - Reac...
Firebase Authentication React Native: • React Native Firebase ...
Food Delivery App : • Food Delivery App with...
Learn React Native: • Build Expensify App Wi...
Learn Reactjs: • Modern React For Begin...
#expo #reactnative #tailwindcss #javascript #programming #typescript #speedcode #coding #design #appdevelopment #reactjs #ui #uiux #reactnavigation #reactnativetutorial #react #animation #reactjs #navigation #navigationbar #uidesign #mobiledevelopment #iosdeveloper #buildinpublic #opensource #reactnativeapp #reactjstutorial #typescript
react native animations
animations in react native
react native tutorial
react native app
react native tutorial for beginners
react native project
react native course
weather app in react native
weather app
weather api
Icon credits:
www.flaticon.com/free-icons/w...
www.flaticon.com/authors/freepik
www.flaticon.com/authors/good...
www.flaticon.com/authors/bqlqn
www.flaticon.com/free-icons/rain
www.flaticon.com/free-icons/c...
www.flaticon.com/free-icons/c...
www.flaticon.com/free-icons/t...
www.flaticon.com/free-icons/mist

Пікірлер: 94
@elmuccho
@elmuccho 6 ай бұрын
Incredible! Thanks Nomi!!!
@be_calm2372
@be_calm2372 4 ай бұрын
Thanks fir this man I have created alot of Apps but these videos are so perfect for practicing
@FarazAhmed-rd3if
@FarazAhmed-rd3if Жыл бұрын
Good bro, it helps alot. God bless you.
@hubesh716
@hubesh716 Жыл бұрын
Thanks for this project❤
@usmanmarkaz
@usmanmarkaz Жыл бұрын
Thanks for this project sir ❤❤
@UsmanShah-6
@UsmanShah-6 Жыл бұрын
Fabulous work ❤
@UnchartedWorlds
@UnchartedWorlds 4 ай бұрын
Hi, do you get any banding on android or iphone when you blured that image?
@sheikhhamad5069
@sheikhhamad5069 4 ай бұрын
wow...that is amazing
@BuiltbyJay
@BuiltbyJay 9 ай бұрын
Following this project is quite frustrating because I don't want to overdepend on the repo provided but you didn't go through the setup in your video. The extra length wouldn't deter commited coders. But i just started and im discouraged to continue.
@codewithnomi
@codewithnomi 9 ай бұрын
apologies for this, i know i didn't started from scratch. I'll keep this in mind next time ;)
@mralphak2873
@mralphak2873 Жыл бұрын
i love it! 🔥. If u want a different api with 07 days forecast there is visualcrossing or Weatherbit API too ^^
@edemamet533
@edemamet533 10 ай бұрын
Okay please Buh would it work perfectly like the one being used
@haidarDevDiary
@haidarDevDiary Жыл бұрын
Beautiful 🤩 Design
@Thunderstormplus
@Thunderstormplus Жыл бұрын
class, but how can I add geo next to the search button, i.e. determine the location?
@Dawshashow
@Dawshashow 2 ай бұрын
Do you offer customized services? If you purchase this project, is it ready to be uploaded to the App Store and Google Store or does it need programming?
@NashrinFathima-oh7ji
@NashrinFathima-oh7ji 7 ай бұрын
Great one
@davidadokuru8139
@davidadokuru8139 Жыл бұрын
Thanks Nomi
@jeffqseid2169
@jeffqseid2169 11 ай бұрын
THANKS MAN
@reorganise
@reorganise Жыл бұрын
You could have added a pressable or touchable opacity to the days so it switches out the current forecast on the main screen and showcases the next day’s weather forecast. Great video! 👏🏽
@codewithnomi
@codewithnomi Жыл бұрын
Totally forgot about that 😅, but I believe you can do it yourself after watching this video 😉
@reorganise
@reorganise Жыл бұрын
@@codewithnomi For sure it’s easy to do lol
@josephconduah912
@josephconduah912 9 ай бұрын
Nice work
@motivationalbeast3569
@motivationalbeast3569 4 ай бұрын
I integrated your project in my app but it is showing weather for 3 days only at the bottom and some times dont shows the picture
@aymenbachiri-yh2hd
@aymenbachiri-yh2hd 3 ай бұрын
THank you
@astronautpolar596
@astronautpolar596 Жыл бұрын
thanks
@Mossad84
@Mossad84 Жыл бұрын
Hi Nomi, I really like your tutorial. Why you don't use Expo router?
@codewithnomi
@codewithnomi Жыл бұрын
sure, I will make a video on expo router
@Mossad84
@Mossad84 Жыл бұрын
@@codewithnomi Nice!
@binauralbeats-relaxingmusi4336
@binauralbeats-relaxingmusi4336 29 күн бұрын
Jaise mern stack me node js, express js and mongo use krte backend ke liye. React native me backend and data base ke liye kya use krte.
@codewithnomi
@codewithnomi 29 күн бұрын
Same
@user-xd2co7rp7x
@user-xd2co7rp7x 3 ай бұрын
any api that give wheather data according to coordinates
@yuliav4682
@yuliav4682 11 ай бұрын
If there was a snow icon in that icons package can you share it, please?
@codewithnomi
@codewithnomi 11 ай бұрын
I got all these icons from icons8, check here: icons8.com/icons/set/weather
@vivekparmar1780
@vivekparmar1780 3 күн бұрын
thanks for great knowledge ...can you share this code for more detailing.
@clumsysandesh
@clumsysandesh Жыл бұрын
This would have been so much better if you properly explained how to setup the project as well. At most, it would have been 1 hour long. I wanted to do this project, but sadly I am a total beginner and I cannot get the setup done myself.
@codewithnomi
@codewithnomi Жыл бұрын
I'm really sorry about that, I tried explaining about the setup briefly but I'll try to explain it next time. You can check out the Github repo for this project, the link is in the description ;)
@codewithnomi
@codewithnomi Жыл бұрын
environment setup : kzfaq.info/get/bejne/lcBjZqeF05a-dqM.html
@joegreen1531
@joegreen1531 Жыл бұрын
A have 2 questions, I'm really hoping you can help me! I'm new to coding. 1) I am only able to gather data for the 1st option in the autocomplete search bar... I can't get info for any other options that come down. Can you help me? 2) In the Daily Forecast section it sorts from Thurs to Wed. I want it to sort from tomorrow for 7 days.
@codewithnomi
@codewithnomi Жыл бұрын
1) if you pass the city name or lat, lng values for other options, you'll get details for those locations 2) weekly forecast data includes the current day as well, you can remove the first day and then show the forecast for next 6 days That's just how their api is designed, you can always check out other weather apis 😉
@joegreen1531
@joegreen1531 Жыл бұрын
@@codewithnomi thanks! i fixed one of my problems. the other problem where you said, " if you pass the city name or lat, lng values for other options, you'll get details for those locations". I can't figure out how to do this :( Would you be able to help me?
@vincefrancbazar318
@vincefrancbazar318 9 ай бұрын
Hi Nomi, Can I have the permission to use your project on our subject mobile tech? Im not rlly into coding and our Instructor hasnt teach us yet on how we will start our project. I rlly wanted to start asap so I can start analyzing the different parts and learn how they works.
@codewithnomi
@codewithnomi 9 ай бұрын
i don't see why not 😃
@Thunderstormplus
@Thunderstormplus 3 ай бұрын
I remember that the source code was on github, I tried to find it to look, I searched, I searched and no, where did it go?
@hubesh716
@hubesh716 Жыл бұрын
Sir is sanity Ecommerce project completed?if . complete plz make video how i add payment gateway in this app
@codewithnomi
@codewithnomi Жыл бұрын
The sanity course is complete, I will add the payment gateway to another project ☺️
@enricoroselino7557
@enricoroselino7557 7 ай бұрын
wait the thats looked like css, can any1 provide me his or someone elses video to setup this so i can follow along ?
@codewithnomi
@codewithnomi 7 ай бұрын
kzfaq.info/get/bejne/lcBjZqeF05a-dqM.html
@kunalkashyap1339
@kunalkashyap1339 4 ай бұрын
my text input search bar is not showing why?
@Barcie.
@Barcie. 20 күн бұрын
saaaame problem
@user-yx8kz5bg1h
@user-yx8kz5bg1h Жыл бұрын
Hello, Does this app work on the web?
@codewithnomi
@codewithnomi Жыл бұрын
it should
@cua9932
@cua9932 Жыл бұрын
I build app on android. Everything is ok. Only thing is when I search my keyboard shows up and it ruins the interface. Do you have a way to solve this problem?
@codewithnomi
@codewithnomi Жыл бұрын
use keyboardAvoidingView
@user-en4fc5by1r
@user-en4fc5by1r 9 ай бұрын
I am having the same issue can you explain how to use keyboardavaoidingview? I am new to coding@@codewithnomi
@vikasphulriya1841
@vikasphulriya1841 8 ай бұрын
i used keyboardavoiding view but thier was no response at all@@codewithnomi
@vikasphulriya1841
@vikasphulriya1841 8 ай бұрын
did you find any solution
@user-xd2co7rp7x
@user-xd2co7rp7x 3 ай бұрын
that pics that your are using for wheather how to access that pics
@codewithnomi
@codewithnomi 3 ай бұрын
check video description for assets
@YB-Eng
@YB-Eng 8 ай бұрын
Please in your next tutorials, if you can start with the content first, because starting with the styling makes no sense for us as learners, we need to see each property's effect on the content. and thanks for your efforts.
@luuphuochung98
@luuphuochung98 10 ай бұрын
I only see 3 days for some reason, it return 7 days for the past few days when i'm loading the app but now it only return 3 days.
@codewithnomi
@codewithnomi 10 ай бұрын
maybe your trial period expired
@aswineepratihari7897
@aswineepratihari7897 11 ай бұрын
7:00
@aswineepratihari7897
@aswineepratihari7897 11 ай бұрын
35:00
@aswineepratihari7897
@aswineepratihari7897 11 ай бұрын
18:00
@chiraggadhvi6868
@chiraggadhvi6868 10 ай бұрын
When i'm using this in my phone the keyboard messes up the UI what should i do??
@codewithnomi
@codewithnomi 10 ай бұрын
yeah i forgot to fix that, you can fix it by using keyboard avoiding view
@chiraggadhvi6868
@chiraggadhvi6868 10 ай бұрын
Could you explain how>>@@codewithnomi
@vikasphulriya1841
@vikasphulriya1841 8 ай бұрын
did you find any solutuion
@jayprakashjaiswal8220
@jayprakashjaiswal8220 Жыл бұрын
Hello there ,one request with u ,please can u make video on image to pdf converter app ,where user can see all the images from device ,select images and convert to pdf and able to see all the pdf files on clicking pdf tab as we saw different pdf app on playstore ,I just want to learn how to play with file system,If u have time please make it happen
@codewithnomi
@codewithnomi Жыл бұрын
sounds cool, will create a tutorial on this someday 😉
@jayprakashjaiswal8220
@jayprakashjaiswal8220 Жыл бұрын
@@codewithnomi ok,please
@Johnkamiru-ux3qs
@Johnkamiru-ux3qs 4 ай бұрын
your github handle for this project please
@HorbieeProgramming
@HorbieeProgramming 11 ай бұрын
is it responsive ?
@codewithnomi
@codewithnomi 11 ай бұрын
Yes
@Shubuu7
@Shubuu7 Жыл бұрын
how to responsive design in nativewind please sir create on video please please please 🙏🏻🙏🏻🙏🏻
@codewithnomi
@codewithnomi Жыл бұрын
This design will be responsive as I've used flex, but I'll create a more detailed video on responsive design 😊
@Shubuu7
@Shubuu7 Жыл бұрын
@@codewithnomi please make a video as soon as 3-4 days they will help me 😐
@shahhussain56
@shahhussain56 Жыл бұрын
Please make a pizza booking app with node express back end .
@codewithnomi
@codewithnomi Жыл бұрын
noted
@shahhussain56
@shahhussain56 Жыл бұрын
@@codewithnomi Thank you so much and you are doing great for making these videos. I will definitely share and suggest to my friends and colleagues.
@martinmiz
@martinmiz 4 ай бұрын
Great project, but not beginner friendly. If you skip the installation and configuration of packages, then that's not beginner level.
@bachton2028
@bachton2028 2 ай бұрын
vai o
@genzee4567
@genzee4567 10 ай бұрын
@codewithnomi This is very disappointing what you did in this video!! I am complete beginner to React Native knowing 0. I followed the official documentation and installed React Native using expo. Your and mine folder structure, file contents and everything is completely different! You did not show "what to delete", "how the project flow is going in your folder, how can i sync your once with mine? How can I link HomeScreen.js with index.js " and vice versa!! Please keep absolute beginners in mind!!
@codewithnomi
@codewithnomi 10 ай бұрын
my apologies, I'll keep that in mind next time. there is a github repo link in the video description, you can check out the complete source code for this project.
@genzee4567
@genzee4567 10 ай бұрын
@@codewithnomi Thanks you!
@Clout-000
@Clout-000 Ай бұрын
not good video dislike, just if you want to see code or something else you need to pay 5$ but this animal not say it
@gnom-om
@gnom-om Жыл бұрын
boring
@usmanmarkaz
@usmanmarkaz Жыл бұрын
Like your name😊
@gnom-om
@gnom-om Жыл бұрын
@@usmanmarkaz dont be jealousy, baby )
React Native vs Flutter in 2024 - Make the RIGHT Choice (Difference Explained)
10:31
Daniel Dan | Tech & Data
Рет қаралды 147 М.
Vivaan  Tanya once again pranked Papa 🤣😇🤣
00:10
seema lamba
Рет қаралды 30 МЛН
Enums considered harmful
9:23
Matt Pocock
Рет қаралды 196 М.
Add Tailwind CSS In Your React Native App
8:48
Code With Nomi
Рет қаралды 41 М.
#1 Create a Simple Login Screen in React Native
5:15
WithFrame
Рет қаралды 12 М.
This UI component library is mind-blowing
8:23
Beyond Fireship
Рет қаралды 608 М.
Vite Crash Course | Faster Alternative To CRA
16:24
Traversy Media
Рет қаралды 189 М.
Getting Started with React Native and Expo | DEVember Day 1
3:00:42
notJust․dev
Рет қаралды 35 М.
This is the Only Right Way to Write React clean-code - SOLID
18:23