Open Kenramiscal1106 opened 2 years ago
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).
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.
Nextjs, I think, can also do spa, but it's gonna take a little configuration to do.
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.
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
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:
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:
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