GitHub - flowglad/flowglad: Open source payments + billing infrastructure

Skip to content

Navigation Menu

Toggle navigation

Sign in

Appearance settings

Platform

GitHub Copilot

Write better code with AI

GitHub Spark

New

Build and deploy intelligent apps

GitHub Models

New

Manage and compare prompts

GitHub Advanced Security

Find and fix vulnerabilities

Actions

Automate any workflow

Codespaces

Instant dev environments

Issues

Plan and track work

Code Review

Manage code changes

Discussions

Collaborate outside of code

Code Search

Find more, search less

Explore

Why GitHub

Documentation

GitHub Skills

Blog

Integrations

GitHub Marketplace

MCP Registry

View all features

Solutions

By company size

Enterprises

Small and medium teams

Startups

Nonprofits

By use case

App Modernization

DevSecOps

DevOps

CI/CD

View all use cases

By industry

Healthcare

Financial services

Manufacturing

Government

View all industries

View all solutions

Resources

Topics

AI

DevOps

Security

Software Development

View all

Explore

Learning Pathways

Events & Webinars

Ebooks & Whitepapers

Customer Stories

Partners

Executive Insights

Open Source

GitHub Sponsors

Fund open source developers

The ReadME Project

GitHub community articles

Repositories

Topics

Trending

Collections

Enterprise

Enterprise platform

AI-powered developer platform

Available add-ons

GitHub Advanced Security

Enterprise-grade security features

Copilot for business

Enterprise-grade AI features

Premium Support

Enterprise-grade 24/7 support

Pricing

Search or jump to...

Search code, repositories, users, issues, pull requests...

Search

Clear

Search syntax tips

Provide feedback

We read every piece of feedback, and take your input very seriously.

Include my email address so I can be contacted

Cancel

Submit feedback

Saved searches

Use saved searches to filter your results more quickly

Name

Query

To see all available qualifiers, see our documentation.

Cancel

Create saved search

Sign in

Sign up

Appearance settings

Resetting focus

You signed in with another tab or window. Reload to refresh your session.
You signed out in another tab or window. Reload to refresh your session.
You switched accounts on another tab or window. Reload to refresh your session.

Dismiss alert

flowglad

/

flowglad

Public

Notifications
You must be signed in to change notification settings

Fork
42

Star
757

Open source payments + billing infrastructure

flowglad.com

License

View license

757
stars

42
forks

Branches

Tags

Activity

Star

Notifications
You must be signed in to change notification settings

Code

Issues
5

Pull requests
4

Actions

Projects
1

Security

Uh oh!

There was an error while loading. Please reload this page.

Insights

Additional navigation options

Code

Issues

Pull requests

Actions

Projects

Security

Insights

flowglad/flowglad

 mainBranchesTagsGo to fileCodeOpen more actions menuFolders and filesNameNameLast commit messageLast commit dateLatest commit History778 Commits.changeset.changeset  .github.github  .husky.husky  .vscode.vscode  cici  packagespackages  platformplatform  playgroundplayground  publicpublic  scriptsscripts  .gitignore.gitignore  .prettierignore.prettierignore  .prettierrc.prettierrc  AGENTS.mdAGENTS.md  CONTRIBUTING.mdCONTRIBUTING.md  LICENSELICENSE  README.mdREADME.md  bun.lockbun.lock  bunfig.tomlbunfig.toml  claude.mdclaude.md  conductor.jsonconductor.json  eslint.config.jseslint.config.js  package.jsonpackage.json  tsconfig.jsontsconfig.json  turbo.jsonturbo.json  vercel.jsonvercel.json  View all filesRepository files navigationREADMEContributingLicense

Flowglad

The easiest way to make internet money.

Get Started

·
Quickstart
·
Website
·
Issues
·
Discord

Infinite pricing models, one source of truth, zero webhooks.

Features

Default Stateless Say goodbye to webhooks, "subscriptions" db tables, customer_id columns, PRICE_ID env variables, or manually mapping your plans to prices to features and back.
Single Source of Truth: Read your latest customer billing state from Flowglad, including feature access and usage meter credits
Access Data Using Your Ids: Query customer state by your auth's user ids. Refer to prices, features, and usage meters via slugs you define.
Full-Stack SDK: Access your customer's data on the backend using flowgladServer.getBilling(), or in your React frontend using our useBilling() hook
Adaptable: Iterate on new pricing models in testmode, and push them to prod in a click. Seamlessly rotate pricing models in your app without any redeployment.

Set Up
Installation
First, install the packages necessary Flowglad packages based on your project setup:
# Next.js Projects
bun add @flowglad/nextjs

