As a technical writer, there are four letters I absolutely hate. They don't make up a swear word, but they represent a concept that might be even worse. In most cases, it's the idea of "Figure it out yourself, it's not my job to help you." But they can also be valuable in retrospect, when you find exactly what you need hidden in plain sight. The difference between knowing and not knowing is usually somewhere in how you ask the question.

Don't say the four letters yet, even though I kinda deserve to hear them.

Like with most things I learn, my foray into React lifecycle methods started with me doing something really, really dumb.

I've been working on a Jeopardy scoreboard to learn React. It's coming along pretty well, and if I might say so myself, the UI is actually pretty decent.

My problems really started a few weeks ago when I tried to implement Redux. As someone who has never used Redux, and has barely used React, it fell apart immediately. I wanted this scoreboard to persist data because I often hit refresh by accident, but I also didn't want to build a backend. That's when I learned about localStorage.

If you haven't heard, localStorage is awesome. It's also easy enough that you can learn it in less than 5 minutes. Sounds perfect.

Rather than using Redux, I decided to save my state in the browser. It's not a complex enough app to justify learning Redux (I promise I will eventually).

So I wrote a couple lines - one to save state and one to load it. And that's when I messed up big time.

I started copying my save and load into each of my methods that modify the internal app state. Things went...poorly. At this point, I wish that someone had burst in and stopped me, but I continued like a buffoon for about an hour.

There has to be a better way, right? Well, it turns out there is. And it turns out it's actually a core feature of React: lifecycle methods.

I know I deserve it, but don't break out the pitchforks just yet. I had read the docs, I swear. Multiple times.

But in the docs, lifecycle methods are used to "free up resources" and the example is killing a timer function. I never used them because when I write code that uses up the entire call stack, it's generally a dumb error and not something that needs to be optimized away with more code.

Here's a radical idea though. What if I used lifecycle methods for something other than the narrow example provided?

It turns out, this solution was ideal. Lifecycle methods cover different points of a component's...well...lifecycle. You can do something when a component is about to mount (componentWillMount), right after it mounts (componentDidMount) and even when it updates (componentDidUpdate).

Rather than copying the same lines of code into multiple different methods for the same reason (yes I knew this was bad and I did it anyway), I broke that reason out into its own method. The best part was that this was an existing method that ends up being just a few extra lines.

It's almost like I'm following some sort of paradigm where my programming is based on the idea of functional data manipulation. But JavaScript has classes now so that can't be it 😎

React lifecycle methods are not bad. They're not complicated. They're actually easier to understand than topics like state vs. props.

I had glossed over them in the docs because I didn't think they were helpful for apps at the tiny scale I'm capable of building. Only when I started thinking about what they actually do did I understand. And only when I actually implemented them in a project did it really click.

Doing things is important. It's the only way to really learn, and this particular lesson only cost me about an hour and a half of wasted time. But reading docs is important. Not just absorbing words on the page - that's how you read normal things. With docs, you have to read, think, and morph the ideas in your head. You often have to come up with your own examples before you understand.

I didn't get React lifecycle methods because I didn't do either of these. It's easy to say in retrospect, but my lack of imagination caused me to skim something I should have studied.

The four letters I talked about before are a huge sign of disrespect, and you should never say them to someone who's trying earnestly to learn. But when you fail yourself, they can sometimes be used as a lesson. It's not that I wish that someone had told me this, but I think I can admit it now...

I should have RTFM.