The sessions described below are the result of years of experimentation in teaching their respective topics. I take great joy in leading workshops that are interactive and engaging, taking a journey with the audience rather than lecturing at them, limiting use of static slides in favor of carefully curated live-coding exercises and explorations that maximize comprehension in the always-too-limited time available.
Though my audiences typically have some prior background in programming, they span a large spectrum of experience in developing web applications and with software development in general. Interactive workshop formats provide the flexibility to dynamically tailor content to the needs of learners.
Series: Fundamentals of Web App Development
This series explores broad fundamental concepts of web application development. In these interactive sessions we discuss relevant topics along with their best practices for security, accessibility, and performance while leveraging modern development tools to speed up and improve our workflow at every step of the development cycle.
The descriptions below appear as for sessions presented in Fall 2018. Each session lasts approximately 2 hours, plus time for a brief intermission.
Session 1 – Web Architecture, Visual Styles, & Layout
This session introduces the web ecosystem from a browser’s (front-end) perspective. The first part introduces the web platform and related technologies, exploring the browser lifecycle and how different kinds of code are used together to build a complete web page.
We discuss a few common paradigms of client-server interaction for web applications and the protocols over which they communicate.
The latter part of this session focuses on understanding the fundamentals of CSS, the cascade, and how styles are applied to onscreen elements. We briefly introduce basic mechanics of page layout.
- JS basics: syntax, variables, and control statements
- Data types and type coercion
- Functions, scopes, and closures
- Using standard collection objects and methods to work with application data
- Miscellaneous JS “gotchas” and common sources of confusion and headaches
Session 3 – Modern Application Layout in CSS
This session explores various approaches to designing resilient content and interface layouts that adapt to screens of any size. We compare the use of flow, flexbox, and grid layout, and media query mechanisms in CSS and discover the strengths and suitability of each for particular layout tasks.
- AJAX and interacting with external APIs
- Object-oriented patterns in JS
- Prototypical inheritance
- "this" and execution contexts
- Splitting application source code into separate files, and how to get them all to the browser
- Using npm to manage third-party libraries
Session 5 – Progressive Web Apps & Modern Web APIs
In this session we take a high-level tour of recent advancements in web APIs and standards for browsers that enable developers to create rich web applications which have native-like features and can even work offline. We discuss technologies such as web workers, service workers, WebAssembly, push notifications, web payments, WebSockets, in-browser databases, and more.
Series: Source Code Management with git
Custom workshops on exploring the use of git, the distributed version control system indispensible to any person and team who touches code.
We begin by discussing motivations for using version control and learn how git works at a fundamental level in order to develop an accurate and pragmatic mental model of how we can use git to work with code projects.
After understanding how git works, we explore common workflows for tracking the history of code artefacts over time, first from the perspective of an individual and then from the perspective of a distributed team. We also troubleshoot how to fix common mistakes and otherwise recover from various missteps with git.
We also explore additional communication, issue tracking, and project management features provided by popular git hosting services such as GitHub and GitLab that integrate tightly with your codebase.