Web Frontend Foundations 1

Welcome to our exciting web development class for middle schoolers! In this class, we will introduce you to the fundamental building blocks of web frontends, starting with HTML, CSS, and JavaScript. You will learn how to create a basic web page using HTML and apply styles and layouts using CSS. We will also cover JavaScript, which will allow you to create interactive and dynamic elements on your web pages. Along the way, we’ll explore general web topics such as security, responsive design, and user experience. You will have the opportunity to apply what you learn in a hands-on project, where you’ll design and build your own website from scratch. Get ready to roll-up your sleeves and become a web developer!

Middle School

Difficulty

Beginner

Technologies

Web, HTML, CSS, JS, VS Code

Format

In-Person

Duration

12 hours

Structure

8 Weekly lessons, 1.5 hours each

$300
_{Enroll Now}

SYllabus

COURSE STRUCTURE

Welcome to the first lesson of our web frontend development course! In this lesson, we will start with the basics of the internet and its role in our daily lives. Next, we will dive into the core elements that make up a web page, and you will create your very first simple web page using HTML. Finally, we will introduce you to browser developer tools, which are essential for any web developer.

Get ready to take the next step in your web development journey! In this lesson, we’ll cover the basics of setting up a web development environment, including installing and configuring necessary tools and software. Then, we’ll dive into the fundamentals of HTML and CSS, covering the basic web page elements you’ll need to create your own pages. We’ll also explore multi-page web apps and learn how to build a basic multi-page web app from scratch.

In this lesson, we will build on our previous understanding of HTML and CSS to further enhance our web development skills. We will begin by revisiting HTML, learning new tags and elements that allow for more complex and dynamic content on our web pages. We will then move on to CSS, exploring more advanced selectors and properties that enable us to create more intricate and visually appealing designs. We will also cover basic page layout concepts and apply them to create more complex layouts for our web pages. Additionally, we’ll explore web domains and URLs, and dive into the process of publishing our web application.

In this lesson, we will explore the use of multimedia in web pages, starting with computer image formats, their advantages and disadvantages. You will learn how to add images, audio, and videos to your web pages using HTML and CSS. We will cover the best practices for optimizing multimedia content for the web to ensure fast page load times and a smooth user experience. Additionally, we will introduce you to image editing tools, which will allow you to create and modify your visuals.

This lesson introduces the Document Object Model (DOM) and how it represents the structure of a web page. We will also be introduced to JavaScript, a programming language that can be used to manipulate the DOM and add interactivity, and to forms, which add a crucial data collection element of many web pages. The lesson will include significant hands-on work to enhance a page with JavaScript and an actual submission form.

This lesson highlights the importance of cloud computing and how it enables businesses to scale and be more efficient. We will introduce responsive design and how it allows websites to adapt to different devices and screen sizes. Students will also go deeper into more advanced HTML, CSS and JavaScript, and will run through a hands-on exercise. Finally, students are introduced to the concept of a hackathon and start planning for the course’s final hackathon-based project.

In this lesson, we conclude the theoretical part of the course with a deeper dive into advanced JavaScript concepts and techniques. After recapping on the course materials and a final Q&A, we will continue developing our collaboration soft skills by dedicating the majority of the lesson to teamwork time and a project progress checkpoint, allowing the hackathon teams to plan, design and code their final project, and to prepare for their final presentation. The teams are encouraged to leverage the trainer for feedback and advice.

The last lesson of this course will provide the students with a concluding trainer-guided slot to wrap up and perfect their team projects, leading to the final section where each team will be presenting and demonstrating its completed project to the entire class, with parents attending. These final presentations will highlight the collaborative work of the students, will provide an excellent opportunity to obtain friendly feedback, and will allow them to celebrate their hard work and showcase the skills they gained throughout the course.

FAQs Enrollment Policy Contact Us