Build a Weather App with HTML, CSS & JavaScript

Use HTML, CSS, and JavaScript to create a fully functional weather app using an API.

❤ Subscribe:

In this tutorial, I will show you how to access the OpenWeatherMap API in JavaScript to create a website that displays the current weather for any location.

I will show you how to use flexbox to create a responsive, centered card, how to access APIs using JavaScript’s ‘fetch()’, and how to dynamically modify content on the page and background images.

Follow me on Twitter for JavaScript tips and quizzes!
▶

👨‍💻 My code
▶

What topics should I cover next?

Let me know in the comments what you want to see next in my tutorials!

📺 In this video:
0:00 – Intro
0:25 – Creating the HTML markup
4:20 – Creating CSS styles
16:00 – Getting started with the API
19:30 – Fetch Weather
22:24 – Displaying results
29:56 – Search button listener
32:00 – Enter key press listener
32:50 – Hide results while loading
35:55 – Background images from search
36:55 – Conclusion

🖥 More Web Development tutorials
▶

💻 More tutorials
▶

🙋‍♂️ Find me on other channels
Discord 🗨️
Twitter ✍
Github 👨‍💻
Sponsor 💞
One-time donation ☕

💖 SPONSORS 💖
Get your username or a link to your channel here by sponsoring on Github
▶

🎁 GET FREE STUFF WHILE SUPPORTING MY TUTORIALS
►

source