| Josh Comeau |  |
Hi there!
A few months ago, I left my job at Gatsby to start my own thing. I've been relatively quiet on the details, but I'm finally ready to share what I've been working on 😮
I'm building an online course called ✨ CSS for JavaScript Developers ✨. It's a comprehensive course aimed at React/Angular/Vue/Svelte developers that teaches you how to implement any design with confidence.
It also covers a bunch of neat modern CSS stuff. If you've enjoyed the little whimsical touches on my site, I think you'll get a lot out of it!
Critically, it's built using the same technology as my blog. This means I'll be able to embed dynamic, interactive widgets and live-editable code snippets. It's a wholly interactive course, with games and in-browser exercises.
You can learn more about the course here: css-for-js.dev/
I created a new email list to send updates about the course development. I'll share behind-the-scenes stuff, sneak previews of content, and possibly even some early-bird coupon codes. If you're interested, you can join that list in 1 click by following this link:
To give you a bit of a sense of what this newsletter will be like, here's an example update
While this course isn't meant for absolute beginners, I'm including a "fundamentals brush-up" section, to make sure all students have a shared, rock-solid foundation.
One of the things I wanted to cover was terminology: stuff like knowing the difference between the terms "property", "rule", and "declaration".
This is dry, dry stuff, so I wanted to build a minigame to make it a bit more fun.
Do you ever sit and draw boxes on your computer's desktop? There's something kinda fun about clicking and dragging and selecting a bunch of icons. I thought it would be fun to show the user a code snippet, and ask them to draw a box around the requested term.
The trouble is that I want there to be immediate feedback: it should tell you if you got it right or wrong. And box-drawing means I need to write an algorithm that can reliably report which characters happen to fall within the box.
Normally, this kind of UI challenge is right up my alley, but I'm dealing with a nerve injury, and I need to be very selective about how I spend my limited code-writing time. Thankfully, I had a wild realization: the browser can already do this!
You can't draw boxes, but you can select text!
Here's what the current MVP looks like. You're given a snippet and some terminology, and asked to select the appropriate text:
Using text selection as an input is an out-of-the-box idea, but it works super well!
Of course, not all users are able to select text in this way (I find it difficult right now, due to my injury!). It's important that my course is accessible to folks who use a keyboard or other adaptive device. So in the settings, you can enable a text box, to enter your answer via text:
I believe that this little interactive quiz is a great way to cover what would otherwise be some pretty boring stuff. The novelty of it will hopefully cause the material to stick better!
I have a bunch of other ideas around how to build interactive out-of-the-box games. I'm super excited to explore them!
If you're interested in receiving more updates like this, be sure to join the CSS for JavaScript Developers newsletter.
Early next week I'll be publishing a new blog post. You can check out an early draft here:
As front-end developers, it's our job to implement the mockups created by our product/design friends. The holy grail is “pixel-perfect”, but what does that actually mean? Is it achievable?
This article digs into these questions, and shares a few clever and subtle tricks to get us closer to pixel-perfection.
As always, please don't share these sneak peeks on social media =) The post will be published in the coming days, at which point I'd love if you shared it with friends!
One last little bit of news: I was recently a guest on the Syntax.fm podcast, with Wes and Scott!
It was a big privilege to get to chat with them. I've been a long-time Syntax listener, and it was surreal to be invited on!
The main topic of conversation was coding by voice, where I shared what it's like programming without a keyboard or mouse. We also touched on animation and whimsy, online education, and a bunch of other fun stuff.
The episode comes out November 4th.
I'll also be on The Changelog podcast, though that episode hasn't been recorded yet.
Hope you had a great Halloween 🎃 All the best!
-Josh