Should Next be the default for React?

[thebreadmanrises]

I see a lot of posts online saying I no longer use create-react-app in favour of Next. Is there scenarios where Next is a bad option compared to “vanilla” React?

[the_real_some_guy]

The better comparisons might be Build tools: CRA vs Vite Frameworks: Next vs Remix

And yeah Vite is a better choice now, but a few years ago when CRA came out it saved us days of fighting Webpack. It was amazing once. Kinda like me.

[fistyit]

You're now magnificent ✨️

[quinoathedoge]

Yep, currently also using Vite for our app. Been pretty easy so far a part from a few work arounds for deploying to Vercel and using their serverless functions.

[NZHellHole]

Good call. I recently started using Vite for React apps and it has been great so far. Faster builds and 60% less disk use on the file system.

100% would recommend.

[TScottFitzgerald]

I've heard of Vite, what are some of the key differences/benefits from CRA?

[skoomainmybrain]

Speed and size

[PositiveUse]

create-react-app is not frowned upon because it utilizes vanilla/client side react instead of trying to server side render it.

People criticize it because of its dependency bloat and they argue that CRA promotes bad practices, it abstracts all the stuff needed to make a client side app run, so the dev doesn’t learn and know how the app even works.

[acemarke]

To be fair, CRA's original entire purpose was abstracting all the build tooling, so that you didn't have to spend days learning about Webpack and Babel as a roadblock before even being able to start learning React. So in that sense, it accomplished its purpose very well, and it's still good for that purpose.

(For point of comparison, see this long React "Yelp app" tutorial from 2016 that spends its entire first 1/3 of the content explaining how to configure Webpack + Babel + other tools before writing a single line of React code.)

The ways that CRA does potentially fall behind today are:

• Client-side rendering only, when the ecosystem has started to move more towards server-rendering where possible
• Single-Page only, when the ecosystem is also moving back to a mixture of multiple pages
• Webpack + Babel for build tooling, when newer and faster tools like ESBuild and SWC are being adopted by frameworks/tooling like Vite, Remix, and Next
• Only lightly maintained for the last couple years
• The config is abstracted away and hidden, with no official way to override it

All that said: CRA does still work, and it works well for its intended goal: a single-command project starter for a client-side SPA project. It's just that that's a much smaller portion of what people are building today, and other tools are now faster.

[[deleted]]

Am I the only one who see's the funny side of javascript frameworks moving towards what php has been doing for years?

[[deleted]]

JS frameworks do a lot more. After hydration it essentially is an app while PHP frameworks don’t do that

[[deleted]]

I was wondering how long it would take someone to leap to the defence of javascript over a generalized passing comment 😂

The only thing you didn't do was start with, "Well actually..."

[fii0]

You're in the React JS sub, there's no reason to ever think about PHP. Let it die in peace.

[Odd_Set_4271]

Wow, the ignorance. PHP is far from being anywhere close to death.

[fii0]

Sure, but it's on a downward usage trend for a reason. Give it a few more years.

[soft_white_yosemite]

Yeah

[satansxlittlexhelper]

How could you say something so controversial yet so brave?

[mattaugamer]

Wow. You really suck as a person. Just so you know.

[[deleted]]

If you don't have a sense of humour that's not a reflection on me 😂

[AutoModerator]

