How To Build A Weather App In JavaScript Without Needing A Server
Web Dev Simplified
@webdevsimplifiedAbout
Web Dev Simplified is all about teaching web development skills and techniques in an efficient and practical manner. If you are just getting started in web development Web Dev Simplified has all the tools you need to learn the newest and most popular technologies to convert you from a no stack to full stack developer. Web Dev Simplified also deep dives into advanced topics using the latest best practices for you seasoned web developers. I started Web Dev Simplified in order to share my passion for web development, and do what I truly love. Teach and inspire new web developers. I have been in love with full stack web development since 2015 when I did my first internship as a web developer. Ever since then I have pursued my passion, learning everything there is to know about web development. Over the years I have taught many colleagues and friends the joys of web development, and cannot wait to teach you. Thank you for watching!
Latest Posts
Video Description
Weather apps are one of the best projects to build as a beginner since they teach you tons of concepts around utilizing APIs and transforming complex data. They also generally have a ton of tricky CSS as well. In this video I will show you how to build a simple weather app that doesn’t even need a server to work. JavaScript Simplified Course: https://javascriptsimplified.com 📚 Materials/References: GitHub Code: https://github.com/WebDevSimplified/js-weather-app JavaScript Simplified Course: https://javascriptsimplified.com Why I Don’t Use Class Selectors In JavaScript Article: https://blog.webdevsimplified.com/2019-10/do-not-use-class-selectors-in-javascript 🌎 Find Me Here: My Blog: https://blog.webdevsimplified.com My Courses: https://courses.webdevsimplified.com Patreon: https://www.patreon.com/WebDevSimplified Twitter: https://twitter.com/DevSimplified Discord: https://discord.gg/7StTjnR GitHub: https://github.com/WebDevSimplified CodePen: https://codepen.io/WebDevSimplified ⏱️ Timestamps: 00:00 - Introduction 00:50 - Setup 02:35 - Header HTML 07:32 - Header CSS 12:37 - Day Section HTML 14:49 - Day Section CSS 16:40 - Hour Section HTML 19:29 - Hour Section CSS 20:56 - HTML Templates 23:09 - Connecting To The API 28:10 - Transforming API Data 39:10 - Rendering The Data 52:52 - Getting The User’s Location #WeatherApp #WDS #JavaScript
You May Also Like
Upgrade Your Everyday
AI-recommended products based on this video
Kasa Smart Outdoor Smart Plug by TP-Link (KP400) - Smart WiFi Outlet with 2 Sockets, IP64 Waterproof, Works with Alexa and Google Home, 2.4GHz WiFi Required, No Hub Required, Sunset & Sunrise Offset
Wireless Earbuds Bluetooth 5.4 Headphones, 50H Playtime Stereo Earphones with ENC Noise Cancelling, IPX7 Waterproof Open Ear Buds with Ergonomic Earhook for Fitness/Sports/Workouts Black
Wireless Earbuds, Bluetooth 5.4 Headphones HiFi Stereo with 6 HD Mics, 2025 Active Noise Cancelling Earbuds, 36H Playtime and LED Display in Ear Earphones, IP7 Waterproof Wireless Headphones, Black
Wireless Earbuds, Sports Bluetooth Headphones, 80Hrs Playtime Ear Buds with LED Power Display, Noise Canceling Headset, IPX7 Waterproof Earphones for Workout/Running(Black)
Monster Open Ear Headphones AC330, Wireless Earbuds Bluetooth 5.4 with Clear Talk, Stylish Rotating Case with Lanyard, Type-C Charging, Comfort Fit, 24H Playback, IPX5 Water Resistant, Black
Brita Stainless Steel Premium Filtering Water Bottle, BPA-Free, Reusable, Insulated, Replaces 300 Plastic Water Bottles, Filter Lasts 2 Months or 40 Gallons, Includes 1 Filter, Carbon - 20 oz.
Simple Modern Filtered Water Bottle | Insulated Stainless-Steel Carbon Filter Travel Water Bottles | Reusable for Clean Drinking Water On The Go | 24oz, Sea Glass Sage
FITVII Health & Fitness Tracker (Answer/Make Calls), Smart Watch with 24/7 Heart Rate and Blood Pressure, Sleep Tracking Monitor, 120+ Sport Mode Activity Tracker
AYATAHA AYATAHA Smart Watch for Kids, Smartwatch Fitness Tracker for Boys Girls, Children's Activity Watch 37 Sports Modes SMS Notification, HD Full Touchscreen IP67 Waterproof, Blue
Iaret Iaret Smart Watch for Women, 1.83" HD Fitness Tracker with 4 Bands, Answer/Make Calls, Heart Rate/Sleep/SpO2/Step Tracking, 100+ Sport Modes, Android/iPhone Compatible Gift (Rose Gold)
Smart Watch for Men Women 1.8" Fitness Tracker, Bluetooth Call, DIY Dial, Heart Rate Sleep Blood Oxygen Monitor, 100+ Sports Modes, IP68 Waterproof Smartwatch for Android iPhone, Alexa Built-in
Hand Warmers 2 Pack, 14000mAh Rechargeable Hand Warmers, Electric Hand Warmer Reusable, Portable Power Bank USB Hand Warmers 4 Levels 8 Heating, Gifts for Raynauds Ski Golf Camping
Hand Warmers Rechargeable, 10000mAh Electric Heated Gloves Power Bank Portable Graphene Handwarmers Pouch with 3 Levels & Double-Sided Heating for Hunting Camping Golf Xmas Gifts for Women Men Kids
2Pack Rechargeable Hand Warmer, 8000mAh Electric Hand Warmer Power Bank, Portable USB-C Hand Warmer for Pocket, Reusable Hand Warmer Up to 8 hrs Each, Warm Gift for Men Women, for Hunting, Camping
GTOCE Portable Charger,40000mAh Power Bank with 22.5W Fast Charging LED Digital Display Battery Pack with 6 Outputs 2 Inputs, Type C Powerbank Portable Charger for iPhone 16 pro Samsung AirPods,Black
Monster Sleep Ear100 Ear Buds, Sleep Earbuds with Stereo Sound, Design for Side Sleeper, 32H Playtime, Bluetooth 6.0, ENC Noise Cancelling, IPX6 Waterproof Mini Headphones, Black
Hydroponics Growing System Indoor Garden - Herb Garden with Grow Light, 15 Pods Stainless Steel Indoor Garden Kit, Auto Timer, Gardening Gift for All Ages
Umbra Triflora Hanging Planter for Window, Indoor Herb Garden, Set of 5, White/Black
Large Hydroponics Growing System 14 Pods, Indoor Herb Garden with LED Grow Light, 5L Water Tank, Hydroponic Grow Kit with 3 Auto-Timers, Rotatable Light Panel and Child Lock for Home School Gardening
Hanging Planter Hanging Plant Holder, 6 Inch 4 Indoor Plant Pots, Wall/Window Plant Hanger Indoor Herb Garden
slopehill Multi Hair Stylers & Hair Straightener - 2 in 1 Wet to Dry Air Straightener and Hair Dryer Combo with High Speed Air + Rapid Heat-Up + Customizable Temperature(Pink)
Hi.FANCY Portable Laptop Stand with Dual Cooling Fans for 14-17inch Laptops, Grey, 23.5 x 25.9 x 0.95cm
Laptop Stand for Desk, Adjustable Laptop Riser ABS+Silicone Foldable Portable Laptop Holder, Ventilated Cooling Notebook Stand for 10-15.6” Laptops,Tablet-Black
JETech 5 in 1 Case for Samsung Galaxy S25 Ultra 5G with 2-Pack Each Tempered Glass Screen Protector and Camera Lens Protector, Non-Yellowing Shockproof Bumper Phone Cover (Clear)
TAURI for iPhone 17 Pro Max Case 6.9" with 1-Pack Screen Protector, Camera Lens Full Protection, Military-Grade Protection, Shockproof Transparent Back Bumper Phone Cover - Clear Global Recycled Standard
TAURI for iPhone 17 Pro Case 6.3" with 1-Pack Screen Protector, Camera Lens Full Protection, Military-Grade Protection, Shockproof Transparent Back Bumper Phone Cover - Clear Global Recycled Standard
JOINPAYA 1Set Rechargeable Hand Warmer Hand Heater for Winter Heating Levels Compact
Shakven Rechargeable Hand Warmer | Cute Comfortable Portable Hand Warmers,Ergonomic Adjustable Energy-Efficient Small Heater for Travel, Outdoor, Winter
OCOOPA IP45 Waterproof Hand Warmer Rechargeable, Up to 15hrs Heat,10000mAh Durable Quick Charge Electric Hand Heater, PD Compatible, 3 Levels for Outdoors, Heavy Duty, H01-PD PRO
