C1: The School Techfest
-Design a web page with HTML
-Learn to use heading tags for titles, paragraph tags for content, and image tags for adding pictures
-Add headings, content, and images to your webpage using these tags

Class Outcome: Gain foundational skills in designing web pages, using HTML for structure, and CSS for styling.

C2: Style your Web Page
-Style the web page using inline styling and external style sheets.
-Explore various inline style commands, cascading style sheets, and div tags.
-Use these styling tools to make the web page visually appealing and attractive.

Class Outcome: Enhance web pages by styling with inline and external CSS, incorporating div tags, and understanding color representation with hexadecimal numbers.

C3: The School Website
-Revamp the school website using HTML and CSS for a more attractive look.
-Learn to enhance HTML elements with id and class selectors.
-Explore hexadecimal numbers to represent colors in CSS and use various CSS properties to align elements in the Home section of the school website.

Class Outcome: Transform the school website by mastering responsive design, embedding webpages, and applying custom fonts for an attractive and cohesive look.

C4: Website Navigation
-Create a navigation bar using HTML with unordered lists.
-Style the navigation bar using CSS to enhance its appearance.
-Add a delightful touch by using pseudo-selectors to style navigation items when the mouse hovers over them, improving the exploration experience on the school website.

Class Outcome: Learn to create a navigation bar with unordered lists in HTML, style it using CSS, and add delightful hover effects for improved user experience.

C5: Website Layout and Iframes
-Explore CSS flexbox for organizing and arranging HTML elements on the webpage.
-Learn to embed a webpage within another using the <iframe> tag.
-Apply styling to both the about section and the footer section of the school website for a cohesive and polished look.

Class Outcome: Explore CSS flexbox for layout, embed web pages with the <iframe> tag, and style the about and footer sections of the school website.

C6: Image Slider and Cards
-Master creating an image slideshow using CSS.
-Transform the layout of the events section into a card display.
-Add a visual highlight to the cards when the mouse hovers over them using a pseudo-class selector.

Class Outcome: Build image slideshows with CSS and transform the webpage layout to visually appealing card displays

C7:Debugging : It’s Pizzalicious
-Debug the pizza website by identifying and fixing errors in both HTML and CSS files.
-Learn to locate and resolve all issues for a smooth and error-free website.
-Apply problem-solving skills to ensure the proper functioning of the website's code.

Class Outcome: Become proficient in debugging by identifying and resolving errors.

C8: Responsive Web Design
-Acquire skills in building a responsive website.
-Use media queries to make the pizza website adapt to various screen sizes.
-Explore the addition of custom fonts to enhance the visual appeal of the website.

Class Outcome: Develop a responsive pizza website using media queries, and apply custom fonts to enhance the visual appeal.

C9: Multimedia Website
-Develop a multimedia website using the Bootstrap framework.
-Implement a collapsible navigation bar for easy webpage navigation.
-Ensure compatibility with various screen sizes by learning responsive design techniques.

Class Outcome: Create a multimedia website using Bootstrap, incorporating a collapsible navigation bar and making it compatible with different screen sizes.

C10: Website Carousel
-Master the creation of an image carousel showcasing various web page contents.
-Learn to include navigation buttons on the carousel for easy slide transitions.
-Enhance the multimedia website by incorporating dynamic image displays and interactive slide controls.

Class Outcome: Implement an image carousel on the multimedia website, adding buttons for slide transitions and creating an engaging user experience.

C11: Music Webpage
-Add cover images, songs, and their details to the music webpage.
-Utilize Bootstrap classes to style and enhance the appearance of the webpage.
-Incorporate music controls for a more interactive and enjoyable user experience.

Class Outcome: Add cover images, songs, and details to the music webpage, style it using Bootstrap, and integrate music controls for interactive playback.

C12: Movies Webpage
-Integrate movie cards onto the movie webpage.
-Apply Bootstrap for styling to enhance the visual presentation of the cards.
-Learn to incorporate a play button for seamless in-page movie playback.

Class Outcome: Integrate movie cards onto the webpage, style them with Bootstrap, and add a play button for in-page movie playback.

C13:Books Webpage
-Add a book to the MMBFlix website using predefined Bootstrap classes.
-Implement a modal to open the book in a pop-up window upon clicking.
-Enhance the book webpage by including a close button for user-friendly navigation within the modal window.

Class Outcome: Add a book to MMBFLIX using Bootstrap classes, open it in a modal window, and enhance the book webpage with a close button.

C14: Customer Feedback
-Develop a feedback form for the MBBFLIX website.
-Include fields to gather customer names, emails, and feedback.
-Create checkboxes and radio buttons for additional user input options in the form

Class Outcome: Develop a feedback form for MMBFLIX with fields for names, emails, and feedback, including checkboxes and radio buttons for additional input.

C15: Loader and Collapsible Elements
-Integrate new features into the MMBFLIX website, such as displaying a loading spinner during website loading.
-Learn to implement a button for toggling the visibility of movie descriptions.
-Include copyright information in the footer to enhance the website's completeness

Class Outcome: Enhance the MMBFLIX website by adding a loading spinner, a button for toggling movie descriptions, and copyright information in the footer.

C16: Chat Support
-Incorporate chat functionality into a webpage.
-Implement the ability to open and close a chat window with a button click.
-Learn to design dialogs for effective chat support on the webpage.

Class Outcome: Gain practical skills in implementing interactive chat features on webpages, including window toggling and dialog creation.

0 - 1 hours per week outside of class
Homework
Frequency: available upon request
Feedback: available upon request
Details: Students will receive home work as a DIY coding activity. They will follow the provided tutorial to finish the post class project. 
All projects will be finished individually. Homework will be recommended but not mandatory.

In addition to the Outschool classroom, this class uses:
https://www.tynker.com/