Thumbnail for #189: Notion for Personal & Public Use

#189 Notion for Personal & Public Use

Running Time: 21:54

This is the last video in our little series on using Notion. We’ve covered how Notion is great for working on web development teams. But another thing that makes Notion great is that it’s useful for yourself too. …

Watch the Screencast
Thumbnail for #184: Inside & Aligned Lists

#184 Inside & Aligned Lists

Running Time: 18:30

The fact that lists render their markers outside their own box (by default) is slightly weird. Any hidden overflow or overhanging off the edge of the browser will hide them. Moving them inside the box feels better and safer, but …

Watch the Screencast
Thumbnail for #181: Poking at HTML Lists

#181 Poking at HTML Lists

Running Time: 16:42

I had a dumb little issue the other day where a nested list didn’t quite have the right spacing. I was only adding margin-bottom on the list elements and the lists themselves, but that meant there was no space between …

Watch the Screencast
Thumbnail for #180: Tinkering with Video on Mobile

#180 Tinkering with Video on Mobile

Running Time: 15:24

Fair warning: I’m no expert on this stuff, I’m just playing around with video on the web and addressing some issues I have when showing off video clips in blog posts.

I have an iOS simulator up in this video, …

Watch the Screencast
Thumbnail for #179: A Grid of Squares

#179 A Grid of Squares

Running Time: 16:34

Using CSS grid to make a grid, is, well, the whole point. But what if you want all those grid items to maintain an aspect ratio, like a 1:1 square? It’s possible, but it involves a little trickery. In this …

Watch the Screencast
Thumbnail for #174: Using Local Overrides in DevTools

#174 Using Local Overrides in DevTools

Running Time: 11:00

There is a feature of Chrome DevTools that lets you:

  1. See the code of any given resource the current web page is using (like CSS and JavaScript).
  2. “Pretty Print” it (format it for readability)
  3. Save it to disk
  4. Use that
Watch the Screencast
Thumbnail for #172: Hand SVGing a Curved Line

#172 Hand SVGing a Curved Line

Running Time: 17:17

I find that 98% of all my SVG usage comes from pre-created SVG files or vector art in some design software that I ultimately export as SVG. Not super often am I hand-manipulating the coordinates of things in the SVG …

Watch the Screencast

Free Video Courses

Video Course (2015)

Everything You Need To Know About SVG

Using SVG can be very simple, but if you start digging in, there is a lot to know about SVG. In his series you're going to learn why SVG is such an important part of building websites. From why SVG is useful and how to get your hands on it all the way to implementing it as a system and fancy stuff like animating it.

Go to Course →