The Ultimate Tech Stack for Building a Full-Stack MVP and Iterating Quickly

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • zod

    TypeScript-first schema validation with static type inference

  • Forms are a big part of full-stack projects. In our experience, Zod and React Hook Form work great together and provide all the functionality one might need to create forms. In this combo, Zod provides schema validation (types, min/max bounds, lengths, enums, etc.) while React Hook Form gives a flexible API to interact with the form. With these two libraries, one can nest components that interact with the same form, perform different complex validations, and update the data on the fly. They make working with forms seem too easy.

  • firebaseui-web

    FirebaseUI is an open-source JavaScript library for Web that provides simple, customizable UI bindings on top of Firebase SDKs to eliminate boilerplate code and promote best practices.

  • One great product that can be used for authentication is Clerk but we currently use the default Firebase authentication system as it works pretty well. Firebase even has a separate package called firebaseui-web that helps one set up Firebase authentication without writing any UI code.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • shadcn/ui

    Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.

  • There are several alternatives to MUI. shadcn/ui is a modern alternative that is very popular. Ant Design is also a great alternative. Charkra UI can also be used as a UI Framework. Some people suggest just using styled components. Some use Tailwind CSS. Yet, for both styled components and Tailwind CSS, one still writes a lot of CSS. This might not provide the best developer experience compared to using a UI Framework, especially if we aim to avoid designing all the pages on the website.

  • Tailwind CSS

    A utility-first CSS framework for rapid UI development.

  • There are several alternatives to MUI. shadcn/ui is a modern alternative that is very popular. Ant Design is also a great alternative. Charkra UI can also be used as a UI Framework. Some people suggest just using styled components. Some use Tailwind CSS. Yet, for both styled components and Tailwind CSS, one still writes a lot of CSS. This might not provide the best developer experience compared to using a UI Framework, especially if we aim to avoid designing all the pages on the website.

  • supabase

    The open source Firebase alternative.

  • Platforms like Firebase and Supabase provide backend as a service helping you scale to millions of users without maintaining your own infrastructure. We currently use Firebase for authentication, storage, database (Firestore), and serverless functions to handle custom backend logic.

  • styled-components

    Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅

  • There are several alternatives to MUI. shadcn/ui is a modern alternative that is very popular. Ant Design is also a great alternative. Charkra UI can also be used as a UI Framework. Some people suggest just using styled components. Some use Tailwind CSS. Yet, for both styled components and Tailwind CSS, one still writes a lot of CSS. This might not provide the best developer experience compared to using a UI Framework, especially if we aim to avoid designing all the pages on the website.

  • react-hook-form

    📋 React Hooks for form state management and validation (Web + React Native)

  • Forms are a big part of full-stack projects. In our experience, Zod and React Hook Form work great together and provide all the functionality one might need to create forms. In this combo, Zod provides schema validation (types, min/max bounds, lengths, enums, etc.) while React Hook Form gives a flexible API to interact with the form. With these two libraries, one can nest components that interact with the same form, perform different complex validations, and update the data on the fly. They make working with forms seem too easy.

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • React

    The library for web and native user interfaces.

  • As the core frontend technology, React stands out as the top pick for many full-stack projects. While there are other options like Vue or Svelte, React shines because of its vast range of libraries. This big ecosystem makes it easier to add new features and change things fast, which is why it's a favorite for many developers.

  • Next.js

    The React Framework

  • That's where Next.js shines. It's a React framework that provides server-side rendering and static website generation. So, the pages powered with Next.js get rendered on the server first, after which the HTML is sent to the browser, making sure the initial content of the page has all the necessary information about the page. After the page is rendered, only the necessary JavaScript is sent to the client, making sure that the bundle sent to the user's browser is minimal. This improves both the users's experience and how well search engine bots understand the page.

  • material-ui-docs

    ⚠️ Please don't submit PRs here as they will be closed. To edit the docs or source code, please use the main repository:

  • In our experience, the most efficient way of going about UI/UX was by picking a solid UI framework (MUI in our case) and following a design template instead of asking a designer to create everything in Figma, after which the developers would re-create everything in the React app. We kept a single source of truth - the codebase. This literally saved us months!

  • quickstart-android

    Firebase Quickstart Samples for Android

  • Platforms like Firebase and Supabase provide backend as a service helping you scale to millions of users without maintaining your own infrastructure. We currently use Firebase for authentication, storage, database (Firestore), and serverless functions to handle custom backend logic.

  • chakra-ui

    ⚡️ Simple, Modular & Accessible UI Components for your React Applications

  • There are several alternatives to MUI. shadcn/ui is a modern alternative that is very popular. Ant Design is also a great alternative. Charkra UI can also be used as a UI Framework. Some people suggest just using styled components. Some use Tailwind CSS. Yet, for both styled components and Tailwind CSS, one still writes a lot of CSS. This might not provide the best developer experience compared to using a UI Framework, especially if we aim to avoid designing all the pages on the website.

  • antd

    An enterprise-class UI design language and React UI library

  • There are several alternatives to MUI. shadcn/ui is a modern alternative that is very popular. Ant Design is also a great alternative. Charkra UI can also be used as a UI Framework. Some people suggest just using styled components. Some use Tailwind CSS. Yet, for both styled components and Tailwind CSS, one still writes a lot of CSS. This might not provide the best developer experience compared to using a UI Framework, especially if we aim to avoid designing all the pages on the website.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts