Size Changes

Totally agree that there are good alternatives to CRA now and React should more prominently feature them. However, as maintainer of Parcel, an alternative to Vite, I would appreciate if React did not play favorites (also with Next.js vs other frameworks). Since CRA was maintained by the React team it kinda made sense, but harder when it's not. Maybe a small description of each option with more details about what it's best for and the tradeoffs vs other options would be good?

Like "if you're building an SPA, Vite and Parcel are good options. Vite is a bundle-less dev server that works with React and other frameworks ... Parcel is an easy to use bundler that works great with React ... If you're building a server rendered app, Next.js and Remix are good options. Next.js is a React framework with file system routing, server components, ... Remix is a React framework focused on web standards ... If you're building a static website, Gatsby is a good option. Gatsby is ..." These are really rough descriptions. Might wanna contact the authors of these tools for a short summary.

Most would agree that the recommendation of CRA needs to be removed, considering it's a dead repo. But recommending a less optimal solution might be about as bad for a beginner as multiple recommendations.

My completely subjective, gut feel is that vite should be that recommendation. But any active project would be fine. Multiple will just result in analysis paralysis, which kills beginners. More advanced users will find other projects on their own.

At the very minimum, a single recommendation should be made for beginners and any other recommendations segmented away for more advanced devs to investigate for their specific need.

@devongovett I agree. I would like to see a brief description of each option and avoid playing favorites, except, of course, for the inevitable placement of the options in a list which (despite using the<ul> unordered tag) is, in fact, ordered by the mere observance of the vertical dimension in our pitiful spacetime existence.

But I want to point out an issue of almost equal importance, which I believe@t3dotgg can amend in this very PR by swapping just two lines. That is: Let's put Parcel above CRA. (If not outright removing CRA, as@david0178418 bravely suggest)

As it stands, Parcel's DX is leagues ahead of CRA:

• A cursory glance atCRA's issues tab should suffice as a demonstration of its state. A sort by comment and a deep dive intoglaringly offensive issues is recommended only to the masochists among us.
• Parcel has important and fancy features (Features that speak to the spirit of our ages, ladies and gentlemen!) that not even Vite possesses to the same degree, like a built-in world-classbrowser extension support.

Quick preface: I am not associated with the React / CRA projects, just offering my two cents.

@devongovett

Totally agree that there are good alternatives to CRA now and React should more prominently feature them. However, as maintainer of Parcel, an alternative to Vite, I would appreciate if React did not play favorites (also with Next.js vs other frameworks). Since CRA was maintained by the React team it kinda made sense, but harder when it's not. Maybe a small description of each option with more details about what it's best for and the tradeoffs vs other options would be good?

Like "if you're building an SPA, Vite and Parcel are good options. Vite is a bundle-less dev server that works with React and other frameworks ... Parcel is an easy to use bundler that works great with React ... If you're building a server rendered app, Next.js and Remix are good options. Next.js is a React framework with file system routing, server components, ... Remix is a React framework focused on web standards ... If you're building a static website, Gatsby is a good option. Gatsby is ..." These are really rough descriptions. Might wanna contact the authors of these tools for a short summary.

That's a lot to digest for someone who is just learning what React is. Many of the "new React devs"@t3dotgg mentions aren't going to know what most of those words mean, or if they need them. That's why CRA is useful, it's a one-stop "here's a React app, no other stuff" tool.

That being said -@t3dotgg I'd suggest expanding on what the "countless issues" you are experiencing with CRA are. A Tweet with a bunch of engagement isn't really a justification, and this PR just comes off as inflammatory in it's current state.

I'd also suggest people stop "Approving" this if you aren't part of the React team, you aren't helping anyone by doing so.

@mattwilkinsonn the issue is that there are a myriad of issues that can't be resolved when a project is dead.

Check the last year of activity. The last commit was in Sept last year. But there are 1.5k filed issues and over 400 prs lying idle that could be resolving problems. That not ideal for beginners who would have pain trying to debug these.

That's a lot to digest for someone who is just learning what React is.

I agree with that, but I also think React is used for a lot of different use cases, and there isn't a one-size-fits-all tool. It's important for beginners to know what the tradeoffs are so they can make an informed choice. A lot of current CRA users should really be using a server rendered framework, and conversely, some apps using server rendering might be better off with an SPA or static site (this is not intended to spur a debate 😉). As shown by CRA's popularity, React's recommendations have a lot of weight.

