JavaScript for People Who Hate JavaScript
I have a long history with JavaScript, dating back to the glory days of the most perfect technology ever to have graced computers: DHTML.
DHTML was totally rad, like how the Budweiser frogs were rad. In the late 90’s you really couldn’t do much of anything on the web except add 88x31 buttons and build with 1x1.gif spacer tricks. But then Dynamic HTML came out in IE4 and a whole world of hover animations, mouse pointer effects, and pretty much nothing else were possible. It was really cool.
Then I did a bunch of other JavaScript from time to time. Everything was pretty terrible until jQuery and Mootools and a slew of other frameworks finally came out in the mid-2000s. That make things almost tolerable for awhile.
Then I started working at GitHub, and my JavaScript experience basically degraded to slinging together some horrific string concatenation and then pushing a pull request, making sure to CC the @github/js team so they would fix everything for me.
Suffice to say, I’ve hated JavaScript for quite some time. But now I’m building a hip new calendar called During, it made a lot of sense to get back into this crappy frontend junk, since a calendar is one of them client-side-heavy apps your parents warned you about growing up.
You know what’s fucked up? I’m kind of loving JavaScript now. I think 2017 is finally the year of “JavaScript on the Desktop”, where “DESKTOP” is an acronym for Developers Enjoy javascript now even though they thought it Sucked compared To Other Programming languages before. (I’m really shit at abbreviations, sorry.)
Please don’t hurt my feelings
Quick disclaimer: I’ve built things primarily in Ruby the last decade, and I still love Ruby (and in fact, During’s backend is a Rails GraphQL API-only app, and I couldn’t be happier about that). I’m definitely not a Fancy Programming Language PhD person who has lots of Facts and Reasons behind language design and stuff. I just like building things. So if this post gets you real antsy about Something Holman May Have Gotten Wrong, well, you’re probably right. Like most bright-eyed Rubyists, I’m writing this post about feels rather than reals.
Basically I’ve hated JavaScript a bunch for two primary reasons: the ecosystem and the syntax. And surprisingly I think both are pretty cool now.
So if you’re like me, and those things traditionally upset you too, cool, you’re who I’m writing this for. Things have apparently changed since the last time I looked at JavaScript — approximately during the Clinton administration — and it’s lovely.
The Ecosystem
One of the things I kind of rolled my eyes at in the last five years was Node itself… specifically its ecosystem. You know all the jokes by now: there are five hundred thousand packages to capitalize the first letter of every word, and each of them have about fifty hundred thousand dependencies, each of which is in turn has about one line of code.
I had vague feelings about this being weird from a security/performance/whatever perspective, but generally from a building perspective every time I looked into starting a new app there were millions of permutations of packages and libraries you could use to stitch together your stack. Cool, lots of freedom, I get it, but remember: I still think Rails is cool. Hell, I was one of the huge +💯s on the infamous DHH commit that added .second, .third, .fourth, .fifth, [and so on] methods to Rails back in the day. I like batteries included. And though I tried various batteries-included JavaScript frameworks over the years, nothing really resonated with me. Beyond that, every tutorial and post was seemingly out of date within a few months of writing it, as tools continuously churned and (hopefully) improved.
Things have changed. I’ve happily joined the React bandwagon, and that solved a lot of problems I didn’t even know I had (more on that in a few). But one of the things that’s really jazzed me up with regard to the ecosystem question is Create React App. CRA is a Facebook-supported open source project that debuted last summer that kind of gives you the framework of an app, getting you started quickly with React and with suggested paired libraries.
I found CRA fairly mind-blowing, because it took care of all of these fairly answerable questions for me: how do I bundle my code? How do I structure my code? How do I do hot code reloading (which is a great name for a band)? How about code splitting? How do I set up testing? How do I work with Babel, whatever the fuck that is? (Just kidding. I know what it is by now. It’s terrifying, that’s what it is.) These are all answerable questions, but I just don’t have the time to spend months and months getting to know all the options, trying them out, and getting them all to work together. CRA has best-in-industry people like Dan Abramov doing all this crazy shit for me.
What’s more, updates are great. It’s just a yarn install away. A few months ago I basically got Service Worker support for free. It’s getting me into techniques that I haven’t even needed to learn yet (but would). It’s neat.
Honestly, Create React App, at least from a beginner’s perspective, has fundamentally changed at how I’ve looked at the JavaScript ecosystem. I’m definitely not saying it wasn’t functional or amazing or whatever beforehand… its launch just coincided with my own needs and desires. Love it.
The syntax
Okay, so as a Rubyist I don’t really get to be all high-and-mighty too much anymore. Rails ain’t the hottest shit on the street anymore, our performance was never really great, and lol, the language still hasn’t even moved off of Subversion. But one thing I’ll still love is the syntax. The language feels so much more freeing than anything else I’ve tried. It’s, well, beautiful, at least in my mind.
JavaScript always seemed a little bonkers. From having a pretty terrible standard library, to callback hell, it always seemed weird to use, whether I was using jQuery or vanilla JavaScript.
Couple new things have happened in JavaScript land that have changed my opinion: prettier, and the ability to bring in ES6 and ES7 features, which makes JavaScript the language itself much more palatable. Create React App helps a ton with the latter; they already bring in a few polyfills, and the way they’ve set up your toolchain makes it easier to bring in additional forward-looking JavaScript modules and libraries.
Prettier, if you haven’t heard of it, is awesome. A screencast says about a billion words:
It’s basically like gofmt for JavaScript. Okay, so a screencast says like six words, but still. It parses your JavaScript and outputs prettier code. I love it.
Much in the same way I love gofmt, I love it in spite of whatever syntax changes it makes. In Go, for example, gofmt makes it really easy to not care that I’m actually using tabs instead of spaces, which is wrong. But all Go code is now the same consistency in syntax now because of it, so it makes that horrible action totally bearable. With Prettier, I don’t have to care about the semicolon debate, or really have to care about how I type anything at all, really. Actually, Prettier’s made my code far, far worse, because now I don’t even really bother to indent lines or put parenthesis around things anymore; I just cmd+S in Atom and I’m good. Give me a whiteboard hiring test now and I’m totally screwed (not that I wouldn’t be anyway, but I’d be screwed even more now, I mean).
Combine Prettier with Flow or TypeScript and my JavaScript just feels orders of magnitude better, more logical, and more reliable.
The other thing on top of all this that I briefly wanted to mention is React itself. Since moving to React, it’s really been a breath of fresh air, because, as I keep telling people, I don’t feel like I’m really writing JavaScript. Because of the functional nature of everything, you really get close to as simplified of a workflow as possible: first get an array of things, and then you render each one of those separately. That’s about it. Unless I really need to get complicated with what I’m building, everything is just as simple as a simple loop and a render. No crazy async recursive event listener bubbling code to have to write every time. It makes the mental model of every component and screen that I’m looking at for the first time in months much easier to grok, too.
Anyway, I’m pretty excited about all this stuff, which is a fun feeling. Hasn’t really been since Rails 0.10 since I’ve been this jazzed up about specific tools in programming. And that’s really cool. Being a novice again — even if it’s for a language I first tried, in some form, almost two decades ago — is a really eye-opening, frustrating, and exciting experience. A+ would learn JavaScript again in 2037.