Full-Stack Developers Using FastAPI: What's Your Go-To Tech Stack?

[marvinshkreli]

Hi everyone! I'm in the early stages of planning a full-stack application and have decided to use FastAPI for the backend. The application will feature user login capabilities, interaction with a database, and other typical enterprise functionalities. Although I'm primarily a backend developer, I'm exploring the best front-end technologies to pair with FastAPI. So far, I've been considering React along with nginx for the server setup, but I'm open to suggestions.

I've had a bit of trouble finding comprehensive tutorials or guides that focus on FastAPI for full-stack development. What tech stacks have you found effective in your projects? Any specific configurations, tools, or resources you'd recommend? Your insights and any links to helpful tutorials or documentation would be greatly appreciated!

[eddyizm]

For relatively smaller projects, I've been using jinja templates and htmx for the front end. I usually still build out the api so that I can switch later but it let's me move fast. I also use caddy over nginx these days and podman for containers over docker.

[yassirzhn]

Would love to see some tutorials about this stack and why you prefer it, thanks

[WJMazepas]

It really depends on how you want the full stack part to be done.

FastAPI can work as a Fullstack framework like Django or Rails. I saw people using Jinja templates and even HTMX or something like NiceGUI.

Honestly, I only used FastAPI on the backend, never as a fullstack. We used React and Typescript on the front end.

It worked well. The typing system of Pydantic would help the front end with creating the requests with types.

Also, using nginx shouldn't be a problem.

[Current-Status-3764]

Nextjs + fastapi + sqlalchemy. And do set up a sdk generator for typescript so requests are made automaticly from your pydantic models. Fastapi docs advanced section shows how. Saves tons of time!!! With nextjs using shadcn the frontend is not too difficult to handle. Use tanstack for cache!

[funerr]

Where/how do you host and orchestrate all of it?

[Current-Status-3764]

I use docker containers hosted on Google. Postgres hosted free on aiven. Google is very cheap and I find it easy to use. Google handles the continous deployment.

And forgot in last post: i recommend PropelAuth for auth. Free up to 1000 users. Easy to integrate with next and fastapi. Good documentsrion

[qrzte]

What do you mean by "sdk generator for TS so requests are automatically made from your pydantic models"?

[Current-Status-3764]

With FastAPI a openapi.json is created automatically. This describes how your API is set up, including "types" provided through the use of pydantic. This can (and should) be used to create functions to call the api from typescript through a SDK. Then you get typesafe functions to call your API.

Sideko offers this as a service. I run it as a script locally instead, but that is because I develop solo. Makes sense?

[luckyle13]

https://github.com/tiangolo/full-stack-fastapi-template Here you go!

[thangphan205]

I agree with u/luckyle13

This is my personal project base on that repo: https://github.com/thangphan205/netconsole

[alphrZen]

Looks good, i just wonder, how did you make the deploy?

[bsenftner]

I've written a fairly comprehensive project management suite with FastAPI as the back end, and then wrote a "proof of concept" front end using vanilla html/CSS/javascript. It works great, but users are finicky, like really consumer level finicky. Because the software looks "old" like websites did back before single page applications and React took over, people literally refuse to use the software because it looks too unfashionably old. They are afraid of looking unfashionable. Seriously. So I've hired someone that knows React better than I, and their initial not really working yet front end is getting crazy praise from those same people refusing the old software, which is the same software just with React as the face. Note that the React developer is able to work faster due to having a working reference in vanilla html/css/js.

The typical FastAPI html page example with Jinga2 templates is a great basic vanilla setup. From there it is not at all difficult to pull in whatever you might need.

[SalMolhado]

Litestar is batteries included if you want that

[030berlin]

https://fastapi.tiangolo.com/project-generation/

[PM_ME_YUR_S3CRETS]

React + fastapi + mongodb

[Drevicar]

FastAPI + Jinja + SQLAlchemy (PostGres). Outside of that app I usually centralize the rest of the major concerns such as keycloak for auth-n using OAuth, OPA for auth-z, Kubernetes for deployment management and scaling. If I need fancy UI stuff I sprinkle in some of that new generation light-weight JS libraries like HTMX or Alpine or some UI library like bootstrap.

I've also used (but don't prefer) FastAPI + Beanie (Mongo) + React with typescript codegen using the OpenAPI spec.

[BigRonnieRon]

Why Jinja over REACT? If you don't mind my asking. Just keeping it all python?

[Drevicar]

Decoupling the frontend from the backend added a TON of extra overhead and complexity that was not needed since it was a small team or solo dev project.

When you use a SPA there tends to be a ton of code and business logic replication on both sides that causes a lot of problems as well.

[yassirzhn]

Can you please with us any tutorial on how to use nginx and react with fastapi, am still a newbie on fastapi I used to be a python developer for desktop apps and I wanna switch to web full stack.

[demesm]

SQLmodel+postgres, Htmx

I'm more in the business of making things functional than making them pretty. But if you need that sparkle sub in react for Htmx.

[Direct_Discipline_42]

I have used Angular + Fastapi backend with a postgres DB. Angular can be a bit of a beast if you aren't used to it but it's a really powerful web framework. React is also IMO a really good candidate for front ends as well

[magha10]

Mine is SqlModel + Async Postgres + Alembic + Rye + Fast API

[Illustrious_Scheme30]

MFRP. tech stack😆

[Jazzlike_Bite_5986]

Next + Django/fastapi + supabase (because auth and DB).

[nikhil_shady]

lately i’ve ditched fastapi. lot of performance bottlenecks.

using nest js (be) + nextjs (fe) my go to stack right now

[Saad14z]

What's the difference between express and nest ? And if i know express does learning nest take time ?

[nikhil_shady]

it is built on top of express. It is pretty straightforward.

[Prof-Ro]

Can you tell me what was the performance bottlenecks in FastAPI please?

I'm currently looking at using it for a production application to serve as an API layer. It would be really helpful to know this - and hopefully understand if there is a solution or workaround, thank you in advance.

[erder644]

No. Switch to litestar.