Advanced Weather App using CSS & JavaScript

Published: 15 October 2022
on channel: CODE WITH HOSSEIN
17,556
like

Hey guys 😁 Are you looking for a Weather App Project using CSS & JavaScript, don't miss this advanced tutorial! Today, I'm gonna teach you how to use an API Key to receive data and show them in an amazing UI 😎 Hope you enjoy this video, don't forget to hit the subscribe button!

📂 Assets
Images: https://freepik.com/
Font: https://fonts.google.com/
Icons: https://fontawesome.com/

🔗 Source code
https://github.com/hosseinnabi-ir/Adv...

🔔 Subscribe Now!
   / @codewithhossein  

⏱ Timestamps
00:00 Weather App Preview
01:34 Search Box Elements
02:14 General Styles
02:37 Container Styles
03:11 Search Box Styles
05:19 Adding Weather Box
05:52 Weather Box Styles
07:18 Adding Weather Details
08:07 Weather Details Styles
09:38 Adding 404 Box
09:58 404 Box Styles
10:45 Handling Searches using JS
11:42 Getting API Key
12:52 Fetching Data from API
13:46 Handling Unexpected Searches
14:53 Fade-In Showing Effect
15:38 Handling Normal Searches
17:23 Showing Weather Data
22:36 Thanks For Watching :)


🎵 Music
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Track: Ikson - Anywhere [Official]
Music provided by Ikson®
Listen:    • #66 Anywhere (Official)  
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Track: BEAUZ & JVNA - Crazy [NCS Release]
Music provided by NoCopyrightSounds.
Watch:    • BEAUZ & JVNA - Crazy | Electronic Pop | NC...  
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Track: Jordan Schor & Harley Bird - Home
Music provided by NoCopyrightSounds.
Watch:    • Jordan Schor & Harley Bird - Home  | Futur...  
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Song: Levianth & Axol - Remember (feat. The Tech Thieves)
Music provided by NoCopyrightSounds
Free Download/Stream: http://ncs.io/remember
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Track: Lost Sky - Vision pt. II (feat. She Is Jules)
Watch:    • Lost Sky - Vision pt. II (feat. She Is Jul...  
Free Download / Stream: https://ncs.io/Vision2
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Track: Lost Sky - Where We Started (feat. Jex)
Music provided by NoCopyrightSounds.
Watch:    • Lost Sky - Where We Started (feat. Jex) | ...  
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Thanks for watching, I appreciate it 🙏
Made with 💗 by Hossein

#javascript #js #frontend #webdesign #coding


On this page of the site you can watch the video online Advanced Weather App using CSS & JavaScript with a duration of hours minute second in good quality, which was uploaded by the user CODE WITH HOSSEIN 15 October 2022, share the link with friends and acquaintances, this video has already been watched 17,556 times on youtube and it was liked by like viewers. Enjoy your viewing!