Made by
Made by
Benjamin Dunphy
At Real World React, Benjamin Dunphy organizes multiple React community events. In this lightning talk from DevRelCon San Francisco 2019, Benjamin runs through some metrics around React adoption, perception, and community.
So last week, React celebrated six years since it was first open-sourced. And the growth React has seen in that time has been absolutely incredible. But you might not know about the reasons behind that growth.
Why are so many developers taken by React? And how exactly can we measure that growth? Should you even care? So in this brief lightning talk, I’m going to talk to you about React, the developers who use it, and why you and your company should care.
But first, who am I? I’m Benjamin Dunphy, I am Managing Partner at a consulting firm called Real World React. And we provide engineering teams on San Francisco Bay area and across the country with training for their engineering teams on React and the extent of the ecosystem like GraphQL, Redux, and things like that.
We provide community developer relations assistance by partnering with various companies for our events such as our meetups and our conferences. And we also provide conference consulting, so if you’re a company that has, let’s say, a meetup and you want to take it to the next level with a conference, we can help you with that.
You may recognize some of my work from the meetup I run here in San Francisco for those of you that are based here of the same name called Real World React. I produce and organize the front-end conference Reactathon annually. And also consult with Netlify to help them run the various JAMstack_confs around the world.
So when I was originally invited to give this talk, I entitled it “Why I bet my career on React.” But I believe a more apt title would actually be to, for this audience at least, to be “To supercharge your dev rel with React.” And that’s because React is no longer, you know, an obscure library fighting for adoption. It is now one of the most popular and powerful tools in web development.
And we’re going to understand this, understand more about this community with three levels of focus. We’re going to focus on the adoption of React, we’re going to focus on the perception of React among the developer community, and then we’re going to talk just a little bit about the community itself.
First, let’s talk about adoption, and we can’t talk about React without talking about the web. And the web is enormously popular and accessible. And JavaScript, the language that helps to power and enrich the web is incredibly popular. There are more than twice as many open PRs related to JS ecosystem than its closest competitor.
GitHub published a blog post analyzing the top programming languages by repositories created and JavaScript came out on top. In a 2019 Stack Overflow survey, which surveyed over 90,000 respondents, reveals that JavaScript is the most popular technology.
Okay, so let’s get into React. One method of measuring React’s adoption is the number of installs for the React developer tools. And since a good number of devs who use Chrome will have this extension installed, it’s a pretty good measure of adoption. And here we can see that over 1.6 million developers have the React dev tools installed.
And then there’s the new GitHub feature Used By announced at GitHub Satellite just last month. And this allows you to see how many projects on GitHub make use of that repository as a dependency. And React has over 2 million.
Another great metric is the state of JavaScript survey. This is a comprehensive survey of the JavaScript community and ecosystem, and it’s built by these fine folks. And after collecting data from over 20,000 developers around the world the data was pretty clear. React had the largest user base of any library in the entire JavaScript ecosystem. This is also the case in 2017, and was also the case in 2016.
Stack Overflow, going back to their survey of over 90,000 developers, 31% of respondents said they use React. And as you can see here, it looks like React still has plenty of room for growth as it’s still trailing by jQuery by a wide margin, at least in this sample.
But perhaps an even better measure of adoption and usage is npm. As today’s most popular package manager and registry for modern web projects, the figures we see here are representative of the majority of today’s web developers. And since Yarn pulls from the npm registry, these figures also include you, Yarn users.
So in this graph, we can see that React as that thick, blue line going up and to the right. And this, FYI, this is an absolute explosion in popularity because this graph is not showing absolute growth, this graph is showing relative growth as a share of the npm registry.
As Laurie Voss of npm said at Reactathon last year, “React is running away with the web.” So to sum up the adoption level of React, here is Doge on a rocket ship, and, yeah, it looks like my slides are kind of broken. That was a GIF of him going somewhere.
Okay, the perception among the community in the 2019 Stack Overflow survey of the most loved web frameworks, React came out on top.
So the state of JavaScript survey has an excellent question that asks why they love a framework. Here you’re supposed to be able to see that engineers love React for its elegant programming style and patterns, its rich package ecosystem, its good documentation, and more.
So, why don’t we explore this a little bit and discover the reasons behind this positive developer experience with React.
Did you ever talk to a friend and engineer who uses React? There’s a good chance that they’ve told you how much they love working with it. And one of the many reasons for this is React’s modularity. In fact, React’s modularity is one of the biggest reasons for its success. And this is achieved because React is a library not a framework.
One of the best demonstrations of this modularity is the story of Flux. Flux is an application architecture and state management system that was introduced by Facebook alongside React. But it wasn’t perfect, and a lot of people just weren’t satisfied with it.
And as you can see here in green, Flux loses its popularity around the middle of 2015, yet React, there in blue, keeps on rising. And why is that? And React kept growing because Redux was introduced at that time and became the dominant implementation of the Flux architecture. This was only possible because React does not ship all of its features as a single framework. Instead, developers are able to easily swap out one tool for another. And today, there’s a rich open-source ecosystem that has risen to solve every problem you can imagine.
And while I’m presenting this modularity as a feature, which I certainly believe it is, oftentimes, newcomers to React can feel overwhelmed. They either don’t know how to piece together a React app properly and become frustrated, or they try to jam pack all the latest features they’ve heard about on Twitter into their to-do app.
So if you fall into this camp, I would recommend to you, Benny Ilegbodu’s keynote at Reactathon this year, the “State of the React Ecosystem.” It provides a clear overview of the dominant patterns for architecting a modern React app today.
Okay, so we understand how React’s modularity contributes to its DX. Let’s talk about syntax and structure. Now, bear with me here, because, React is a JavaScript library that completely changes how you think about building user interfaces.
Instead of imperative series of steps, you declaratively say what you want and React figures out the rest.
You can build reusable components, so that once it’s a button, it’s a button everywhere, just like it was as an HTML element.
React is not a templating language, so your markup and display logic are no longer separated arbitrarily, instead the concerns of your app are separated into components that contain both.
There are even different renderers like React Native for native apps, WebGL renderers, virtual reality, and more, so that you can easily build cross-platform apps.
But I think where React truly makes your life easier as a developer is the unidirectional data flow. No more confusion about the source of truth in your apps.
And these features are just some of the reasons why Facebook was able to rebuild its entire web app from scratch, using React and Relay. And if you missed this, it was just announced at F8 last month, and this is probably going to be the biggest test that React will face in terms of performance, skill ability, and usability, as it powers one of the largest applications in the world.
And finally, React is just JavaScript. If you’ve ever used a templating language before, you know that there’s tons of extra syntax and patterns that you’ll need to learn to be effective. But once you move on to the next thing, whether it’s another job or the next evolution of JavaScript tech, you just can’t take those skills with you.
Since React is just JavaScript you’ll actually improve as a JavaScript developer everyday you write it. And you can take those skills with you to whatever comes next.
But I know some of you may be thinking, “Well, what about JSX?” So for those of you who don’t know, JSX is an XML-like syntax extension to JavaScript. It takes in expressions that look like HTML, and turns them into function calls.
And most developers who code with React, choose to use JSX. And while it may remind you of a templating language, it comes with the full power of JavaScript where you can declaratively build reusable components that contain both your application’s display logic as well as your markup. So you can do anything in JSX that you can do in JavaScript.
If you want to learn more about JSX, I would recommend a talk from Jay Phelps that he presented at the 2018 edition of Reactathon called “Why I love JSX,” which curiously actually started from a Tweet. He just tweeted that out and I was like, “Let’s do a talk on that.”
Okay, so that concludes the developer perception of React.
Let’s talk a little bit about the community. React enjoys worldwide adoption. And there are over 25 React-specific conferences in virtually every major city around the world. There are over a 100 React-specific meetups, most of them here in San Francisco actually. No, basically any city you want to go to there’s very likely going to be a React meetup there.
Online communities, there’s tons of discussion forums, Reactiflux has over 50,000 in their community. The dev forums, Hashnode, the subreddit is really great and moderated by some amazing people. And then there’s the usual social media groups that you’ll find plenty of people on.
And React is now taught by many schools and boot camps. And even among those schools and boot camps where React is not taught, some instructors have confided in me that students choose to build their capstone projects in React.
So this is just a lightning talk, just running through this, so some conclusions for you.
So React is used all over the world by millions of developers. It is the JavaScript library today that is dominating the web. And developers love React. They love it and using it will make them better JavaScript developers, not just better at an isolated templating language. And lots of developers want to learn React. So if you use React at your company, you’ll be able to attract them there.
So, if you aren’t already, I encourage you to learn more about React and the community that makes it thrive. Thank you.