ReactJS or NextJS

Should you learn ReactJS or NextJS? What is the difference between NextJS and ReactJS? How do they relate to each other? What value does NextJS add? Learn about all of this, in a minute.
#shorts

[@StabilDEV]

Create React App is deprecated

[@purposeneverdie]

Is it worth learning Next.js right away instead of React? I literally started diving into React just 3 days ago.

[@StabilDEV]

@@purposeneverdie do the basic react tutorial then get started with next

[@Endrit719]

no it's not, it's just not the default way recommended by react team of creating a new react app anymore

[@alaskandonut]

Vite is the way now.

[@bobDotJS]

Vite, not CRA. Never CRA, but Next is overkill sometimes

[@immiketyson]

I use cra

[@ExquisiteSquid]

Don't ​@@immiketyson

[@immiketyson]

@@ExquisiteSquid what if I do, Jimmy?

[@andrewgora5446]

@@immiketysonmy dad walked out when he saw me using CRA

[@immiketyson]

@@andrewgora5446 my dad brought the milk when I stopped using vite. My dog ate my project when I was using vite.

[@ibrahimm.6803]

Short, but the message extremely powerful.

[@tasin5541]

Would you prefer NextJs over vanilla react for apps that have a lot of client side interactions with forms?

[@thehumancarrot2944]

Always go with nextJS instead of plain react, with server side rendering adding meta data will be much easier than using React+node backed

[@tasin5541]

@@thehumancarrot2944 In cases where the app will be for internal use, I would prefer vite over NextJs. We do not need seo/metadata for these apps. Everything will be hidden under authentication.

[@userre85]

Also seo optimization

[@BradySie-wo6vf]

@@thehumancarrot2944yess!

[@xxXAsuraXxx]

I guess it depends on the needs. My company has micro site and next js wasn’t suited

[@kikevanegazz325]

It seems as though the reason to choose either is whether the programmer is professional or want to seem professional, and the truth is that many apps don't require server-side rendering.

[@avigaillaing]

These videos help me so much

[@rapelangmathibe8761]

When i started learning react i found myself learning things like ionic and gatsby simply because i was looking to understand routing

[@omrtheater7244]

Not to sound rude, but the question which one to use wasn't really answered. Obviously SEO is Next's biggest real advantage but other than this, it's just an opinionated React with SSR/SSG capabilities. You can just install react router for example instead of using Next's built-in router management. I saw you mention Security at a different comment, but if you build the back-end, this is where you can make it very secure. So I still don't understand the advantage. To me, if you need SEO go with Next.js. If not, then why else would you?

[@alaskandonut]

Only because it’s a bit of a bad question… when you use Next, you’re using React. So should you use create-react-app or Next? Don’t use CRA at all, it’s deprecated. If you want to use Vite, you can and you may not need the Next bells and whistles. With Vite, you’ll implement a router, state management, and whatever else Next handles.

[@omrtheater7244]

@@alaskandonut
No dude. You could use Vite or something else, when you use SSR/SSG frameworks like Next.js, you're actually COMPROMISING speed, so my original point was: if you don't really need SEO, there's really no other significant advantage over plain React.

[@harryzachariou1]

I often ponder the use case for either, there isn’t many options for cheap self hosting of nextJS you’ll end up using vercel or netlify, I’ve seen some implementations with lambda at edge with AWS but they never support the latest nextJS version

[@punkweb]

If we're moving away from SPAs, at this point why use Nextjs at all instead of just using something like Django, Rails, Laravel, etc? You know, frameworks that actually have their shit together.

[@imnash21]

I used React JS with Laravel (Inertia JS)

[@alexander_ci]

Another part should also be flexibility and extensibility.
These words are thrown around a bunch, but a real situation I encountered recently was specific AWS front end libraries not working with Next.js because of non native Next support for AWS-CRT (common runtime).
Trying to deal with polyfills and aws-crt (which basically tries to bundle Node functionality that is natively supported in the browser) was a nightmare. The current solution is downloading binaries written in C into your node_modules. Nextjs says they have experimental support for aws-crt but it’s not fully there.
So forced my hand on using React built with Vite

[@andrewmartinez8340]

Correct me if I'm wrong but with next js, you'll have to pay for servers just to render html pages? Why not just go MVC from the backend?

