Create React App Gone From React.dev, What happens to it now?

[loren138]

I noticed CRA is gone from https://react.dev/learn/start-a-new-react-project But there are lots of tutorials based on it. (I literally just had a book printed that uses it because of wanting to teach react with a minimal toolchain.)

There had been a variety of options forward shared here: https://github.com/reactjs/reactjs.org/pull/5487#issuecomment-1409720741 This suggested there would be an RFC. Was there one? It seems like "Option 3: Deprecate Create React App, suggest React frameworks" has become the reality, at least in the docs.

Is there an RFC somewhere?/What is the plan for CRA?

[getsalty]

Good luck getting information - haven't seen a dev on here in a long time.

The biggest issue is that this project has been dead for a while, but it still isn't deprecated. An RFC or a "rebirth" of CRA might be in the future, but that doesn't solve the issue that has been plaguing new react users: being told to work with a buggy and restrictive starter template. Look at the amount of issues on this repo. So many of them are new people not being able to even run CRA. So many of these people give up on React due to their experience with CRA.

This repo needs to be deprecated. Maybe it can come back if there is an RFC or "rebirth" that was completed and ready to be shipped, but until then, it needs to be clear that this repo shouldn't be used.

[VenomFate-619]

we need this package, it is very useful for the beginner to set up the react and learn react not any framework. If we go to start a new react project page they directly mention use a framework to build react project, so now the beginner will be confused about what needs to be learned first framework or ReactJs.

[getsalty]

we need this package, it is very useful for the beginner to set up the react and learn react not any framework. If we go to start a new react project page they directly mention use a framework to build react project, so now the beginner will be confused about what needs to be learned first framework or ReactJs.

Quick Edit: Hey I know I kind of wrote a novel here, and added a good chunk of pictures, but I have seen this "CRA is useful for beginners to learn React" line thrown around a lot and I really wanted to try to show the issue with it in the simplest way possible. I appreciate everyone who reads this and if you think I am wrong in any way, I am more than willing to hear you out. I always want to learn more and refine my perspective on situations.

---

I kind of agree, but I think the documentation goes over this. There is a difference between learning react and building an actual project you care about. The react docs now have lots of build in sandbox examples/lessons for people to be able to experiment on. They also link to online sandbox environments for people to play around and learn with. Being able to go to a sandbox environment that you can save and come back to later (accessible on any computer) is simply a lot easier than having to download a template, install the modules through either npm, yarn, or pnpm, and then have to do it again if you need to access the code outside of that one machine you are using.

Back when I was in college, I had to use the library computers a lot and did not have access to my PC. I ended up remoting into my PC from the library computers, but that took work that many people don't initially think about doing. How easy is it now that we can just go to a sandbox website, save a project for free, and then just go to that website at the library to continue working? This is the same thing as Microsoft Word vs Google Docs. One is online, easily accessible, and sharable. The only is installed locally and can be a pain to collaborate with others on. This is why the React team recommends using online sandbox environments for learning/playing around:

Now I think there is a major point that makes me slightly hesitant to recommend any SPA template - React is moving away from SPAs. The past year or so, the React team has been working hard on finishing up RFCs that relate to Server Components. This is the main RFC, but there are many other supplemental ones like this RFC. The reality is that just like Hooks shook up the React ecosystem and really helped React as a whole, Server Components are going to do the same thing. React is going into a direction of having both Client and Server Components intermingling and making up the application. I say this because Server Components are not compatible with SPAs. Create React App is an SPA template. As it is now, people who learn from Create React App are going to only learn a subsection about what React offers. And what is worse, is that people are creatures of habit. When we learn to do something one way, we don't always want to change that. So limiting the scope of potential knowledge for a beginner could lead to bad or outdated habits.

Examples of why CRA is bad for beginners:

Lastly, why do you think CRA is good for beginners? It is very narrow minded in the sense that it offers very little to the user at the beginning. Sure it builds the project, allows for a dev mode with HMR, and has environment variables set up, but that's mainly it. Literally every solution offers that as a base. What happens when you want to add another page to a CRA project? Now you have to learn a router package. Which one? Time to research packages.

CRA 1 example:

So the person types into Google "react add new url for page" because they don't know the term "router" yet. Sure enough a tutorial pops up for React Router.

Edit: real quick, just wanted to make sure this example was 1-to-1 with its counterpart below, so I changed the search criteria to "create react app add new url for page". It still resulted in the same search results as above:

Lets look at the tutorial,

1. First they are using "yarn". Wtf is yarn? Is it like npm? How do I get it? In the other tutorial from 2016, I was told to use npm. Is it the same? "npm add react-router-dom" isn't working.
2. What is up with Bulma? Now we are bringing in something called Bulma. Do I need to learn that to make the url work?
3. This tutorial is from 2020. Is it outdated? I don't know.

NextJS example:

Now lets looks at the same issue, but lets assume the user is now using NextJS instead of CRA. Type in "nextjs add new url for page". On my end, Google looks like this:

Great. Lets look at the top link.

Oh it says to click on the Router documentation before reading further. Lets click the link.