# React + Express projects:
bun add @flowglad/react @flowglad/express

# All other React + Node Projects
bun add @flowglad/react @flowglad/server
Flowglad integrates seamlessly with your authentication system and requires only a few lines of code to get started in your Next.js app. Setup typically takes under a minute:
Integration

Configure Your Flowglad Server Client

Create a utility to generate your Flowglad server instance. Pass your own customer/user/organization IDs—Flowglad never requires its own customer IDs to be managed in your app:
// utils/flowglad.ts
import { FlowgladServer } from '@flowglad/nextjs/server'

export const flowglad = (customerExternalId: string) => {
return new FlowgladServer({
customerExternalId,
getCustomerDetails: async (externalId) => {
// e.g. Fetch user info from your DB using your user/org/team ID
const user = await db.users.findOne({ id: externalId })
if (!user) throw new Error('User not found')
return { email: user.email, name: user.name }
},
})
}

Expose the Flowglad API Handler

Add an API route so the Flowglad client can communicate securely with your backend:
// app/api/flowglad/[...path]/route.ts
import { nextRouteHandler } from '@flowglad/nextjs/server'
import { flowglad } from '@/utils/flowglad'

export const { GET, POST } = nextRouteHandler({
flowglad,
getCustomerExternalId: async (req) => {
// Extract your user/org/team ID from session/auth.
// For B2C: return user.id from your DB
// For B2B: return organization.id or team.id
const userId = await getUserIdFromRequest(req)
if (!userId) throw new Error('User not authenticated')
return userId
},
})

Wrap Your App with the Provider

In your root layout (App Router) or _app (Pages Router):
import { FlowgladProvider } from '@flowglad/nextjs'

// App Router example (app/layout.tsx)
export default function RootLayout({ children }) {
return (
<html>
<body>
<FlowgladProvider loadBilling={true}>
{children}
</FlowgladProvider>
</body>
</html>
)
}
That’s it—Flowglad will use your app’s internal user IDs for all billing logic and integrate billing status into your frontend in real time.
B2C apps: Use user.id as the customer ID.
B2B apps: Use organization.id or team.id as the customer ID.
Flowglad does not require you to change your authentication system or manage Flowglad customer IDs. Just pass your own!

Use useBilling on your frontend, and flowglad(userId).getBilling() on your backend

Frontend Example: Checking Feature Access and Usage
'use client'

import { useBilling } from '@flowglad/nextjs'

export function FeatureGate({ featureSlug, children }) {
const { loaded, errors, checkFeatureAccess } = useBilling()

if (!loaded || !checkFeatureAccess) {
return <p>Loading billing state…</p>
}

if (errors?.length) {
return <p>Unable to load billing data right now.</p>
}

return checkFeatureAccess(featureSlug)
? children
: <p>You need to upgrade to unlock this feature.</p>
}
import { useBilling } from '@flowglad/nextjs'

export function UsageBalanceIndicator({ usageMeterSlug }) {
const { loaded, errors, checkUsageBalance, createCheckoutSession } = useBilling()

if (!loaded || !checkUsageBalance) {
return <p>Loading usage…</p>
}

const usage = checkUsageBalance(usageMeterSlug)

return (
<div>
<h3>Usage Balance</h3>
<p>
Remaining:{' '}
{usage ? `${usage.availableBalance} credits available` : <button onClick={() => createCheckoutSession({
priceSlug: 'pro_plan',
autoRedirect: true
})}
/>}
</p>
</div>
)
}
Backend Example: Server-side Feature and Usage Checks
import { NextResponse } from 'next/server'
import { flowglad } from '@/utils/flowglad'

const hasFastGenerations = async () => {
// ...
const user = await getUser()

const billing = await flowglad(user.id).getBilling()
const hasAccess = billing.checkFeatureAccess('fast_generations')
if (hasAccess) {
// run fast generations
} else {
// fall back to normal generations
}
}
import { flowglad } from '@/utils/flowglad'

const processChatMessage = async (params: { chat: string }) => {
// Extract your app's user/org/team ID,
// whichever corresponds to your customer
const user = await getUser()

const billing = await flowglad(user.id).getBilling()
const usage = billing.checkUsageBalance('chat_messages')
if (usage.availableBalance > 0) {
// run chat request
} else {
throw Error(`User ${user.id} does not have sufficient usage credits`)
}
}
Getting Started
First, set up a pricing model. You can do so in the dashboard in just a few clicks using a template, that you can then customize to suit your specific needs.
We currently have templates for the following pricing models:

