I’ve started a new coding blog in December: Overreacted.

overreacted.io

People often ask why I moved off Medium. Doesn’t it have a better distribution than a personal blog? I’ll answer this question here. My reasons are simple:

  1. Some of my Medium articles unexpectedly got behind a paywall*. I’m not sure what happened and whether that’s still the case. But I didn’t do it myself, and that caused a blow to my confidence in Medium as a platform. I respect their need to monetize, but it felt wrong when done retroactively. (* Folks from Medium reached out, and it appears that I…

(This article is also available on the DEV community without the paywall.)

This week, Sophie Alpert and I presented the “Hooks” proposal at React Conf, followed by a deep dive from Ryan Florence:

I strongly recommend to watch this opening keynote to see the problems we’re trying to solve with the Hooks proposal. However, even an hour is a big time investment, so I decided to share a few thoughts on Hooks below.

Note: Hooks are an experimental proposal to React. You don’t need to learn about them right now. …


People often choose Redux before they need it. “What if our app doesn’t scale without it?” Later, developers frown at the indirection Redux introduced to their code. “Why do I have to touch three files to get a simple feature working?” Why indeed!

People blame Redux, React, functional programming, immutability, and many other things for their woes, and I understand them. It is natural to compare Redux to an approach that doesn’t require “boilerplate” code to update the state, and to conclude that Redux is just complicated. In a way it is, and by design so.

Redux offers a tradeoff…


I receive programming questions on Twitter, GitHub, email, and other channels. I try to answer them when I can. Lately I haven’t been able to do that very well because I’m a human and don’t scale.

For personal questions, I maintain an AMA. If you want to know my favorite Pokémon, ask a question or read the answers!

If you have a programming question, read on.

“Hello, World” Questions

If you can’t get React to render a “hello, world” example or if your Redux counter doesn’t update when you press “+” and you’re stuck, you can message me directly on Twitter with that…


or, an Ode to Accidental Complexity

Note: React Hot Loader 3, released a month after I published this article, solves most of the problems described in this post. Give it a try!

React Transform is an experimental project I started after giving the Hot Reloading with Time Travel talk at React Europe.

My goal was to bring a live editing environment that preserves component state and handles errors gracefully to as many React users as possible.

OK, this demo is not very interesting. You’ll have to trust me that it works on real projects too 😎

By all reasonable metrics, React Transform has been a success. If anything, it proved the demand for a better development experience.

I would even say it has been way too…


Many people get confused by the difference between components, their instances, and elements in React. Why are there three different terms to refer to something that is painted on screen?

If you’re new to React, you probably only worked with component classes and instances before. For example, you may declare a Button component by creating a class. When the program is running, you may have several instances of this component on screen, each with its own properties and local state. This is the traditional object oriented UI programming. Why introduce elements?

In this traditional UI model, it is up to…


There is a growing sentiment in the JavaScript community that ES6 classes are not awesome:

  • Classes obscure the prototypal inheritance at the core of JS.
  • Classes encourage inheritance but you should prefer composition.
  • Classes tend to lock you into the first bad design you came up with.

I think it’s great that the JavaScript community is paying attention to the problems caused by the use of classes and inheritance, but I’m worried that the beginners are confused as classes are both “bad” and were just added to the language. Even more confusingly, some libraries, notably React, use ES6 classes all…


Today I gave a talk on React Hot Loader, Redux, and the powerful developer tools that Redux makes possible. If you haven’t seen my talk yet, wait for the video — I’m sure it’ll be up soon!

In an earlier version of the slides, I had an “Inspiration” slide. I cut it, like I cut many other slides, to fit into the 30 minutes cap. If you were inspired by my talk, you probably already saw these three talks.

But if for some reason you missed either of them, I envy you.
They are the best.


There has been no shortage of great Flux implementations, such as Flummox, Alt, or Fluxible. Most of them are focused on making Flux easier to use with the server rendering and reducing the boilerplate. They also often provide convenience utilities like higher-order components and asynchronous action helpers. Still, under the hood, many of them are built on top of the original Flux Dispatcher.

Reducing the boilerplate of Flux is often a tradeoff. Some libraries have chosen to forfeit the great properties of Flux in order to be more succinct.

Say, if the actions aren’t plain objects flowing through a central…


Update

The ideas from this post have now materialized in babel-plugin-react-transform and its ecosystem. Check out react-transform-boilerplate!

React Hot Loader is my first JavaScript open-source project. It has enjoyed a tremendous response, and it has changed my professional life. True functional programmers don’t take it seriously, but comparing the wonder I felt the first time it worked to the mundane reality of hot reloading today, I know that it has made a difference in people’s minds, workflows and expectations.

New projects sharing the same vision, such as Amok by Casper Beyer and LiveReactload by Matti Lankinen, have appeared. Benoît Zugmeyer

Dan Abramov

Working on @reactjs. Co-author of Redux and Create React App. Building tools for humans.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store