[based on a true story]
So. Your friend's about to teach you how to make a website. Great!
You make a file, and you save it as 'index.html'. Why it's called 'index' isn't really explained to you, but whatever.
You type the following.
<div>hello world</div>You open it up in your browser, and damn, it says 'hello world' back at you. Neato!
You ask why it's called a 'div', and your buddy makes up an answer. It's clear she doesn't know either. Meh.
Now you add a style attribute.
<div style='color:red;'>hello world</div>Refresh, and the text is now red! Cool!
Now let's make it 'do' something.
<div style='color:red;' onclick='alert(123)'>hello world</div>Refresh. Click on the text. It blinks back at you "123". It's alive!
This is pretty easy, you think. You could do this. It's just a matter of details now, to figure out what more can you shove into style, and what other on* stuff you can use. It's pretty liberating, you're going to be a 'techie', and your startup's going to take over the world, and...
She tells you that you should never write code like this.
She tells you how writing html by hand will be hard to handle. She mentions something about 'templates'.
She talks about how inline styles are bad, and you need to use something called 'classes', and write the style bits separately in another block called 'style' (and then confuses you further by making it a whole other file). You glaze over during the bit she calls 'selectors'
She tells you that inline event handlers are bad, something about 'maintainability' and 'performance' and what not. You're told of something called 'event delegation' and have to learn about 'models' (they're not even pretty) 'views' (not of the sea) and 'controllers' (which sounds hella shady)
10 years pass.
You're now a star in the office. You use the phrase 'dom wrangler' with pride. You know the quirks of the browser inside and out. You can whip up jquery that does fancy animations and whatnot with a day or two of work. You recite doctypes in your sleep, and you turn your nose up at kiddies getting into the game. There's a "way" of doing these things, and it's been encoded as Best Practices™ over the last decade, and as a "good engineer" you know all of them. You've written multiple 'frameworks' over the years, and have an opinion on every one of them in the gitosphere.
You hear of something called React.
At first glance, it looks like everything you've worked to avoid your entire career. The API looks hella 'object oriented', while you went the functional way years ago. They've invented some new syntax to inline html into your code, another big no-no since forever. You look for the event delegation, instead you see they're (gasp) using inline event handlers. They're jibbering about something called a virtual dom, which sounds like it would be REALLY slow, and you've suffered a career's worth of performance hate that you're not sure how this could ever work.
What the fuck is going on.
But the cljs dude wrote a post where he says its the bees knees and the Future™ and whatnot, so you decide to give it a go. You disappear for the weekend.
By the time you surface on monday you have a... glow about you. Your wife keeps checking to make sure you're alright, she's never seen you be so quiet for so long. You sometimes mutter into empty space, but get no response. The last time you felt so heady was when you smoked cheap weed and watched pink floyd in college, and that's so far back you don't even remember it.
See, you spent the last 10 years believing Community Leaders. They seemed so certain when they spoke about how things are, and how they should be. "Best" practices always implied that there would never be anything better, so you were happy following along, and not trying to do anything better.
But you remember that first day. You remember writing it all 'inline' and it made sense dammit. It felt natural, and you could SEE what it would do.
So the smart folks at facebook thought to themselves, well, can we let developers write it in a way that feels natural, and then we use computers to do all the good stuff?
If the problem with inline html was that long strings are hard to deal with, can we make so that they can create actual trees of nodes?
Can developers write their event handlers inline, and then we 'make' it use event delegation in the background?
Can developers write their own 'tags', and intersperse it into the dom, and we magically make it efficient and whatnot?
(clearly I'm trivializing. read their 50k stars post for more on the history.)
So... that's what I like about React. All the other technical stuff is good, but this is the first library that really feels like it embraces its roots.
I don't plan to wax poetic about this anymore, just wanted to share. I hope you liked it.
What about style?
Well... what if we could write styles as 'inline', and our framework made it use css and stuff in the background? What if I could write -
<div css={{ color: 'red'}}>hello world</div>Just use glamor :)