Usage-limit + Subscription Hybrid (like Cursor)
Unlimited Usage (like ChatGPT consumer)
Tiered Access and Usage Credits (like Midjourney)
Feature-Gated Subscription (like Linear)

And more on the way. If you don't see a pricing model from our templates that suits you, you can always make one from scratch.
Built With

Next.js
tRPC
React.js
Tailwind CSS
Drizzle ORM
Zod
Trigger.dev
Supabase
Better Auth

Project Goals
In the last 15 years, the market has given developers more options than ever for every single part of their stack. But when it comes to payments, there have been virtually zero new entrants. The existing options are slim, and almost all of them require us to talk to sales to even set up an account. When it comes to self-serve payments, there are even fewer options.
The result? The developer experience and cost of payments has barely improved in that time. Best in class DX in payments feels eerily suspended in 2015. Meanwhile, we've enjoyed constant improvements in auth, compute, hosting, and practically everything else.
Flowglad wants to change that.
We're building a payments layer that lets you:

Think about billing and payments as little as possible
Spend as little time on integration and maintenance as possible
Get as much out of your single integration as possible
Unlock more payment providers from a single integration

Achieving this mission will take time. It will be hard. It might even make some people unhappy. But with AI bringing more and more developers on line and exploding the complexity of startup billing, the need is more urgent than ever.

About

Open source payments + billing infrastructure

flowglad.com

Topics

react

typescript

nextjs

payments

billing

trpc

zod

triggerdev

Resources

Readme

License

View license

Contributing

Contributing

Uh oh!

There was an error while loading. Please reload this page.

Activity

Custom properties
Stars

757
stars
Watchers

3
watching
Forks

42
forks

Report repository

Releases
No releases published

Packages
0

No packages published

Uh oh!

There was an error while loading. Please reload this page.

Contributors
22

+ 8 contributors

Languages

TypeScript
96.0%

MDX
2.5%

CSS
0.7%

PLpgSQL
0.6%

Shell
0.1%

JavaScript
0.1%

Footer

© 2025 GitHub, Inc.

Footer navigation

Terms

Privacy

Security

Status

Community

Docs

Contact

Manage cookies

Do not share my personal information

You can’t perform that action at this time.

Flowglad presents itself as an open-source payments and billing infrastructure solution, aiming to address the perceived shortcomings of existing payment processing options for developers. The core concept revolves around simplifying billing and payment management, reducing developer friction and operational overhead. The project is built around a core set of technologies including Next.js, tRPC, React.js, and Tailwind CSS, leveraging modern web development practices. It is maintained by a small team and community, highlighted by significant contributor numbers (22).

The system’s central feature is its decoupling of billing logic from the developer’s application code. Flowglad provides a server-side client that interacts with a payment provider (though the specific provider is not explicitly named, the architecture is designed for broad compatibility). This client, accessible via tRPC, enables developers to access customer billing status—including feature access and usage meter credits—in real-time without manually managing webhooks or complex data mapping. Users define their own customer IDs, eliminating the need to manage unique Flowglad customer IDs.

Key capabilities include a flexible pricing model creation interface with predefined templates for common usage patterns (usage-limit + subscription hybrid, unlimited usage, tiered access). The system offers a server-side feature and usage gate, empowering developers to control access based on subscription tiers or usage levels. Furthermore, Flowglad provides a streamlined checkout session creation process. The project incorporates a robust development experience, building on a streamlined setup, and offering SDKs compatible with Next.js, React, and Express.

The core architecture is driven by the `FlowgladServer` client, which uses tRPC for asynchronous communication between the frontend and backend. The project heavily emphasizes ease of integration, as demonstrated by examples for Next.js, React + Express, and other React projects. The `useBilling` hook (for React frontend) and the `flowglad` function (for backend) are central components. The technical documentation clearly outlines how to integrate Flowglad, including specific examples for retrieving feature access and managing usage balances. The project’s use of Zod for data validation and Trigger.dev for authentication underscores a commitment to robust data handling and secure user management.

Flowglad’s development goals, stated by the core team, reflect a frustration with the stagnant state of payments infrastructure, which has largely remained unchanged for over 15 years. The team’s aim is to provide a developer-friendly, self-serve solution that drastically reduces the time and complexity associated with payment integration and billing management. It's important to note that the project is still under development, and the team openly acknowledges that achieving this ambitious vision will be challenging. The focus on community contribution, demonstrated by the 22 contributors and the use of an MDX file for documentation, signals a collaborative approach to development. The project leverages modern Javascript frameworks and includes TypeScript support, ensuring maintainability and scalability.