Front End Web Development

High School – Wizard Level I – Class 2

About Front End Web Development

HTML, CSS, and JavaScript are the building blocks of web development. They create the parts of a website that users directly interact with on a daily basis. Students will learn to build websites from scratch by creating interesting web apps and games. After that, they have the ability web pages for users to digest complex information or just enjoy and have fun with. Students will visually express information and ideas on the web and share it with the rest of the world.

Learning Objectives

When students complete Front End Web Development, they will be able to:

  • Understand the basic structure of an HTML web page
  • Style web pages with CSS selectors and properties
  • Use JavaScript and to interact and manipulate the DOM
Front End Web Development Class SessionsExpand All Sessions
  • 1. Introduction to HTML
    The basics of web development.

    In this lesson, students learn the fundamentals of a web page and browser. They start with the basic structure of an HTML page and learn about tags such as the heading, paragraph, and image tag.

  • 2. Introduction to CSS
    Add styles to your HTML.

    In this lesson, students are introduced to CSS and how it interacts with HTML pages. They will learn to visually organize their  web pages. They will also learn about font formatting and adding Google fonts to projects.

  • 3. Attributes & Selector
    Select and style HTML elements.

    In this lesson, students learn how to use class and id attributes to select and style HTML elements. They also add their first anchor tags to projects to create links. With selectors, they learn to access and update HTML elements. 

  • 4. Intro to JS
    Select and style HTML elements.

    In this lesson, students are introduced to JavaScript. They will learn how to add scripts to HTML code and link JavaScript code to an HTML button. As an example, they’ll create a basic version of an Alexa like talk bot.

  • 5. Getting User Input
    Get user data with a form.

    In this lesson, students learn about input fields and asking users for data. They’ll write JavaScript to get HTML elements and perform arithmetic operations based on a user’s response creating a simple calculator app.

  • 6. DOM Manipulation
    Working within the Document Object Model.

    In this lesson, students learn about HTML containers and how the DOM is structured. They are introduced to the jQuery library. We’ll also show them how to use time functions in JavaScript.

  • 7. Input Validations
    Validate data from forms.

    In this lesson, students learn about input validation in forms. They are introduced to the form tag and how it helps with validation. They also learn several new jQuery functions to use with forms.

  • 8. Colors
    The world of web-safe colors.

    In this session, students learn new ways to add colors on a webpage. They will add new styles to their project and learn about CSS properties to align HTML containers and add borders.

  • 9. Audio and Positioning
    Add sound effects to projects.

    In this session, students get to add audio files to their web pages. They’ll learn how to insert media elements located in different folders. We also introduce to the position property in CSS.

  • 10. Video and Keyboard Events
    Interactivity with on page events.

    In this session, students learn how to embed videos in their web pages. They’ll create a YouTube-like video player with keyboard events and by adding interactivity through events.

  • 11. Final Project – Part I
    Start a typing challenge game.

    In this session, students start the final project of the course, a typing challenge game. They will show random words that must be typed in by the user in a set amount of time. At the end, the game will calculate your typing speed in words per minute. The completed game is a true showcase of the solid foundation programming concepts and skills students have gained.

  • 12. Final Project – Part II
    Complete a typing challenge game.

    In this session, students complete the final project of the course, a typing challenge game. They will combine the skills learned throughout the class to display random words and set a timer. At the end, the game will calculate your typing speed in words per minute. The completed game is a true showcase of the solid foundation programming concepts and skills students have gained.

Capstone I
Multiplayer Virtual Reality Game Class

What if we could go inside a game to play it? Yes, the future is here, you can put a headset over your eyes and get teleported to a virtual world. In this class, students practice their skills in web development by creating an online multiplayer Virtual Reality game.

Class Schedule

All students start in Intro to Python at Wizard Level I. If you have previous coding experience, take the Advanced Placement test. Returning students can continue with the class where they left off.

  • Intro to Python
    on Tuesdays (12 weeks, 1 class per week)

See our school calendar to check the holiday meeting schedule.

Once a course begins, every student at any level enjoys the same benefits:

Twelve 1-hour classes
Code editor software subscription
Live 1-on-1 teacher help, including weekends
Online student community
24/7 Access to our coding platform
Web hosting & unlimited server space
Same day email support
Monitored, direct-messaging

Course Duration & Time Commitment
All courses are 12 weeks long. A Wizard will receive a certification for their achievement at the end of the course.

Expect a weekly time commitment of 2-3 hours. 1 hour of class time, plus 1-2 hours of practice time, with instructors support throughout, including weekends.

100% Guarantee

Our goal is to make all our students successful. If your child is not happy with our program, please notify us within the first four class sessions and you will receive a full refund.

Get Your Wizard Started

Pin It on Pinterest

[[
255
255
255);">Click Here 255);">Click Here
255
255
255);">]
255);">]