Advanced Weather App using CSS & JavaScript

Veröffentlicht am: 15 Oktober 2022
auf dem Kanal: 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


Auf dieser Seite können Sie das Online-Video Advanced Weather App using CSS & JavaScript mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer CODE WITH HOSSEIN 15 Oktober 2022 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 17,556 Mal angesehen und es wurde von like den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!