Real-time Weather App Using Vanilla JavaScript and API
In this video, I'll show you how to build a real-time weather app using vanilla JavaScript and the API. This weather app will be responsive and will use the latest weather data from the API.
If you're looking to build a weather app that is both responsive and powered by the latest weather data, then this video is for you! By the end of this video, you'll have built a responsive weather app that uses the API!
🔗 Essential links
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Postman workspace: https://www.postman.com/codewithsadee...
Download the starter file to practice (github): https://github.com/codewithsadee/weat...
Source code: https://www.patreon.com/posts/weather...
Figma UI: https://www.patreon.com/posts/weather...
HI 👋
I'm Sadee(web dev)
In this channel, I make videos about the Complete Responsive website.
You can check out my channel 👇
📺 My Channel: / @codewithsadee
🔔 Subscribe: / @codewithsadee
⏱️ Timestamps
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
0:00 - Demo
8:09 - Starter file
9:27 - Html Css: Project initial (css variables and reset)
17:45 - Css: Material Symbol for Icon
20:17 - Html Css: Header
41:38 - Html Css: Current Weather
52:25 - Html Css: 5 Day Forecast
57:17 - Html Css: Today's Highlights
1:09:32 - Html Css: Hourly Forecast
1:15:56 - Html Css: Footer
1:19:36 - Html Css: Loading
1:21:37 - Html Css: Error 404
1:24:06 - Css: Media queries
1:42:30 - OpenWeather: Signup and API key
1:44:36 - Javascript: All fetch url configuration
1:52:06 - Javascript: All module configuration
2:02:14 - Javascript: Route configuration
2:09:30 - Javascript: Search toggle for mobile device
2:13:03 - Javascript: Search API integration
2:23:16 - Javascript: Current weather API integration
2:41:17 - Javascript: Air pollution API integration with Today's highlight section
2:50:36 - Javascript: Forecast API integration with Hourly and 5 Day forecast section
3:07:07 - Javascript: Error 404
👍 Like - Follow & Support
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Twitter: / codewithsadee
Github: https://github.com/codewithsadee
Facebook: / codewithsadeefan
Instagram: / codewithsadee
🎶 Music
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Bcalm x Banks - Anemone
Provided by Lofi Records
Watch: • Bcalm x Banks - Anemone
Download/Stream: https://fanlink.to/FeelingsPt2
Bcalm x Banks - Hiraeth
Provided by Lofi Records
Watch: • Bcalm x Banks - Hiraeth
Download/Stream: https://fanlink.to/FeelingsPt2
Bcalm x Banks - Bluebird
Provided by Lofi Records
Watch: • Bcalm x Banks - Bluebird
Download/Stream: https://fanlink.to/FeelingsPt2
Bcalm x Banks - Just Breathe
Provided by Lofi Records
Watch: • Bcalm x Banks - Just Breathe
Download/Stream: https://fanlink.to/FeelingsPt2
Bcalm x Banks - Gentle Hills
Provided by Lofi Records
Watch: • Bcalm x Banks - Gentle Hills
Download/Stream: https://fanlink.to/FeelingsPt2
Bcalm x Banks x Purrple Cat - I'll Be There
Provided by Lofi Records
Watch: • Bcalm x Banks x Purrple Cat - I'll Be...
Download/Stream: https://fanlink.to/FeelingsPt2
Bcalm x Banks x cxlt - Yours
Provided by Lofi Records
Watch: • Bcalm x Banks x cxlt - Yours
Download/Stream: https://fanlink.to/FeelingsPt2
Bcalm x Banks - Back Then
Provided by Lofi Records
Watch: • Bcalm x Banks - Back Then
Download/Stream: https://fanlink.to/FeelingsPt2
⚠️ Disclaimer
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
Disclaimer video is for educational purposes only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for "fair use" for purposes such as criticism, comment, news reporting, teaching, scholarship, and research. Fair use is permitted by copyright statute that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favour of fair use
#codewithsadee
#vanillajsapp
#webapp
#weatherapp
Смотрите видео Real-time Weather App Using Vanilla JavaScript and API онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь codewithsadee 02 Март 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 109,574 раз и оно понравилось 2.5 тысяч людям.