BT

New Early adopter or innovator? InfoQ has been working on some new features for you. Learn more

Facebook Launches Tool to Easily Create React Apps

| by David Iffland on Jul 27, 2016. Estimated reading time: 2 minutes |

A new tool put out by the React team hopes to reduce the pain involved in setting up a new React app.

In a blog post, Dan Abramov introduced Create React App, which lets developers spin up a new React application — including its build process and dependencies — in a single command. It's an officially supported way of creating React applications, yet it's not a "React CLI" in the same spirit of Ember CLI or Angular CLI.

Developers can spin up a new React app in three commands:

npm install -g create-react-app
create-react-app hello-world
npm start

What's abstracted away is the set of Babel and Webpack commands common in modern React apps. Abramov says they build this tool because "the React ecosystem has commonly become associated with an overwhelming explosion of tools":

Combining these tools requires some experience with each of them. Even so, it is far too easy to get dragged into fighting small incompatibilities, unsatisfied peerDependencies, and illegible configuration files. Many of those tools are plugin platforms and don’t directly acknowledge each other’s existence. They leave it up to the users to wire them together. The tools mature and change independently, and tutorials quickly get out of date.

In theory, React doesn't require much to get started with, but building production level apps requires more. Over time, the React community became more reliant on Babel and Webpack as part of the default tool chain. Yet these two technologies have often frustrated developers. Babel, for example, does nothing with a plain install. Andrew Stuart described Babel as useless by default. Abramov reframed Babel's intentions, saying, "Babel doesn't get it wrong, it just wants to be a lower level tool. You can (and should) build on top IMO."

Experienced React developers have figured out a build process that works for them. The new tool aids the rest of the community, helping those with no React experience get on their feet quicker. The "eject" feature lets those who have outgrown the tool to split off from its rigidity and go their own way. Reddit user a_simple_pie commented:

'Eject' really is a killer feature for this. The first thing i wanted to do was add support for SASS so being able to eject was great.

Create React App doesn't yet have the breadth of a full CLI tool, which is understandable given that it was a "hackathon project made in a week," says Abramov. There are plans to build upon its capabilities, such as adding testing. They're careful not to do too much too soon, but Abramov says they "will gradually make the defaults better to cover more and more use cases."

The project's GitHub page has more information about the tool's capabilities.

Rate this Article

Adoption Stage
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Tell us what you think

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread
Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Discuss

Login to InfoQ to interact with what matters most to you.


Recover your password...

Follow

Follow your favorite topics and editors

Quick overview of most important highlights in the industry and on the site.

Like

More signal, less noise

Build your own feed by choosing topics you want to read about and editors you want to hear from.

Notifications

Stay up-to-date

Set up your notifications and dont miss out on content that matters to you

BT