Which Technology Stack Should You Choose?

In this article I will share which technology we choose and why, how we choose it, what we go through while choosing and how we live with the consequences of the choice.

If you are a developer too, you have probably spent some period of your life brooding over "Which technology stack should I choose now?" You may even have filled your ears with questions like "React or Flutter? Django or FastAPI?" and tried to relieve stress in unexpected moments by shouting "Hello, diaphragm breath!" Do not worry; today I will tell you about my own adventure and brighten up this bittersweet selection process a little. After all, we have to make a choice, and we will choose with reasons and stand behind it.

First of all, our project is mainly a web-based SaaS project as planned, and some parts have already been prototyped in Python. Why does that matter? When prototyping I generally use Python or Node.js, because they are very fast for prototype development and I can quickly run tests with many libraries.

So I already have some of the server-side code, but there is no UI yet, no database system, and no API to work with the UI.

Let us start with some technical background:

1. Choosing the Front-end Technology
   • React: One of the most popular libraries on the web side, with a large community. With React, together with additional libraries like React Router and Redux, you can build a scalable structure. To develop the interface faster, we can use component libraries such as Tailwind CSS, Material UI or Chakra UI.
   • Next.js (built on React): Built on top of React, Next.js offers features such as server-side rendering (SSR) and file-based routing, which can provide advantages in SEO and performance. It is also useful for easily managing static and dynamic pages in SaaS projects.
   • Flutter Web: Flutter is mainly very popular for mobile apps. It also has web support, but in terms of performance and user experience it is not yet as widely used as React/Next.js. It is the path chosen by those who want both mobile and web entirely from a single codebase. If the project's focus is web, React/Next.js; if you also want to move quickly to mobile, Flutter can be considered.
2. Making the Interface Look Modern and Good
   • Design libraries:
     • In the React ecosystem there are options such as Material UI, Chakra UI, Ant Design and Tailwind CSS. They provide great convenience with ready-made component sets, responsive design, theming and typography.
     • The goal should be to offer the user a simple, clean and fast experience.
   • UX/UI trends: You can follow modern and simple UI trends at this stage. Especially minimal designs that use whitespace well. Large, readable typography and intuitive navigation are in demand.
3. Choosing the Back-end and Database
   • If we continue with Python:
     • Django: Ships with many features such as user management, an admin panel and an ORM (Object Relational Mapping). It enables rapid prototyping.
     • FastAPI: Lighter, and with its asynchronous structure a good choice for serving a high-performance REST API. Particularly suitable for microservices architecture.
   • For the database we can choose PostgreSQL, MySQL or MongoDB. If we work heavily with JSON data, PostgreSQL's JSON support is quite successful.
4. Important Points in SaaS Architecture
   • User management and authorisation: Many SaaS projects need an integrated system to manage user roles or subscription plans. In Django or FastAPI we can provide security by using token structures such as JWT-based tokens or standards such as OAuth2.
   • Payment infrastructure: Since it will be a global project, we can integrate payment infrastructures such as Stripe or PayPal and manage the subscription model.
   • Workflow management: A structure designed to track step-by-step progress, approval mechanisms, status updates and history. You should be able to clearly track which step users are at, which approvals are pending and when the work was completed.
   • Background jobs: To manage long-running processes synchronously or asynchronously, we can look at job queue solutions such as Celery (compatible with Django/Flask/FastAPI) or RQ (Redis Queue). This way we can run heavy operations asynchronously and respond to the user faster.
5. DevOps, Deployment and Scalability
   • Docker: Packaging the project as Docker containers provides consistency in the local development environment and easy portability in production.
   • CI/CD: Managing tests, automatic builds and deployment processes with tools such as GitHub Actions, GitLab CI/CD or Jenkins provides a big advantage.
   • Cloud infrastructure: Using container orchestration (Kubernetes, ECS, etc.) on AWS, Google Cloud or Azure, we can increase the project's scalability.
