Josh Comeau Avatar

Josh Comeau

Josh Comeau joshwcomeau.com

The end of front-end development

Josh Comeau:

Over the past few months, I’ve spoken with lots of early-career devs who are getting more and more anxious about AI. They’ve seen the increasingly-impressive demos from tools like GPT-4, and they worry that by the time they’re fluent in HTML/CSS/JS, there won’t be any jobs left for them.

I couldn’t disagree more. I don’t think web developer jobs are going anywhere. And I’m getting pretty sick of the FUD? being spread online.

So, in this blog post, I’m going to share my hypothesis for what will happen. Things are going to change, but not in the scary way people are saying.

Josh Comeau joshwcomeau.com

Why React re-renders

Josh Comeau takes times to answer the question that many of us have asked ourselves, but never sought out an answer to: exactly how does React’s re-rendering process work?

There are a lot of misconceptions out there about this topic, and it can lead to a lot of uncertainty. If we don’t understand React’s render cycle, how can we understand how to use React.memo, or when we should wrap our functions in useCallback?

Josh Comeau joshwcomeau.com

The frontend developer's guide to the terminal

This guide by Josh Comeau is Josh doing what Josh does so well: taking complex/arcane/technical topics and making them approachable & fun for his audience.

It takes years of practice to become a terminal guru, but here’s the good news: we can take a shortcut. We don’t really need to know 98% of the stuff you can do with a terminal. If we focus on the most-important critical fundamentals, we should be able to become comfortable with the command line in a remarkably short amount of time. ✨

That’s what this blog post is all about.

Josh Comeau joshwcomeau.com

A modern CSS reset

Josh Comeau:

Recently, I’ve been using my own custom CSS reset. It includes all of the little tricks I’ve discovered to improve both the user experience and the CSS authoring experience.

Like other CSS resets, it’s unopinionated when it comes to design / cosmetics. You can use this reset for any project, no matter the aesthetic you’re going for.

In this tutorial, we’ll go on a tour of my custom CSS reset. We’ll dig into each rule, and you’ll learn what it does and why you might want to use it!

It has 9 rules and unlike previous resets, the goal is not to create a ‘blank slate’ that is uniform across browsers. Josh walks/talks you through each rule and why they made the cut.

Josh Comeau joshwcomeau.com

An interactive guide to CSS transitions

If you want to learn about CSS transitions, this explainer from Josh Comeau is a great start.

This tutorial is meant to be accessible to developers of all experience levels. It can be thought of as “CSS transitions 101”. That said, I’ve sprinkled in some interesting and obscure tidbits — no matter your experience level, I bet you’ll learn something!

An interactive guide to CSS transitions

Josh Comeau joshwcomeau.com

The styled-components happy path

This is Josh Comeau’s personal suite of “best practices.”

If you work with styled-components, or a similar tool like Emotion, my hope is that this article will help you get the most out of it. I’ve distilled years of experimentation and practice into a few practical tips and techniques. If you apply these ideas, I genuinely believe you’ll be a happier CSS developer ✨

Changelog Interviews Changelog Interviews #423

Coding without your hands

What do you do when you make a living typing on a keyboard, but you can no longer do that for more than a few minutes at a time? Switch careers?! Not Josh Comeau. He decided to learn from others who have come before him and develop his own solution for coding without his hands. Spoiler Alert: he uses weird noises and some fancy eye tracking tech.

On this episode Josh tells us all about the fascinating system he developed, how it changed his perspective on work & life, and where he’s going from here. Plus we mix in some CSS & JS chat along the way.

Josh Comeau joshwcomeau.com

A static future

Why is static the future? How do you define “static”? Read this deep dive from Josh Comeau to find out…

The term “static” can be a little overloaded, and occasionally a little misleading. Here’s how I’d define it:

“A static website is a website where the initial HTML is prepared ahead of time, not dynamically generated by a server on request.”

When you make a request to this website, for example, Netlify serves pre-generated HTML to you. I don’t have a Node server dynamically rendering HTML documents on-the-fly.

Josh Comeau Medium (via Scribe)

Lessons learned as a conference speaker

How do you develop an idea for a talk, determine the conferences to pitch, actually deliver the talk, and whether or not it’s even worth doing? Joshua Comeau writes on Medium:

I’m still very much at the beginning of my career. I’m only ~5 years into what will likely be a 40-year career, so I’m only about 1/8th through! That thought is simultaneously liberating and dizzying; it means I don’t have to feel rushed when it comes to making the most of every available opportunity, but it also means I have no clue what’s ahead.

Conference-speaking is a worthwhile endeavor, but it’s one heck of a bumpy ride, and not always worth it. I’ll continue to prepare talks — as long as folks still want to hear what I have to say…

Joshua ends with an invitation … 👏

I encourage you to give it a shot. Feel free to reach out to me, I’m always happy to give your proposal a quick read :)

Josh Comeau joshwcomeau.com

Dynamic Bézier curves

If you’ve been looking for a fun, interactive, deep-dive into Bézier curves, this blog post from Josh Comeau is for you. Also, this is Josh’s first post to his new blog, which is also open source on GitHub — so the following is a nice intro for what to expect.

The whole reason I started this blog was that I wanted a way to build dynamic, interactive articles that are more effective at sharing and teaching concepts. Unlike with plain text on Medium, this blog is a fully-powered React app, and so I can create and embed interactive elements that help the reader build an intuitive understanding of the subject being presented. These dynamic “flattenable” Bézier curves are a perfect subject for this format, as they have underlying complexity that would be difficult to explain with words alone.

And here’s what to expect from this post on Bézier curves.

In this maiden blog post, we’ll go through the basics of working with Bézier curves and SVG in React.js. We’ll learn how to build dynamic curves that respond to user input.

Player art
  0:00 / 0:00