TAG IT! Netflix Cloning by Zaio: Part 2

California State University - Long Beach
Sat, Oct 10, 2020, 11:00 AM (PDT)

About this event

Founded in Cape Town, South Africa, Zaio is a platform that teaches people how to code for free and gives them paid-for, practical experience.

This 1st workshop from the series of 4 is all about learning the basics of HTML & CSS through building the Netflix landing page, such as the basic HTML attributes, classes, CSS selectors and much more.

By the end of the October TAG IT! Series, you will have a better understanding of HTML and CSS, and you will have 2 projects that you can add to your portfolio (Facebook clone and Netflix clone). 

Workshop 2: HTML & CSS Part 2 (Netflix landing page)

Diving deeper into HTML & CSS through building the Netflix landing page using display properties, media queries for mobile optimization and a couple of animations and transitions. Netflix clone added to your portfolio.

  • Display, Span, Images, block, inline, inline-block, none
  • Flexbox
  • CSS grid, Columns And Grids

  • CSS Units - 
What is the best measurement to use, px, em, %
  • Media queries
  • Web prefixes - 

  • Netflix demo covering - Background images, Overlaying, Changing button shapes, flexbox, position & picture alignment, html5 video component, Styling nested divs
  • How to come up with a div structure when looking at a page - recommendations
  • Transitions - will cover position here
  • Add transitions to Netflix landing page
  • Have the NetFlix landing page clone built and added to your portfolio!