$35
weeklyor $70 for 6 classes
Build Your Own Weather App With Vue.Js: Learn Web Development Step by Step!
New class
Ages 13-18
Live Group Course
Live video meetings
3x per week, 2 weeks
6-18 learners per class
60 min
What's included
6 live meetings
6 in-class hoursAssignments
1 hour per week. Learners will be asked to complete further work on their application between sessions, but this is optional.Certificate of Completion
1 after class completionClass Experience
US Grade 8 - 11
Intermediate Level
Get ready to create your own weather app in this exciting hands-on coding class! Using Vue 2, you'll learn how to build a functional web application that shows current weather and a forecast for any city in the United States. This course is perfect for young developers who want to explore real-world coding concepts while creating something cool and useful. I’ll start with the basics of Vue.js, a beginner-friendly JavaScript framework, and guide you step-by-step as you design the app layout, fetch real-time data from the National Weather Service API, and make your app interactive. Along the way, you'll learn skills like working with APIs, handling user input, and deploying your app so you can share it with family and friends. By the end of this course, you’ll have your very own weather app, a solid understanding of Vue 2, and the confidence to tackle more coding projects. Key Skills You’ll Learn: - Building dynamic web applications with Vue 2 - Fetching and displaying real-time data from the National Weather Service API - Designing responsive and user-friendly interfaces - Deploying your app online Who Should Join? This class is perfect for beginners with basic knowledge of HTML, CSS, and JavaScript who want to dive deeper into web development by creating a practical project. If you’ve ever wondered how apps work or dreamed of building your own, this is the class for you! What You’ll Need: - A computer with a stable internet connection - A GitHub account - No account needed! We'll use the free National Weather Service API - Basic familiarity with HTML and JavaScript (we’ll help fill in the gaps!)
Learning Goals
Achieve a basic familiarity with the Vue.js framework
Solidify understanding of JSON
Syllabus
6 Lessons
over 2 WeeksLesson 1:
Introduction to Vue 2 and Setting Up the Project
Topics Covered:
Overview of Vue.js and its purpose.
Installing Vue CLI or setting up a basic Vue 2 project with CDN.
Explanation of Vue components and data binding.
Creating the project folder structure.
Hands-On Activities:
Set up a basic Vue project.
Create a simple "Hello, Weather App!" component.
60 mins online live lesson
Lesson 2:
Building the Basic App Structure
Topics Covered:
Vue templates and rendering lists.
Understanding Vue directives (v-bind, v-if, v-for).
Adding basic CSS styling for the app layout.
Hands-On Activities:
Create the app’s main layout (header, input field, results area).
Add a dynamic title or message using Vue’s reactivity.
60 mins online live lesson
Lesson 3:
Fetching Weather Data from an API
Topics Covered:
What are APIs, and how do they work?
Introduction to the NWS API
Using JavaScript's fetch() method within Vue.
Hands-On Activities:
Fetch weather data for a hardcoded city and display it in the app.
Discuss basic error handling.
60 mins online live lesson
Lesson 4:
Making the App Interactive
Topics Covered:
Vue 2 event handling (v-on and methods).
Binding input fields with v-model.
Passing user input (like a city name) to the API call.
Hands-On Activities:
Add an input field where users can type a city name.
Fetch and display weather data based on user input.
60 mins online live lesson
Other Details
Pre-Requisites
Students should be familiar with HTML, CSS, and JavaScript before attempting this class.
Language of Instruction
English (Level: B1)
External Resources
Learners will not need to use any apps or websites beyond the standard Outschool tools.
Tony P suggests this class next...
Web Application Development - Did Someone Order a Pizza? Learn Vue.Js!
Tony P
5.0
(2)
$18 per class
Group Class
5 wks, 2/wk, 45 min
15-18
Parents also liked
Beginner Coding Class With Minecraft: Level 1 - The Basics of Programming
Playful Digital Learning
4.9
(587)
$36 per class
Next session at 8 PM on Monday
Group Class
1 wk, 5/wk, 1.50 hr
8-13
Python Coding for Beginners: Fun Projects to Learn Python & Real Coding Skills
PopSkool: English, Music, Art, Math, Coding & More
5.0
(1)
$15 per class
Next session starting now
Group Class
8 wks, 1/wk, 55 min
10-14
Beginner Coding Camp With Minecraft: Level 3 - The Basics of Programming
Playful Digital Learning
4.9
(587)
$36 per class
Next session at 2 PM on Mon 6/2
Group Class
1 wk, 5/wk, 1.50 hr
8-13
Python Programming for Beginners: One-on-One Coding on Minecraft
BrainBytes
4.9
(241)
$70 per session
1-on-1 Lessons
On Demand
7-17
Programming on Minecraft: One-on-One Coding Sessions
BrainBytes
4.9
(241)
$65 per session
1-on-1 Lessons
On Demand
6-15
Computer Programming, Coding, Python, Javascript, C#, C++ One on One Tutoring
Dragon Academy by Trammell Classes, DnD,Coding,RPG
4.8
(729)
$36 per class
Next session at 4 PM tomorrow
Group Class
1/wk, 25 min
7-12
All About Python Programming Level 4 | Python Coding Class for Intermediates
David Sofield
4.9
(830)
$33 per class
Group Class
10 wks, 1/wk, 1 hr
12-17
Coding With Boomer:Experienced
Brenda Ban
4.9
(483)
$18 per class
Next session at 6:45 PM on Tue 6/17
Group Class
2 wks, 2/wk, 45 min
5-10
All About Python Programming | Python Coding Summer Camp for Beginners Level I
David Sofield
4.9
(830)
$22 per class
Next session at 4:15 PM on Mon 6/16
Group Class
2 wks, 4/wk, 1 hr
11-16
Scratch Programming: One-On-One Coding Sessions
BrainBytes
4.9
(241)
$65 per session
1-on-1 Lessons
On Demand
6-13
Java Coding: Learn Programming With Fun Projects - Level 1
Einsteins Square: Chess, Coding, Math, Art, Games
4.8
(5,847)
$21 per class
Next session at 8 PM tomorrow
Group Class
12 wks, 1/wk, 50 min
12-17
Arduino Coding Camp
Elene Feigenbaum
4.9
(146)
$18 per class
Next session at 5 PM on Mon 6/16
Group Class
2 wks, 5/wk, 55 min
12-17
Scratch Video Game Coding: Fun Programming
Michelle Lewis Scratch Coding STEM Educator
5.0
(19)
$48 per session
1-on-1 Lessons
On Demand
7-17
Scratch Coding Club for Intermediate Programmers
Ms. Sara (STEM Apprentice Academy)
5.0
(583)
$24 per class
Next session at 11 PM on Tue 9/2
Group Class
1/wk, 45 min
8-10
All About Python Programming Level 1 | Python Coding Class for Teenagers
David Sofield
4.9
(830)
$22 per class
Next session at 12:15 AM on Friday
Group Class
8 wks, 1/wk, 1 hr
11-16
Python Coding Summer Camp Level 1
Codingal - #1 AI & Coding | Backed by Y Combinator
5.0
(5)
$18 per class
Next session at 1 PM on Monday
Group Class
1 wk, 5/wk, 50 min
8-13
More to explore
Fun With Chinese 1b
Multiplication Ninja
Money Pirate-themed Virtual Escape Room
Kathy
The Wonderful World
Colonial Mischief
The History Of Witches
Coding Games And Animations Python
Giant Panda
Jarrett Mcdowell
Beginner Scratch
Lets Talk
Mistake
Invest Advanced
Cross Stitch
Tutoring for Cursive
Cooking And Baking for Young Chefs
Mine Craft
Big Brother
You Tube Influencer