CodePen

431: Versions are Deeply Integrated into CodePen

Chris Coyier |
Rachel and Chris on the podcast this week discussion the (ahem, rather large news) that every CodePen 2.0 Pen is versioned. That’s right, you can jump back in time to previous versions at any time in case mistakes were made. You can take a look at the preview and code of past versions in case […]... read more

Chris’ Corner: Layers of Layers

Chris Coyier |
There’s this thing that you need to know about when dealing with z-index and trying to get some elements to be on top of other elements: stacking contexts. If you’ve got an element within a stacking context that is itself lower than another element that you’re trying to get on top of, well, you’re h... read more

430: The Wild World of Keyboard Shortcuts in Web Apps

Chris Coyier |
Shaw and Chris talk about how the keyboard shortcut situation is challenging, but in the best shape it’s ever been in for our 2.0 editor. Between the operating system, browser, CodeMirror, and Emmet, the space is fairly crowded, but we’ve got enough room to offer lots of useful stuff. The commands a... read more

Chris’ Corner: Makin’ Stuff

Chris Coyier |
The most fun websites to build are websites that interact with outside sources. A user is an outside source! I’m obviously a bit partial to a website that asks a user to build stuff. That’s fun. But any outside source can be fun. Accepting uploads and doing something weird or useful with the data. O... read more

429: Why CodePen Rebuilt Its Realtime Service

Chris Coyier |
We’ve had realtime features on CodePen for ages. Back when it was pretty damn hard. Our Collab Mode is an obvious one, where users can code together. (This “just works” in the 2.0 editor, it’s not called anything special.) That and Professor Mode used to have realtime chat (until we pulled it becaus... read more

Chris’ Corner: The Edge, Man

Chris Coyier |
Ryan Mulligan’s article Transition to the Other Wide with Container Query Units is some solid CSS catnip for me. Just this base thought is fun to think about: how do you move an element from flush-left to flush-right when the size of the container and element are both unknown (which is typical). It’... read more

428: Improving The Entire Billing System (is Very Worth It)

Chris Coyier |
Rachel and Chris on the show this week to discuss a series of big changes over the last, say, six months or so with our billing system. We’ve essentially re-written this thing several times, and obviously this is the best time. Having three plans, two payment providers, teams, and fifteen years of h... read more

Chris’ Corner: Design

Chris Coyier |
I’ve been doing computers for a good minute, but the Scroll Lock key still predates me. There may have been a day when I could have explained what it does, but that knowledge had evaporated until I read Marcin Wichary’s Lock Scroll With a Vengeance. It’s fascinating that the technology that deprecat... read more

Chris’ Corner: A11Y

Chris Coyier |
I’ve got a couple of accessibility related articles I thought I’d share this week. I’ve specifically picked them out as examples of well-done accessibility writing. For each, I’ve plucked out a bit I found particularly interesting. But you, you should read the whole thing.... read more

427: Next.js and The Journey of SSR

Chris Coyier |
Having that first response from the server to users browsers be, ya know, full of good, useful, renderable HTML is certainly better than an empty <div id="app">. You can feel it and see it in the filmstrip view of the site loading. Not to mention you need it for at least things like <meta&g... read more