Draw a Line: Trying to Learn TypeScript, Redux, service-worker All At Once
A few weeks ago, I fired up a new project. I needed to decide on the tools I wanted to use. I knew I wanted to try some newer stuff I hadn’t played with yet: TypeScript, Redux, service workers. I was particularly interested in trying out the features being touted by Progressive Web Apps.
As I began installing dependencies, I found I had more choices to make. How was I going to do routing? Or authentication? Or API calls? I found myself somewhat overwhelmed with new tools to learn. Immutable.js seemed cool; reselect was recommended; I could use Relay to communicate with my API; Hot Module Replacement definitely seemed awesome.
Over a few days, I tried out various boilerplates, read lots of documentation, learned a bunch, got confused, ran into some weird bugs, and mucked around with dotfiles. All the while, I was staring at a Hello World screen. Sometimes, when HMR was working, the background color would change from red to blue.
Eventually, frustration set in. I was trying new tools, but I wasn’t making progress with the app I wanted to build.
Luckily, the solution to my frustration was simple: I ripped out a bunch of dependencies. I arrived at a point where — regardless of the reason — if a tool wasn’t working for me, I got rid of it.
I removed immutables because I couldn’t get them to play nice with TypeScript.
I got rid of reselect because it wasn’t behaving the way I thought it should.
I ripped out HMR because it would refresh the entire app rather than just the component I was editing.
I merged my containers/ and components/ folders because I didn’t see the point in splitting them up just yet, even though I’d read blog posts that were adamantly saying I should.
I got rid of other stuff I don’t remember now. In the end, I was left with an app stack that didn’t have all the latest and greatest ingredients. But I could happily make progress with it.
In each of the examples above, I was doing it wrong. You can get immutables to work with TypeScript. Reselect totally works, and HMR is a boon. Probably, I’ll separate my components into containers and components again down the road.
Our tools and libraries will continue to churn. New tools and new approaches using existing tools will come along, but there’s rarely an immediate obligation to jump on board. Do it when you’re ready.