Up

Web Programming Workshop

Agenda

1

Critique
Project 2 (look you made another website!)

2

Workshop pt. 1
Making things change through CSS with media queries

3

Workshop pt. 2
Making things change through JavaScript

4

Tutorial
What is Webflow and why does it cost money?

5

Homework
Start Final Project (due in 2 weeks!)

6

Vote
Do we want a fourth class meeting?

Demos

Student Websites

Review from Week 2

All Flexbox Properties All Grid Properties

Making Things Change Pt. 1: Media Queries

Media Queries Media Query Examples Typical Device Breakpoints

Making Things Changes Pt. 2: JavaScript

<script> console.log() let ___ = ___ Data Types .querySelector() .classList .style.___ .innerHTML = "___" onclick="___" function() .addEventListener setInterval(function(){___}, ___) All Style Properties Common HTML Events Dark Mode Toggle Swapping Text

Webflow!

Make a Webflow Account Webflow University Webflow Showcase