Firebase Setup

SaaSStinger Lite uses Firebase as its backend for authentication, data storage, and server-side administration.

This guide walks you through creating a Firebase project and configuring it for use with SaaSStinger Lite.

By the end of this guide, your application will be connected to your own Firebase project and ready for local development.

What You'll Learn

In this guide you'll learn how to:

• Create a Firebase project
• Enable Authentication
• Configure Cloud Firestore
• Generate Firebase client credentials
• Configure the Firebase Admin SDK
• Connect SaaSStinger Lite to Firebase

Prerequisites

Before continuing, ensure you have:

• Node.js 22 LTS
• pnpm 10+
• Firebase CLI (latest version)
• A Google account
• SaaSStinger Lite installed locally

If you haven't installed the project yet, complete the Installation guide first.

Step 1 — Create a Firebase Project

Open the Firebase Console.

Create a new project.

Choose a project name.

For example:

saasstinger-demo

Continue through the setup wizard.

Once complete, you'll arrive at the Firebase project dashboard.

Step 2 — Register a Web Application

Inside your Firebase project:

1. Click Add app
2. Select Web
3. Give the app a name
4. Register the application

Firebase will generate your web configuration.

It will look similar to:

const firebaseConfig = {
  apiKey: "...",
  authDomain: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "...",
  appId: "...",
};

You'll use these values later in your .env.local file.

Step 3 — Enable Authentication

Open:

Authentication → Sign-in Method

Enable the following providers.

Email / Password

Enable:

• Email / Password

No additional configuration is required.

Google

Enable:

• Google

Provide:

• Support email

Save your changes.

GitHub

Enable:

• GitHub

To configure GitHub authentication you'll need:

• GitHub OAuth Client ID
• GitHub OAuth Client Secret

Enter both values and save the provider.

After saving, Firebase will display the callback URL that must be added to your GitHub OAuth application.

Step 4 — Create Firestore

Navigate to:

Firestore Database

Choose:

Create Database

For initial development, select:

Test Mode

Note

Test Mode is recommended only during initial setup.

Before deploying your application, SaaSStinger Lite's Firestore Security Rules should be deployed to secure your database.

Choose a region close to your users.

Once Firestore has been created, you're ready to connect your application.

Step 5 — Configure Environment Variables

Create:

.env.local

Add your Firebase Web SDK configuration.

NEXT_PUBLIC_FIREBASE_API_KEY=
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=
NEXT_PUBLIC_FIREBASE_PROJECT_ID=
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=
NEXT_PUBLIC_FIREBASE_APP_ID=

These variables are used by the Firebase Client SDK.

Step 6 — Configure the Firebase Admin SDK

SaaSStinger Lite also uses the Firebase Admin SDK for secure server-side operations.

Generate a new service account key.

Download the JSON credentials from:

Project Settings
→ Service Accounts
→ Generate New Private Key

Store these credentials securely.

Never commit them to source control.

Configure the required Admin SDK environment variables according to the project's environment configuration.

Security

Service account credentials grant administrative access to your Firebase project. Treat them as sensitive secrets and never expose them in client-side code.

Step 7 — Verify Your Configuration

Start the development server.

pnpm dev

If everything is configured correctly:

• The application starts successfully.
• Firebase initializes without errors.
• Authentication is available.
• Firestore connects successfully.

Verify Authentication

Create a test account using:

• Email & Password

Then verify that:

• Sign in works.
• Sign out works.
• Password reset is available.
• Email verification is sent.
• Google Sign-In works.
• GitHub Sign-In works.

If all providers function correctly, your authentication setup is complete.

Verify Firestore

After creating your first account, you should see new documents appear in Firestore.

Depending on your actions, collections such as these will begin to populate:

• users
• workspaces
• memberships

Additional collections are created automatically as you use more features of the application.

Common Mistakes

Authentication Provider Disabled

If sign-in fails immediately, verify that the corresponding provider has been enabled in Firebase Authentication.

Incorrect Environment Variables

Double-check every value copied from the Firebase Console.

Even a single incorrect value can prevent Firebase from initializing.

After updating environment variables, restart the development server.

Firestore Not Created

Authentication may work while Firestore requests fail.

Ensure you've created a Firestore database before continuing.

Exposing Admin Credentials

Never expose Firebase Admin SDK credentials to the browser.

Keep all service account credentials on the server and exclude them from version control.

Best Practices

• Use separate Firebase projects for development and production.
• Keep service account credentials secure.
• Regularly review Authentication providers.
• Deploy Firestore Security Rules before launching your application.
• Test every authentication provider before deploying.

Related Articles

• Environment Variables
• Authentication
• Firestore Data Model
• Firestore Security Rules

Next Steps

Your Firebase project is now connected to SaaSStinger Lite.

Continue with Environment Variables to learn how the application manages configuration across local and production environments.