Web Interactivity
Workshop — 2020-12-02
Location: K.02.04 — 9:30-13:00
You know how to make (simple) websites. But you've visited sites that are more like experiences: they're interactive, they use fancy animation, they have flashy animations. How do they do that? And how can you do that? Maybe you've been put off by JavaScript in the past, but we'll show that they're actually two ways to learn: through adapting examples, or by taking the "fundamental" route, going deep into programming. This course focuses on the former, getting the job done. You'll learn what JavaScript can do and how to take existing code and bend it to your will. After this course you'll know how to integrate any kind of existing code into your own website.
Part 1
Part 2
Goals
- You'll learn how to take an existing JavaScript library (e.g. a gallery plugin) and integrate it.
- You'll understand the very basics of programming: loops, variables, conditions.
- You'll have experience with processing lists and understand why they're useful.
- You will be able to react to events in the page (e.g. clicks, mouse movement) and change elements on the page.
- You'll have experience connecting to external services, e.g. a weather service.
Requirements
You'll probably want some experience with website design first. Just like the web design course, you'll need Visual Studio Code and either Chrome or Firefox.
Project
We'll take a simple existing, static website and make it interactive: we'll add a hamburger menu, scrolling web gallery, and animate elements on scroll.
Next Steps
If you want to go deeper with JavaScript we can recommend reading Eloquent JavaScript by Marijn Haverbeke.