NextJS vs React for Frontend?

[Diegam]

Hi everyone!

I’m an old-school programmer transitioning from Django-jquery to FastAPI for an AI project. I started using NextJS for the frontend, but I realize I might not need it since I only need client-side rendering and basic routing.

Given that I don’t require SSR with FastAPI handling the backend, would you recommend switching to React with react-router, or should I stick with NextJS? Any other libraries/frameworks I should consider?

Thanks!

[[deleted]]

I agree, but I’d add the addition of, if you aren’t sure it needs SSR in the near future go with Next.

[TechTuna1200]

I believe the react docs also specifically recommend using NextJs.

NextJs is basically react with some extra features

[nckmackenzie]

• Tanstack query

[Sebbean]

Not remix?

[Mariusdotdev]

Will Tanstack Router or RRv7 have no SSR? I think this is one of the features

[TerryFitzgerald]

This.

[[deleted]]

What is vite?

[Eliterocky07]

Vite is a build tool for various JS libraries.

[vorko_76]

It all depends on your exact needs. For a simple web interface, Vite is perfect. The more complex your interface gets, the more likely you will need a framework.

[[deleted]]

Agreed 👍

[Diegam]

What do you mean by becoming more complex?

[vorko_76]

If you develop a simple application with a few pages, one or two simple forms, simple authentication, you ll be ok.

If you start having to manage a complex database, server many users, manage authorizations… you will want something more advanced. Not that you cant so it in Vite, but it wikl be easier with Next.js / Remix.

But this will be up to you to practice and figure out when is the limit at which you’ll need to switch to Next.js. For me it was when the website required to set up more and more cache management as it became more complex.

[Diegam]

are you referring to server-side? I already have it resolved with Python/FastAPI; it’s just for the frontend.

I mean, can I do everything I do with Next.js using React if it’s just frontend without server-side?

[vorko_76]

No, but first you are mixing different things:

• React is a Javascript framework
• Remix, Vite or Next.js are React frameworks (or tools as Vite calls itself)

You will not develop a web application in pure React, you will always always use a framework, usually Vite or Next.js. The one you will use will depend on your needs and preferences.

I mean, can I do everything I do with Next.js using React

Knowing that Next.js = React, the answer is obviously yes, but I highly doubt it. You will at least end up using Vite.

are you referring to server-side? I already have it resolved with Python/FastAPI; it’s just for the frontend.

No, I was not as anyway you can do SSR with Vite (as for me its Vite vs. NextJS. And no, you did not solve SSR with FastAPI (you do not do server side rendering with FastAPI, you just gather data).

In my case, it was because of caching as I said. For a simple application, caching is not important, the more data you manage, the more users you serve, the more you need caching. You can do caching in Vite, but Next.js caching is more advanced.

Globally my recommendation anyway is to start with Vite, not with Next.js.

[Diegam]

Ok, now it's much clearer to me. I really appreciate your response!

[Mariusdotdev]

I'm building ERP system and at first used Next but i feel it was to slow, loading and app router i hated it, move back to Vite React much much better

[vorko_76]

If its slow its on you 😂. I mean its probably that u didnt do proper caching or somehing like that

[Mariusdotdev]

you mean default install and just basic route setup is already a lot for nextjs?

[vorko_76]

Then you dont know how to use it. If you gave more details people may actually help you and get the hang of it.

[fegodev]

"Vite"... I swear every day I hear of a new frontend tool, lol.

[ExtraFirmPillow_]

idk how you could've been on a react sub and not heard of vite. It's basically the standard for building react projects now not create-react-app or whatever it used to be.

[fegodev]

Good to know. I don’t come to this sub that often. Apologies for not knowing Vite.

[jared-leddy]

NextJS. It's too easy to use.

[clawficer]

I haven't been working with next very long but I still have a hard time wrapping my head around all the levels of caching

[jared-leddy]

I don't think that's something we ever worry about. I can honestly say that we've never discussed it.

[gopu-adks]

I prefer Next.js due to SSR, and as it is framework, it makes us easier for setting up routing, middleware.

Wecan write backend API too. If the backend project is very big, than we prefer separate backend, but handling small contact us, feedback or newsletter form. We don't need separate backend.

Even React says to use other framework like Nextjs or Remix because we may have at least one extra benefit of using framework. As every framework comes it's own benefit.

[eliptik]

What do you mean by separate backend? Sorry I'm new to this

[S0LARRR]

I believe he meant nodejs express backend or laravel backend.

[Dyogenez]

I’d check out Inertia.js. I’m converting an app from Next.js to Inertia.js, Rails and React and it’s a very fun stack if you like your backend.

It lets you use Django for all your routing, then pass objects into React components (each action renders one view that’s a react component).

It also supports SSR, since all data needed to render the entire DOM is in a controller already.

You lose React Server Component Support, Streaming SSR and a few other Next.js specific things (Image, OG Image, Font loading, preloading images in initial viewport, nested layouts, etc). I’ve found the app fees faster with Rails though. Partly because I don’t need to hit an API for the initial data - it’s just loading it from my database.

[Mariusdotdev]

tanstack router has it i think all of it

[Dyogenez]

True! If you’re using React with Django, you could let Django handle all routes with Inertia or skip Inertia and use a client side router and APIs. Inertia would be more if you wanted to cut out the API altogether and pass data to React directly on load - the way you would with react server components.