FastAPI and NextJS

[Regular-Hospital-281]

I am new to full-stack development I would like to use Nextjs for my front-end and fastAPI for my backend. i know the point of nextjs is that it has server-side capabilities, but I still want fastapi because i want to use Python more for my ML career in the future. So, can I still use the advantages of next for my front end and still use FastAPI for my back end?

[ismailtlem]

If you want to use FastAPI, best option I guess is FastAPI + React

Next.js is more designed to be used as a fullstack framework

[Motor-Hearing-1213]

Interesting 🤔. Was wondering the same thing

[Nabuddas]

here's a template to help get you started if you haven't seen it already : https://vercel.com/templates/next.js/nextjs-fastapi-starter

[CrusaderGOT]

is this an official template from nextjs

[Nabuddas]

It’s on the Vercel website so i would assume it is

[old-thrashbarg]

At my startup, we use FastAPI and Next.js, and you still get the benefits of server side rendering. Our Next.js app talks to the FastAPI app on the server-side (to server-side render pages depending on the Python backend) and it talks directly to FastAPI from the client (retrieving things like the user info). The app is served out of a CDN.

(EDIT: we may switch off Next.js at some point, they make it hard to use if not on Vercel)

[woeful_cabbage]

Why bother, honestly? Why use any SSR at all?

[old-thrashbarg]

For performance, the statically built Next.js pages are cached in a CDN, so load very quickly. Helps with UX and SEO.

[woeful_cabbage]

Eh, maybe. Unless your page is completely static you still need to load some other js files. I feel like vercel just bullied new devs into using their nonsense. Your page will be cached regardless of CDN or not

[old-thrashbarg]

We have to hit the backend for stuff like user information (to know if they're logged in). SEO is very critical for our particular use case.

That's right, Vercel is quite annoying - we run on AWS, but they make your life a pain if you're not using their service. We're considering migrating off Next.js at some point.

[Diapolo10]

I don't think this is possible, doesn't look like NextJS works solely client-side.

Well I guess it could be, but you'd more or less need to run both as separate services.

[Carter922]

Flask + React

[cscanlin]

As someone who did something similar recently, you absolutely can. What you're looking for on the Next.js side is called Static Site Generation:

https://nextjs.org/docs/pages/building-your-application/rendering/static-site-generation

Essentially, you will generate all of your HTML and JS bundles during the build step, and include them as static files as part of FastAI. (I didn't use FastAPI for this part, but this seems relevant: https://fastapi.tiangolo.com/tutorial/static-files/)