• Blog
  • Documentation
  • Courses
  • Changelog
  • AI Starters
  • UI Kit
  • FAQ
  • Supamode
    New
  • Pricing

Launch your next SaaS in record time with Makerkit, a React SaaS Boilerplate for Next.js and Supabase.

Makerkit is a product of Makerkit Pte Ltd (registered in the Republic of Singapore)Company Registration No: 202407149CFor support or inquiries, please contact us

About
  • FAQ
  • Contact
  • Verify your Discord
  • Consultation
  • Open Source
  • Become an Affiliate
Product
  • Documentation
  • Blog
  • Changelog
  • UI Blocks
  • Figma UI Kit
  • AI SaaS Starters
License
  • Activate License
  • Upgrade License
  • Invite Member
Legal
  • Terms of License
  • Auth Overview
  • Global Configuration
    • Setting up your Firebase Project
    • Setting up Firebase Functions
  • Writing data to Firestore
  • Commands
  • Introduction
  • Production Checklist
  • Introduction
  • Overview
  • Stripe Configuration
  • Running Tests
  • Introduction
  • Setting up Firebase Auth
  • Fetching data from Firestore
  • Technical Details
  • Extending Organizations
  • Stripe Webhooks
  • CI Tests
  • Initial Setup
  • React Hooks
  • Auth Flow
  • API requests
  • Code Style
  • Clone the repository
  • Security Rules
  • User Permissions
  • Limitations
  • Project Structure
  • Third-Party Providers
  • Reading data from Storage
  • Running the application
  • Subscription Permissions
  • One-Time Payments
  • Running the App
  • Email Link Authentication
  • Uploading data to Storage
  • Security Rules
  • Migrate to Lemon Squeezy
  • Project Configuration
  • Multi-Factor Authentication
  • Writing your own Fetch
  • Translations and Locales
  • Coding Conventions
  • Environment Variables
  • Architecture and Folder Structure
    • Structure your Application
    • Data Model
  • Requiring Email verification
  • Sending Emails
  • Tailwind CSS and Styling
  • Validating API payload with Zod
  • Authentication
  • Onboarding Flow
  • Logging
  • Development: adding custom features
  • Prevent abuse with AppCheck
  • Enable CORS
  • Encrypting Secrets
  • User Roles
  • Firestore: Data Fetching
  • Custom React Hooks
  • Custom React Hooks
  • Firestore: Data Writing
  • Troubleshooting
  • Forms
  • Application Pages
  • API Routes
  • API Routes Validation
  • Translations
  • Adding pages to the Marketing Site
  • Deploying to Production
  • Updating to the latest version
This kit is no longer maintained.

Introduction to MakerKit: a SaaS boilerplate for Remix and Firebase

Introduction to the Remix and Firebase kit

MakerKit is the Remix.js boilerplate project for SaaS built to get you started on the right foot.

MakerKit is a fully SSR-rendered Remix application that uses Firebase for authentication, database (with Firestore), and storage.

MakerKit is ideal for any SaaS application or dynamic websites such as walled Online Publications.

It particularly shines when you wish to provide uniform navigation between your marketing site, documentation, and application.

What does the boilerplate provide?

Tech Stack

We built MakerKit with some of the best technologies available today, such as Remix, Tailwind CSS, and Firebase:

  • Scalable Remix structure template, perfect for the most ambitious projects
  • Beautiful Tailwind 3 CSS theme - with dark mode!
  • Full Firebase setup with local emulators
  • Reusable UI components as building blocks (which you can easily swap with your own or your favorite library) based on Radix UI
  • SSR-compatible Authentication flow, including 3rd-party providers (Google, Facebook, Twitter, GitHub, etc.)

Template Features

MakerKit is fully functioning from the beginning and comes with the following features:

  • Payments with Stripe, and support for subscriptions (or, alternatively, using Lemon Squeezy)
  • Onboarding flow, which allows your users to set up their accounts and create their organization
  • Organizations: users can create and edit organizations. An organization is a group of users. You can rename the Organization entity according to your domain (for example, teams, projects, etc.)
  • Team Members: users can invite other users to join their organization and assign them a role
  • MDX-powered Blog and Documentation generators - already SEO-optimized for you [Coming Soon]

Marketing

Marketing matters! But don't get hung up on the technicalities. MakerKit provides:

  • Newsletter Sign-up form for ConvertKit, but easy to adapt to more providers
  • Google Analytics script baked-in
  • Email Templates you can write with React using [React.email] (https://react.email)

Debugging and Testing

Never waste time chasing bugs again.

Assuming you have created a Sentry account, MakerKit can catch exceptions (and possible bugs) and report them to Sentry whenever they happen in both client and server-side code:

  • Error Tracking set up with Sentry
  • Comprehensive E2E Tests suite with Cypress, which you can use and learn from

After you buy

You're not going to be left alone. We offer help and support:

  • Access to the team for feedback, requests, and general support. We're here to support you build your SaaS.

This documentation introduces each of the points above and guides you through so that you can easily adjust MakerKit to your application's domain.

MakerKit has plenty of resources for using both Remix and Firebase - and if you're stuck, you can always reach out to me for help.

On this page
  1. What does the boilerplate provide?
    1. Tech Stack
    2. Template Features
    3. Marketing
    4. Debugging and Testing
    5. After you buy