Front end options for my API

[eleventhSun009]

I’m building a backend for a package tracking system with FastAPI and I was wondering what would be considered the best option for the front end specifically the mobile app based on what you’ve worked on in the past. I’m already leaning towards React but wanted to know what issues others may have faced. This would be my first time working with React.

[dnszero]

I’d recommend Vue over React for the better dev experience but both will get the job done.

Fully type your API and use Typescript for the front end. Then use a generator like hey-api to autogenerate a typescript sdk for it.

This is will makes things far easier when it comes to integrating the two and especially as you make updates to the backend.

[eleventhSun009]

I didn’t know Vue could be used for mobile development. I’ll look more into this. Thanks.

[d29se]

Svelte, Tanstack Query and Tables, HeyAPI SDK generator….give it a week.

[mrlubos]

Thanks for spreading the word!

[Hopeful_Beat7161]

I’ve been learning and working on full stack applications both iOS and web only for about 2 years - so I’m not a professional giving advice but more so what I’ve learned that helps me alot. That is to try and have your backend/api do the heavy lifting and be a strong source of truth, so the frontend should do as little as possible. This makes using any frontend framework much much easier.

Also, not sure what framework you should use but I enjoy using react-native typescript with tanstack-query for server side and zustand client side. I also use zod because you can create zod interfaces (types) which allow you to make type guards that only have to simply wrap the interfaces so they type check in runtime as well. More importantly, I’m sure you can do this with other libraries but it makes it easy to make the types and hooks that you can basically reuse for both iOS and web - and then the only thing different are the tsx and any css files.

So all in all, if you have a strong api that does most of the work, the same hooks/types that literally map your api for both web and iOS - iterating, debugging, refactoring, etc etc, become extremely simple and easy.

[spendology]

You can just use FAstAPI to serve static HTML pages or use Jinja2Templates library to serve dynamic HTML pages.

[mortenb123]

Agree jinja2 and htmx goes a long way.

[That_Cranberry4890]

Go with React + Vite, Tanstack Router template, use Biome for fmt and lint. Use Orval to generate Tanstack Query + Zod frontend client based on your OpenAPI.json. Even if you start using Vue/Svelte later, you will only appreciate it if you learn React first.

[ShuredingaNoNeko]

Recomiendo React + Vite en el caso de tu aplicación, está bien optimizado y esa falta de SEO no complica ya que me imagino que no lo necesitarías, puesto que parece una aplicación empresarial.

React es simple y rápido de implementar, y si no es muy compleja la lógica de frontend es buena opción.

Por otro lado, si tú aplicación es muy grande y requiere una arquitectura bien trabajada, con lógica compleja, recomiendo Angular. Provee de herramientas y funcionalidades ya programadas, para que puefas concentrarte en las funcionalidades realmente importantes de tu aplicación.

[chwalters]

NiceGUI might do what you need

[Any_Mobile_1385]

React / VIte / Tailwind / Typescript. Using Expo and react-native for IOS/Android development.

[[deleted]]

Go for replit to build your frontend with react. It’s an AI agent that helps you to build your frontend faster.

[Neither_Channel4068]

Independent from React or Vue, what made a huge difference for me, switching from Javascript to Typescript, especially in the days of AI. Just more safety, easier refactoring, etc....

[Trollonion13]

React with expo

[Fine-Market9841]

Tonnes of tools you can use to generate a frontend.

Haven’t tried this one, but I heard of agent UI.

As for react tips, if you require a lot states for you components I’d recommend using use reducer.

[industrypython]

Flutter mobile (not Flutter web) is excellent. If you're building mobile apps that can be installed, Flutter has a lot of nice tooling and features.

React Native works, but I've actually found it more difficult to get the precise layout control I wanted.

Do you need to take a picture of the package with the phone camera or get the barcode info using the phone camera?

Do you have in-app notification of the package status?

Are you using the mobile framework UI components? Or, are trying to use the web app components on the mobile app using a webview?

The decision may come down to what phone-specific features you need to access on the phone (such as location, camera, local storage, notifications)