create-react-app
create-react-app copied to clipboard
Why is create-react-app still used by many? Very important
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 question to scaffold your app. more information Remix documentation