In my free time I’ve been working on an art project with Shannon that requires just a little bit of frontend development. After implementing a rough sketch in VanillaJS, I decided to learn how to use React & the modern frontend ecosystem.

Shaking off the Rust

It’s been a really long time since I’ve done professional frontend development. The last time I did frontend, Backbone.js was just getting popular and Jasmine was just starting to change people’s perceptions of testing frontend components. There was still a lot of grimy Selenium + Selenium IDE for Firefox going on too.

When React first came out I took a look at the video and read stuff about the Flux architecture and how it works, but I never actually went and implemented anything, as my interest in frontend wasn’t very strong and there were a lot of other things catching my attention. That said, everything made sense and sounded great: testable components. One-way data flow, where view state is directly tied to data. Small mutations to a virtual DOM, flushed to the real thing when needed to enact a view.

Then a few months back I started looking at React again but the ecosystem was a little overwhelming. I had a hard time deciding where to start and which tutorials to run through.

Forging a Path

This weekend I jumped in and tried Facebook’s official tutorial. It was pretty good! Then I read through “Thinking in React”.

But these introductions didn’t answer deeper questions:

  • How do I manage multiple views for a single page app in React? (Redux / Flux?)
  • How do I separate my React classes into different files? (Webpack, RequireJS?)
  • How do I test my React components? (Jest?)
  • How do I write a performant backend for my React App?
  • How do I port my React App to native platforms?

I’ll be trying to answer those questions tomorrow during my memorial day break. Excited to be learning this new ecosystem!

Little Learnings

I think the other thing that took a little time was setting up my tools. I’ve been meaning to give VSCode a try for ages, so this was the perfect opportunity. Modifying HTML in VIM isn’t my favorite thing; the long lines and frequent nested copypasta make a mouse helpful.

I also got around to configuring my npm to install global packages to ~/.npm-global instead of actual global. And I learned a bit about golang development outside of Google, which turns out to be really nice. I’ve started to adopt go’s folder structure for some of my other code because I find it so neat and nice.