Everything You Need to Know About React in 5 Minutes

Since its public release by Facebook in 2013, React has become one of today’s most popular JavaScript libraries for developing modern, front-end user interfaces. Here at Postlight, whether we’re building new products or modernizing legacy apps for our clients, React is the technology we turn to for creating interfaces on web and mobile.

From small startups to giant enterprises, when we recommend React to our clients, no one blinks. It’s because React has become the de facto way to write complex web apps, and there are a few reasons why.

The core philosophy of React development revolves around creating small, reusable building blocks—components—which can ultimately be pieced together to form entire websites. Backed by Facebook and an ever-growing community of open-source developers, React’s meteoric rise in adoption over the last half-decade has positioned it to be a mainstream front-end technology well into the foreseeable future. In short, React speeds up development, minimizes risk, and is easier to hire for.

Who uses React?

Companies like Netflix, Walmart, Dropbox, Tesla, Airbnb, and many, many others use React. This wide adoption is due to React’s component-based architecture: It allows large organizations to work nimbly, introducing components as needed without completely rewriting their entire codebase.

Additionally, the introduction of React Native — a sister framework that enables cross-platform mobile app development in React-flavored JavaScript — enables development teams familiar with React on the web to easily build mobile apps as well. This means developers can work across a suite of digital products that run on different platforms but share the same codebase and the same components.

That shared understanding (and code!) across products creates efficiencies and flexibility you don’t have on a development team that has to be able to write and maintain native Android code, native iOS code, and code for the web.

Why React?

Historically, the web worked like this: You fired up your web browser, typed in a URL, and a server loaded a page to display to you, made up of HTML. That HTML got sent over the internet to your browser, which rendered it on your screen. Every time you clicked a link, you asked a server for more HTML and waited for it to deliver.

If that website wanted to do something fancy, like collapse a sidebar, the web developer had to write some bespoke JavaScript to make that happen. Crucially, the HTML rendering to your screen and the interactivity on that screen were separate ideas, defined apart from each other.

In React, JavaScript controls everything being rendered to your screen, and the various boxes and labels and forms — the components — are fundamentally connected to the state of what’s going on in the webpage. A programmer doesn’t need to write a “collapse sidebar” JavaScript function in React, because React is smart enough to know that if your web app has sidebar_collapsed set to true, the sidebar should be collapsed. It effectively removes the need for programmers to write custom code connecting what should happen in an app from what is on screen.

This is very exciting to programmers (who have a special word for this kind of programming: declarative) because, yes, they get to write less code, but mostly because the code they’re still writing looks much more similar to the set of business requirements a manager hands to them. “We have a sidebar, it’s collapsible, and there’s a big grid of paginating boxes over here” now directly translates into a sidebar component, some collapsible state, and a grid of box components. That means apps are built faster, feel faster, and are easier to reason about.

Postlight uses React extensively to build richly featured, dynamic frontends for VICE Media, Bloomberg, and The Players’ Tribune. Using React Native, Postlight shipped an entirely new mobile app for The National Audubon Society on both iOS and Android, using the same codebase. We use React extensively in Postlight Labs to quickly build our open source projects. And we’ve also used it to build more unusual tools, like command-line interfaces and Chrome extensions.

The frontend tech to watch

React is always getting better. It has a passionate community that’s constantly working to improve it: Just recently, new versions introduced features like the Context API, Hooks, and Error Boundaries. Next year promises performance speedups and better data-fetching integrations. But the real reason to watch React in 2020 is because many web developers already speak it: You wouldn’t be wrong to call it something approaching a standard in web development today.

Even beyond the world of web development, React’s declarative style of programming is gaining traction. React is poised to solidify itself as the de facto way to write complex web apps in 2020, which is a win for web developers, product managers, and end users alike.

Mike Ashley is a Senior Engineer at Postlight. Want to talk React? Drop us a line at hello@postlight.com.