The "Getting started" section in the current docs doesn't really show much other than an install command and linking to the CRA docs, and the next.js section only links to the next.js docs. The other tools only have links and no explanation about when you should use them. I think it would be helpful to explain what each tool does and why you should use it. One of the points about a tool could be "it's good if you're just getting started with React", so there could still be a recommendation for that as well.

It's important for beginners to know what the tradeoffs are so they can make an informed choice.

I don't think this is the case. It's not important to understand the intricacies when you're just getting started. Once you have a foundational understanding of the technology, it's great to be able to go and learn about the different directions/branches you can go down with the technology but that's only once you have an idea of what you're doing. These things are not necessary for a beginner to understand.

And if you're talking about someone who is new to React but experienced in web development, then I wouldn't be calling them a beginner.

This page is not only for beginners. In fact, if you read the whole thing, it already covers many aspects of this. There are descriptions of what a bundler does, what a minifier does, etc. There is also already a distinction between "minimal toolchains" and "frameworks". All I am suggesting is that there are similar descriptions for each tool listed with the use cases that it is good for. That doesn't preclude having a recommendation for "learning React" at all. At the same time, it helps beginners understand the confusing landscape of tools out there.

Totally agree that there are good alternatives to CRA now and React should more prominently feature them. However, as maintainer of Parcel, an alternative to Vite, I would appreciate if React did not play favorites (also with Next.js vs other frameworks). Since CRA was maintained by the React team it kinda made sense, but harder when it's not. Maybe a small description of each option with more details about what it's best for and the tradeoffs vs other options would be good?

Like "if you're building an SPA, Vite and Parcel are good options. Vite is a bundle-less dev server that works with React and other frameworks ... Parcel is an easy to use bundler that works great with React ... If you're building a server rendered app, Next.js and Remix are good options. Next.js is a React framework with file system routing, server components, ... Remix is a React framework focused on web standards ... If you're building a static website, Gatsby is a good option. Gatsby is ..." These are really rough descriptions. Might wanna contact the authors of these tools for a short summary.

I'm inclined to agree with@mattwilkinsonn's point about this being far too wordy for a new developer. However, I do agree that the docs shouldn't necessarily be opinionated about any one approach.

Totally agree that there are excellent alternatives to CRA now, and React should more prominently feature them. However, as the maintainer of Parcel, an alternative to Vite, I would appreciate it if React did not play favorites (also with Next.js vs. other frameworks). Since CRA was maintained by the React team, it made sense, but it's harder when it's not. Perhaps a small description of each option with more details about what it's best for and the tradeoffs vs. other options would be beneficial?

For example:

Single Page Applications (SPA):

Vite: A bundle-less dev server that works with React and other frameworks, providing a fast and efficient development experience.
Parcel: An easy-to-use bundler that works great with React, offering zero configuration and out-of-the-box support for many features.
Server Rendered Apps:

Next.js: A React framework with file system routing, server components, and a robust ecosystem for building server-rendered applications.
Remix: A React framework focused on web standards, offering excellent performance and a flexible approach to routing and data fetching.
Static Websites:

Gatsby: A React framework for building static websites, leveraging GraphQL and a vast plugin ecosystem to optimize site performance and development workflow.

To everyone still getting emails about this old PR: Notification gang, rise up!

@myckhel

Considering that CRA is on a deprecation path now withfacebook/create-react-app#17008

Do we see any interest in revisiting this PR?

Currently thedocs push you to pick frameworks like next or remix.

However, I'd really like to seevite be recommend too 🙏.

Email notification gang, rise up! 📫 🚀 😎

Update

We've announceddeprecating Create React App on the blog, which explains the limitations of starting with a build tool, and added new docs forBuilding a React app from Scratch that includes instructions for starting with build tools like Vite, Parcel, and Rsbuild (see#7495 and#7624).

The docs and blog post include much of the information@gaearon explained inthis (now buried) comment, and helps users understand the tradeoff for building a new app from scratch versus using a framework.

Locking this to limit the notification spam, if you have more suggestions, feel free to file a new issue!