Build SaaS with NextJSand Firebase

This NextJS template has everything you need to build your next SaaS project with Firebase fast. Learn how to NextJS and how to Firebase while building your app.

Featured On
Hacker News LogoHacker News
Product Hunt LogoProduct Hunt
X Logo

Why FireSaaS Makes Life Easier

Quick Start

Everything you need to build a NextJS app with Firebase and Stripe is pre-packaged and ready to go.

Firebase Integration

Seamless Firebase setup for authentication, database, and hosting, saving you hours of configuration.

Stripe Ready

Stripe integration is built-in, allowing you to start accepting payments with minimal setup.

Best Practices

Follows NextJS and Firebase best practices, ensuring a scalable and maintainable codebase.

Simplified Subscription Management


import { useAuth } from "@/lib/context/AuthContext";
import createPortalLink from "@/lib/stripe/createPortalLink";
import toast from "react-hot-toast";

export default function ManageAccount() {
  const { userClaims } = useAuth();

  const handleManage = async () => {
    const url = await createPortalLink();
    if (!url) {
      toast.error("An error occurred while creating the portal link");
      return;
    }

    window.open(url, "_blank");
  };

  return (
    <div className="flex flex-col space-y-4 items-center justify-center py-4 px-16 bg-neutral-content rounded-xl">
      <span>Your Billing</span>
      {userClaims?.stripeRole !== "Free" && (
        <button onClick={handleManage} className="btn btn-primary">
          Manage Subscription
        </button>
      )}
    </div>
  );
}

With FireSaaS, managing user subscriptions is a breeze. These pre-built components and hooks make it easy to integrate Stripe billing into your app.

  • Seamless Stripe integration
  • User-friendly subscription management
  • Easy access to Stripe Customer Portal
  • Automatic role-based access control

Focus on building your SaaS features, not reinventing the wheel for billing and auth.

Hey there, I'm Ronald

I love building little side projects and *hopeful* SaaS apps, but I often find myself repeating the same code over and over again.

A lot of folks make boilerplates but they charge way too much money for me to buy them.

So I made my own, open-sourced it and I'm giving it away for free!

A picture of me!

Want me to build your SaaS app? I do consulting!

Why Firebase?

I personally fell in love with Firebase and have been using it for around 4 years. I like the NoSQL db, I like the GCP environment and feel comfortable in it. However, there's lots of other options and I may port this library to support those other platforms in the future.


It doesn't mean it's the best for everyone, but if you want to prototype fast, Firebase is the way to go IMO.

Why Stripe?

It's the bog-standard payment processor when it comes to building SaaS apps. However I do understand there are some great alternatives on the market. In the future I may port this repo to support other processors as well!

Why Mixpanel?

Mixpanel is a great application for tracking user behavior and user click events. The free plan is pretty generous too and I've been using it for years.

Why DaisyUI?

I actually just started picking up DaisyUI, it's pretty cool and I like a lot of the default styles so I said eff it, let's start building with it.


Swapping out component libraries is pretty easy though, and I may even build out alternative repos using things like NextUI or <pick-your-component-library-poison-here>

Why should I use this?

If you don't like building apps with NextJS and Firebase, you probably shouldn't.


I'm really just solving my own problem here, but if you're like me and love NextJS, and you love Firebase, and you want to spin up apps faster... then this is for you.

FireSaaS - Made with love