New React App
Use an integrated toolchain for the best user and developer experience.
This page describes a few popular React toolchains which help with tasks like:
Scaling to many files and components.
Using third-party libraries from npm.
Detecting common mistakes early.
Live-editing CSS and JS in development.
Optimizing the output for production.
The toolchains recommended on this page don't require configuration to get started.
You Might Not Need a Toolchain
If you don't experience the problems described above or don't feel comfortable using JavaScript tools yet, consider adding React as a plain <script>
tag on an HTML page, optionally with JSX.
This is also the easiest way to integrate React into an existing website. You can always add a larger toolchain if you find it helpful!
Recommended Toolchains
The React team primarily recommends these solutions:
If you're learning React or creating a new single-page app, use Create React App.
If you're building a server-rendered website with Node.js, try Next.js.
If you're building a static content-oriented website, try Gatsby.
If you're building a component library or integrating with an existing codebase, try More Flexible Toolchains.
Create React App
Note
Next.js
Gatsby
More Flexible Toolchains
The following toolchains offer more flexibility and choice. We recommend them to more experienced users:
Creating a Toolchain from Scratch
A JavaScript build toolchain typically consists of:
Don't forget to ensure your custom toolchain is correctly set up for production.
Last updated
Was this helpful?