6. Flutter vs React comparison
   • If you are building a SaaS application that will mainly run on the web, the React/Next.js ecosystem offers a faster and more widespread solution.
   • If you say "I want to use the same application on mobile too, I want to move forward with a single codebase", you would consider Flutter (or React Native). Still, Flutter Web is not yet as mature as React/Next.js; some complex web projects may require more fine-tuning.

In summary

• Front-end: Building a modern design on React + (Material UI / Tailwind / Chakra UI) or Next.js is a more "industry standard" approach for a web application.
• Back-end: With Python, Django or FastAPI; for the database, PostgreSQL (JSON support) or MongoDB (document-based).
• Workflow and asynchronous tasks: Manage long-running operations with tools such as Celery or RQ.
• Subscription/membership and payment: In the SaaS model, design user role management, subscription plans and payment integration solidly.
• DevOps: Strive to set up a scalable architecture on Docker + CI/CD + a cloud provider.

This way we can build a SaaS platform that is both technologically strong and modern in terms of user experience.

What am I choosing?

Next.js + FastAPI + PostgreSQL is a very popular combination for building a modern, high-performance web application. That is why we are not choosing Flutter, which is better for mobile apps: our project is web-based, and if needed later we can share some React code and build a mobile app with React Native while keeping FastAPI at the back, although I would not strongly prefer it. But we are not considering a mobile app for this work anyway, because the interface does not really fit mobile devices. If it were a project with a mobile-heavy interface, we would do Flutter > FastAPI > PostgreSQL. On the web, building the UI with Next.js seems more sensible.

1. Next.js (Front-end)
   • It is built on React and offers features such as Server-Side Rendering (SSR), static site generation (SSG) and API Routes.
   • It is SEO-friendly and provides a fast experience for the user.
   • It is quite flexible for managing the UI side and creating dynamic pages.
2. FastAPI (Back-end API)
   • A fast, lightweight web framework written in Python, standing out with its asynchronous (async/await) support.
   • Its main goal: developing service-based applications such as RESTful APIs or GraphQL endpoints.
   • Thanks to its performance, it can comfortably be used in real-time or high-traffic environments.
3. PostgreSQL (Database)
   • A powerful, open-source relational database management system.
   • It offers JSON support, strong query mechanisms, high reliability and scalability.
   • It integrates easily with FastAPI using libraries such as SQLAlchemy or Tortoise ORM.

So the simple architecture will be:

— (fetch/axios) –> — (ORM) –>

1. The Next.js application serves HTML/JS/CSS to the user. As a result of user interactions (button clicks, form submissions, etc.) it sends requests to FastAPI.
2. FastAPI processes the incoming request and performs the necessary database operations (insert, delete, update, query).
3. PostgreSQL handles persistent data storage. Records can be created, updated and deleted using an ORM (e.g. SQLAlchemy) or direct PostgreSQL queries.
4. The results are returned as JSON (or another format depending on your needs); Next.js receives this data and updates the screen.

Now the hard part:

In the end we chose, we thought while choosing, we researched and set a path. When someone asks tomorrow why you chose this, you cannot say "it just felt right"; like any expert you need to base it on solid ground and be able to give a logical answer.

For example, you should be able to say "I chose it because...":

1. Performance and flexibility: FastAPI supports speed with its asynchronous structure, while Next.js supports user experience with SEO-friendly SSR.
2. Modular development: The front-end (Next.js) and back-end (FastAPI) can live in separate project folders or repositories; a change in one does not directly affect the other.
3. Scalability: As the application grows, it becomes easier to move to a microservices architecture, add additional services or containerise/host them separately.
4. Python ecosystem: When you want to benefit from Python libraries for machine learning, data analysis or background tasks, FastAPI offers an easy path.
5. Community and documentation: Next.js and FastAPI are both popular, well-documented and actively supported by their communities.

Conclusion:

In every project there will always be someone saying "I wonder if we should have used that instead?". What matters is which combination solves your needs better. Taking the project's needs into account, I preferred the Next.js–FastAPI–PostgreSQL trio.

Remember the slogan, "Pick, like it, buy it!"
That is exactly what I did: I picked, I liked it, I bought it. Let us see what happens next; I will share the results very soon, and I hope they turn out well :)