1. Oh, now I have an official tutorial by the same framework devs that I am using. It goes over literally everything I need to know (without installing new packages). I can learn a new concept called Routing without running into a issues not related to Routing.

CRA 2 example (aka the Try To Show CRA In The Best Light example):

Now for this last example, I am going to be as nice to Create React App as I can. Lets do the same issue (I want to learn about Routers and creating a new Route to a component), but now I know that the concept is called Routing and I decide to look through the Create React App's documentation website instead of using Google.

Oh hey, I found the Routing page on CRA's website:

Great. It has an npm command I can use to install and it has a yarn command that seems to be the equivalent. How handy! I learned something new already :) . I also see a link at the top telling me to use React Router. Let me click on it and learn about React Router.

Oh great. Seems like they moved, lets click on the new link.

Cool! Looks like this is the website. Let me quickly bring up the other link though. On the CRA page, it said that "The Basic Example is a good place to get started." So I learn better looking directly at code, so lets quickly click on the example link and if I run into anything hard, I will jump back to the official React Router page in my 2nd tab and read on up the issue.

Oh. Ok well the example link clearly goes to an example (I hovered over the link and saw the URL before clicking), but I am running into the same issue as before. Let me just click this new link and see where it takes me.

Great... back at the React Router website. Ok. So no examples for me. Let me at least click on the Tutorial section and see if I can add it to my app that way.

Wait... Wtf is Vite??? I am using CRA and now this tells me to use Vite? Can that fit into CRA? Now I need to research Vite (or go back to CRA 1 Example and follow that process).

---

I know I wrote a lot, but I am trying to show the issues in the easiest way possible. If a user is truly a beginner, just use online sandboxing sites. It provides everything that CRA did in terms of learning. If a user is going past the barebone basics (like setting up Routing), then CRA isn't the easiest solution for them. It will cause headaches and make people want to leave the React ecosystem. Using CRA burns out new react developers - it hurts more than it helps.

With all that said, if you want a almost 1-to-1 replace of CRA, but one that is actually being updated and has far more opportunities of growing your knowledge and project, use Vite. But if you want to make sure you are learning all the features of React (including the new Server Components), your best bet is to migrate from an online sandbox to one of the Frameworks that the React Devs suggest.

[nickserv]

@loren138 This is the closest thing we have to an official roadmap for create-react-app at this point: https://github.com/reactjs/react.dev/pull/5487#issuecomment-1409720741

To summarize, it will become a launcher for other recommended tools, rather than being a standalone tool.

[loren138]

I think React playgrounds in web-browsers are a potential alternative for getting starting learning to build/use components. The problem is that websites come and go really regularly so writing a tutorial that lives for year(s) based on the UI of something like react.new might work and be free today, have a different UI tomorrow, and become paid later.

In spite of the "issues" of being really infrequent to update, that was also a real benefit for the longevity of books and tutorials based on CRA.

[loren138]

Dan Abramov posted a thread on twitter that seems to answer this: https://twitter.com/dan_abramov/status/1636827365677383700

Posting a little bit of it:

when i was thinking about possible futures for Create React App, it was clear client-only doesn’t make sense. way too limiting.

why are we always producing an empty HTML file if React can pre-render to HTML? why can’t i make a blog by map()ing over markdown files on my disk?

....

here’s the thing.

the current crop of modern frameworks (specifically, Next.js and Gatsby) already work this way.

they let you start 100% static + client. HTML generation, file-based routing, SPA navigations, and real client code (as much as you like). that’s the baseline.

however, if you do want to use the server for some dynamic route — like, reading from a DB instead of a file — they let you do that easily. you just change a couple of lines of code. your existing pages remain static/client.

frameworks provide LESS LOCK-IN in that sense.

so i realized that building this would just building a more limited version of what Next.js/Gatsby already have to offer. it would do exactly the same things they already do, but would not allow you to do more.

modern frameworks are hybrid. they let you build SPAs and more.

...

My summary, is CRA is dead because what he'd like to build is essentially what next.js and Gatsby already are.

[loren138]

Appears I was wrong in my assumption based on this reddit post: https://www.reddit.com/r/reactjs/comments/11u1r3w/comment/jcmimez/?utm_source=share&utm_medium=web2x&context=3

Our current plan is to make it a launcher for the recommended solutions. See https://github.com/reactjs/reactjs.org/pull/5487#issuecomment-1409720741 for (a lot of) context.

[rwieruch]

@loren138 found this post by accident. If you mean The Road to React by "printed book", it has moved on to Vite in its late 2022 edition. However, as we see now, the React team sees it differently and wants to move more towards frameworks/SSR. Anyway, for what it's worth, I just wrote a blog post today about the whole starter project discussion if it helps!

[loren138]

Nope, it's actually my/my company's book https://www.amazon.com/React-Programming-Ranch-Guide-Guides/dp/0137901763/

[fkirc]

I fully agree with the analysis of @getsalty ! Although I started to learn create-react-app without any pre-experience, I was running quickly into several limitations. Now that I have a few years of React-experience, I am glad that more modern options are available.

More generally, I think it would be irresponsible to recommend a dead (or undead) framework to new developers, even if the framework still has many downloads.