[@jherr]

Security is often a concern. And it's pretty common for folks to equate SSR with SEO, but it's a little more nuanced than SSR == SEO.

[@truthalwaysprevails662]

@@jherr This SSR=SEO. You are absolutely correct. Many developers blindly live by this formula

[@vaiterius]

Do a video on Astro

[@alfathizha4615]

Use vite ,if it's just a single page,never use CRA

[@Thassalocracy]

I get that NextJS is the hot favorite in town right now, but Remix seems like a strong competitor.

[@jherr]

I like Remix. I think it's cool. But in terms of usage, Gatsby would be the next biggest React framework, AFAIK.

[@emmanuelo1177]

@@jherr Welcome to 2024 and beyond...NextJS won.

[@sportssky3399]

Almost 14 years back, vendors of javascript, convinced the developers to leave .net, php, java, as server side rendering was slow, and adopt js-techs as they were called fast client rendered. And now again misleading and trying to adopt server side rendering through js frame works. What is this nonsense.

[@jherr]

As I recall the selling point was that Node was single threaded but natively asynchronous, allowing it to handle multiple requests simultaneously in a single process and thus requiring less servers.
At that time applications were structured very similarly to PHP/jQuery. It wasn't until React, and really Next, that we talked about isomorphism and symmetric rendering on the client and the server. And that was ~7 years ago.
Before the isomorphism and Next talk there was React and Angular competing with Ember, Backbone, etc. on the client. And the argument there was that React and Angular were natively component frameworks that encouraged reuse and composition.

[@GoCoolDebug]

To the point

[@LarsRyeJeppesen]

Vue or Angular ;)..

[@Sporadics247]

..."I think the question is should I be writing create react app or next js?"...I spent the past two days thinking about this and I'm beginning to think again I suck at coding cos most video resource are not answering the right question and you just asked just that and also answered. Thank you so much for this!

[@shrin210]

But we used Vite with Reactjs 😂

[@Sporadics247]

@@shrin210 😃

[@VigneshGawali]

Should u learn react then nextjs or go directly for nextjs

[@jherr]

I would learn React and then learn NextJS. Certainly the App Router presents an extraordinary amount of complexity.

[@VigneshGawali]

@@jherr thanks I'll be get started with React

[@felipefs106]

what about Astro? seems much more flexible

[@anthonysmith3450]

I don’t understand why CRA is always described by saying “single page application”. You can have more than one page with CRA. Why do people say this?

[@jherr]

Because it's a single page that is virtually serving many routes by doing browser history hacking. When you deploy it you have to use some web server routing hijinks to forward the URL requests back to the single page. This is one of the things that CRA does for you that most folks don't realize.

[@JLarky]

​@@jherr so does next.js :) it also virtually serves different pages even though you opened just one page on your first page load :)

[@maskedvillainai]

Except native compiling.

[@mr-moses-01]

Just alone, react library is just for state managment...
Isn't right sir ?

[@jherr]

Its job is to use components to synchronize state with a DOM.

[@mr-moses-01]

​@@jherr yeah but react native uses react too...
I just want to clarify it in my head :D
mobile app don't have dom

[@jherr]

@@mr-moses-01 In both cases React is producing a component tree. In the case of react for the web, that tree is used to produce a DOM. In native it's used to produce a tree of native views. Either way the "nodes" are objects and the tree can be thought of as an object model. So yes, to be more precise, the React core converts state into an object/component tree using components.

[@sonny5497]

remix is miles ahead of nextjs in terms of developer experience for react devs. nextjs 14 dev sever is painfully slow! and the client / server components mental model is exhausting.

[@artemzakunts6372]

But I can’t learn NextJs without knowledge of React?

[@jherr]

No. NextJS is built on top of React. This is like asking can you learn Qwik-city without Qwik, Solid-Start without Solid, Nuxt without Vue, etc.

[@TwitchRadio]

Love next.Js...😎👍

[@thalibmuhammad9519]

i choose next js for 2 years on my career, i never have requirement to go with CRA

[@adityayads]

You can't learn next js if you don't know react js

[@mountakhabi]

NextJS 13 is the next move

[@konstantinpodgaets2313]

You not help to understand(

[@bunny.rider69]

tu ganda chhe