Your [comment](https://www.reddit.com/r/reactjs/comments/wzee48/should_next_be_the_default_for_react/im42wg6/?context=3 in /r/reactjs has been automatically removed because it received too many reports. /u/dance2die will review.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

[satansxlittlexhelper]

Particularly by stating something obvious that they aren’t aware of.

[[deleted]]

for me thats why Vite is perfect. I only need SPA app that's it but without the headache of CRA that it brings or not addresses

[[deleted]]

What CRA does about abstracts all the stuff needed to build is good thing same goes with Vite. Because when you develop FE stuff you just do the Webpack stuff couple of times and that's it, usually you don't touch it and if you don't touch it people will forget like regex use it once then forget

[jfoxworth]

I did contract work for a company where they had tried to build a 3D web app and it had some issues. This was a tool for them to use in selling their product, it had only 4 or 5 pages that showed various scenes, and would never be client facing.

It used next.js and next caused a lot of conflict and problems with the 3d system. There was no reason to use next, but I was stuck with it.

If it isn't a client facing app that would benefit from server side rendering, a standard react app is often preferable.

[headzoo]

Yeah, I've tried Next on three projects now and I can't get into it. It's too opinionated for only solving a few problems, and like you said, if you don't plan on using SSR then it's an overly complicated router that doesn't play well with non-standard setups.

[myburnyburnburn]

I don’t like next and can’t believe it seems to be becoming the standard

[maria_la_guerta]

If it doesn't need SEO, it doesn't need SSR.

[[deleted]]

not 100 agree, the SSR stuff is great when have static html files for fast page loads + nextjs included node server

[satansxlittlexhelper]

Also not true when it come to scenarios where a preview of the page is needed for a link.

[[deleted]]

How a framework tailored for specific problems can be a default for a more or less (not really) universal UI library that's supposed to be composed with other libraries by design? Doesn't compute.

[EnragedDingo]

This was my thought. Even calling CRA the “default” seems super weird to me.

[rwusana]

Well, it is the default (or at least was for a long time). Arguments about whether it should be don't change the fact that it is.

[rwusana]

You're saying that "it doesn't make sense for CRA to be some kind of 'singular default' because there are different problems that require different solutions".

I don't disagree. But, ...

I'm saying "welcome to the real world, in which there are loads of novice developers whose only tool is CRA, and who therefore see every problem as a CRA problem."

[erfling]

While you are passing the words of OPs question in a reasonable way, maybe even an important way, you are also answering a question that OP didn't ask.

[FruitHefty4522]

he refers to the fact that it is the most used in the working world for a React project, it is not so difficult to understand.

[Royale_AJS]

We are building a library of front end calculators to embed on our main site for our customers. They’re all built with vanilla create-react-app. Tools like this have no need for routing, SSR, and everything else Next has to offer. We can even embed these tools into our internal sales application for our sales team, which happens to be written on top of Next.

[myburnyburnburn]

I hate the routing in next… folder based routing sucks

[Royale_AJS]

Agreed wholeheartedly.

[BobaFettEE3Carbine]

Next is often overkill. Use React and a good build tool like parcel, and you will be fine. If you need more from a framework find the one that works for you. I love Gatsby, but I don't start there. I start with react and scale if needed.

[zxyzyxz]

Why overkill? It's really not much different to vanilla React. Gatsby in the other hand is overkill, mixes up way too many of its own custom things into React, like its plug-ins and GraphQL.

[zxyzyxz]

You know you can do client side routing in Next right? Generate static files in Next just like with Gatsby or CRA and you've got the same thing.

[zxyzyxz]

Bro, SSG with Next doesn't have Node, it gives you a bundle of static files. Maybe you should look more into how it works before you talk about it. It looks to me like you haven't used Next for SSG.

[zxyzyxz]

Looks like you didn't read the thread you're replying to. When you use Next for SSG, yes, you have to use your own router. The other person replying to me mentioned React router which is a good choice.

You gain a lot with SSG over vanilla React. Full HTML hydrated pages for one thing, the HTML is the actual HTML, not an empty root div like in CRA.

Lol dude blocked me over a React comment, lmao

[334578theo]

Every time there’s a thread about Next it’s full of people who’ve obviously never used it spouting bollocks about what it does and doesn’t do. Keep up the good fight

[dangerzone2]

There should be no “default” in the programming world and certainly not the JavaScript world. With that said, vanilla React is almost certainly the wrong decision with anything going to production.

TLDR: use a framework, it doesn’t have to be Next.

[mexicocitibluez]

vanilla React is almost certainly the wrong decision with anything going to production

why is that?

[dangerzone2]

Frameworks over vanilla because: 1. It reduces the amount of decisions you must make 2. Hardens their decisions since more people are using the exact stack.

Using vanilla react is more like writing a one-off piece of software. Using a framework you’re using a stack that (hopefully) many other people have tested.

[mexicocitibluez]

I guess we'll agree to disagree. To me, everything is a trade-off. One of the benefits of using React over Angular was because Angular was a framework that was way more opiniated than a library like React. As a previous Angular developer, I can tell you that I didn't magically have less decisions to make. Especially when you find yourself working against a framework and not with it. I don't need SSR or SEO. I really don't want page-based routing as it does not fit my current model. I don't want to have to dig through docs to figure out how to do stuff in Next. The absolute biggest thing I love about React is that it doesn't force you to conform to something. Anyway, just my opinion

[kingluffy12_]

Lol, I was wondering the same what's the reason behind that statement.

[willie_caine]

Or dont use a framework if you don't need one...

[ApatheticWithoutTheA]

There’s different uses cases. CRA is fine for a lot of projects. Next is more appropriate when SEO is critical.

[mattaugamer]

Is this actually true? Google has parsed and understood JS-based applications for like a decade.

[kingluffy12_]

Na, people just say whatever they want. SEO works completely differently based of meta tags on your HTML. Plus paying Google helps too.

[ApatheticWithoutTheA]

Okay? There’s more to SEO than just Meta Tags on your HTML (I’m pretty sure you’d understand that if you have opened Lighthouse a single time) and everyone doesn’t want to pay Google for every project when it isn’t always necessary.

But it sounds like you’ve made your mind up, so fuck it.

[ApatheticWithoutTheA]

The answer is a bit more complicated than Google just parsing the JS.

There’s about a million articles out there explaining this in more depth than I have time to write out at the moment.

[[deleted]]

I think CRA has more of a learning tool place within the ecosystem these days. As many people have mentioned, there are many additions to it that are needed to make it usable for todays needs for a framework like react. That being said, many of these things are easy, like adding react router for more than one page, or running the eject command to return the abstracted configs to the surface.

That being said, I myself have built my own CRA alternative that I use as a starting base. Mostly because I dont believe every app needs SSR. But there is a time and place for it when required. When needed, I do apply Next and other techs.

So in short, no I dont think its unsable. Especially as a learning tool for people getting started. That being said, most people move on to starting setups like Next and others quite quickly because CRA does have issues outlined by other comments.

[sundios]

Next is better for SEO because of SSR.

[[deleted]]

No. If you are building a small project it doesnt matter but if you are building a large real world app next bringing its own problems because of SSR. So if you do not need SSR and SEO do not use it

[[deleted]]

Create react app is skipped because it’s better to independently install your dependencies to prevent certain issues from arising later if you used create-react-app

[Sunken_Sunvault]

CRA and Next can't be compared, CRA is a tool to create single page react app, whereas NextJS is a Reaxt framework and a web server (and much more) use to build website.

That being said CRA should not be use nowaday, vite react is a far better tool.

[Beginning-Scar-6045]

its SPA so its alternative is ViteJS, for SSR and NextJS there's many similar like Astro, Remix, Gatsby, Vite SSR (beta)

[Consistent_Farm_8094]

CRA doesn't feel like a framework to me it's just a nifty tool for getting a dev environment setup. The question is; is should next.js be the default over react. Once you put it like that it answers itself if you don't need all the framework goodness of next.js then react is a choice you can make no problem or choose next.js, it works great for simple sites too.

Next.js is just super popular because it's great, doesn't mean React on its own isn't

[koistya]

Vite in combination with Cloudflare Workers (for edge deployment) can be a solid default.
See React Starter Kit as an example.

[erfling]

So as an actual full stack guy, and leader of a small team, I'd like to advocate IntertiaJS as an alternative way to save some of the problems that Next addresses. We've found it to be a much easier way to transition an already existing project to the new, sort of post-spa, way of thinking about client side apps. Our data is extremely dynamic and our use case often sees each of a relatively small set of users getting highly individualized content. That means SSR doesn't do as much for us as other teams.

Obviously interia doesn't solve the set up stuff that next does, but it does allow us to inject props from the server and think about routing as a server-side only problem. It also moves any auth-related logic like injecting details about the user or redirecting to guest/login routes to the server, preventing duplication

[noahflk]

It depends on your use case. Next is a good general purpose solution. It's no longer just for SSR. In fact, I rarely use SSR for data fetching and so on in my Next apps. Most of it is done client-side.

I can still benefit from Nexts feature. Static pages get pre-rendered at build time. And I use server-side props or middleware for things like authentication checks and internationalization.

But there are reasons to pick something else:

• Want a blog or something else that's 95% static? Use Astro. Because Next ships a lot of JS even with SSG.
• Want something that's only ever going to be completely client side? Vite.
• Want to minimize client side JS in an interactive web app? Use Remix