Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Why is create-react-app still used by many? Very important #12628

Open
Kenramiscal1106 opened this issue Aug 2, 2022 · 5 comments
Open

Why is create-react-app still used by many? Very important #12628

Kenramiscal1106 opened this issue Aug 2, 2022 · 5 comments

Comments

@Kenramiscal1106
Copy link

Kenramiscal1106 commented Aug 2, 2022

Disclaimer: It's not my intent to offend the maintainers of create-react-app, but tools are evolving and it's no doubt that people (who uses newer tools like nextjs or vite) will also ask this question.

tl;dr

With numerous problems encountered by people in using create-react-app, why are there still many people who are using it?
It doesn't even have features like hot module reloading and it forces a bunch of testing packages.
I think that cra isn't a viable option to be used by a bunch of new developers nowadays unless you think that create-react-app is more convenient (which is actually not).

Here are 3 alternatives for cra:

1. Vite (Amateur to advanced)

So if a bunch of new devs read this issue, I would really recommend you switch to vite. Not only does vite have hot module replacement, it also simplifies making a react app (no testing libraries and such included in starter project).

To get started at using it, run one of the following command depending on what package manager you use:

# npm 6.x
npm create vite@latest my-react-app --template react

# npm 7+, extra double-dash is needed:
npm create vite@latest my-react-app -- --template react

# yarn
yarn create vite my-react-app --template react

# pnpm
pnpm create vite my-react-app --template react

Follow the instructions after running command and you have a react app with hmr enabled. Official documentation

For people who are building single page apps by default, this is a good option because as soon as your app grows in complexity, the rebundling of dependencies becomes longer, and therefore, decreased productivity.

2. Next.js (Level: Intermediate to advanced)

Aside from hot module reloading, nextjs supports a bunch of rendering patterns like server-side rendering, incremental static regeneration, static site generation, and also client-side rendering.

The option to process everything on the server instead of the client gives the application search engine optimization

To get started, run:

npx create-next-app@latest
# or
yarn create next-app
# or
pnpm create next-app

And you have an application that can be indexed by google search and will be visible to many. More on Next.js Official documentation

3. Remix (Level: Intermediate to advanced)

Sometimes, project requirements are a lot bigger than what nextjs can offer. And for that, remix is the option.

Even though remix only supports client-side rendering and server-side rendering, remix has nested layouts.

So instead of rendering the entire page when redirected with a link, remix only renders on part of the ui. This is great for dashboard-style applications.

To start a remix project, run:
npx create-remix@latest
And answer a bunch of questions to scaffold your app. more information Remix documentation

@ex-tag
Copy link

ex-tag commented Aug 8, 2022

With Meta's recent official support of Rust, I think it would be good to have a CRA v2.0 - built on Rust. Which would replace Node.js with Deno (https://deno.land), and Webpack with a Rust version similar to esBuild (https://esbuild.github.io).

@PeterNelsonT
Copy link

Does remix allow creating CSR SPA? Also nextjs is mainly meant for SSR, not a full CSR SPA.
If I have to create a CSR SPA, CRA or vite or custom config is the main choices. And custom config takes a whole lot of time unless done by advanced devs. Vite seems to have issues with some of the react packages like CKEditor, so CRA seems the viable solution for now in many cases. Though its really slow as project grows.

@Kenramiscal1106
Copy link
Author

Nextjs, I think, can also do spa, but it's gonna take a little configuration to do.

@ivnsch
Copy link

ivnsch commented Aug 16, 2022

Thanks for writing this! Here it was also mentioned that CRA seems not to be maintained anymore and I didn't know what to use instead.

@tresorama
Copy link

Thank for writing this.
Today I scaffolded a turporepo monorepo with pnpm, and when attempting to create a cra app with

pnpm create react-app my-app

i got this error

npm ERR! Cannot read properties of null (reading 'matches')

Tried with

pnpm create vite my-app

add all worked

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants