• 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

Initialize the Firebase Admin with Next.js

Jul 29, 2022

Learn how to use Firebase on the server with Next.js

next
firebase

The Firebase Admin package is a way to use Firebase on NodeJS, thus allowing us to write backend code with the various Firebase packages such as Auth, Firestore, Storage, and so on.

To use Firebase with a Next.js API function, we have to initialize the Firebase Admin. Let's see how it's done:

Firebase configuration

First, we have to store and retrieve the Firebase configuration for our project.

To do so, we can use the Next.js environment variables by creating a .env file in the root folder, and making sure to fill the values below correctly:

NEXT_PUBLIC_FIREBASE_PROJECT_ID=
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=
FIREBASE_PRIVATE_KEY=
FIREBASE_CLIENT_EMAIL=

Once it's done, we can create a function that accepts the following interface and returns the Firebase admin app:

interface FirebaseAdminAppParams {
projectId: string;
clientEmail: string;
storageBucket: string;
privateKey: string;
}

The snippet below is everything you need to create an admin app using Firebase:

import admin from 'firebase-admin';
function formatFirebasePrivateKey(key: string) {
return key.replace(/\\n/g, '\n');
}
export function createFirebaseAdminApp(params: FirebaseAdminAppParams) {
const privateKey = formatFirebasePrivateKey(params.privateKey);
// if already created, return the same instance
if (admin.apps.length > 0) {
return admin.app();
}
// create certificate
const cert = admin.credential.cert({
projectId: params.projectId,
clientEmail: params.clientEmail,
privateKey,
});
// initialize admin app
return admin.initializeApp({
credential: cert,
projectId: params.projectId,
storageBucket: params.storageBucket,
});
}

Let's assume you created a Next.js API function and want to create a Firebase admin app to be able to use Firestore, you can do the following:

import { createFirebaseAdminApp } from './initialize-firebase-admin-app';
import { getFirestore } from 'firebase-admin/firestore';
async function initializeAdmin() {
const params = {
projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
clientEmail: process.env.FIREBASE_CLIENT_EMAIL,
storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET,
privateKey: process.env.FIREBASE_PRIVATE_KEY
};
return createFirebaseAdminApp(params);
}
export default function getTeams(
req: NextApiRequest,
res: NextApiResponse,
) {
// initialize admin
await initializeAdmin();
// now we can use the Firebase packages!
const firestore = getFirestore();
const { docs, size } = await firestore.collection('teams').get();
const teams = docs.map(doc => doc.data())
return res.send(teams);
}
Some other posts you might like...
Sep 25, 2025Mastering AI-Driven Development: Claude Code & Makerkit Best PracticesA comprehensive guide to building production-ready SaaS features using Claude Code's intelligent agents and Makerkit's PRD functionality
Jun 9, 2025Build a SaaS with Claude CodeThis is a step-by-step guide to building an AI Content Repurposer SaaS by vibe-coding with Claude Code and Makerkit.
Apr 23, 2025Next.js Security: A Comprehensive Guide how to secure your Next.js applicationA comprehensive guide to securing your Next.js application, focusing on practical strategies to protect your application and user data from common vulnerabilities.
Jan 17, 2025Best Practices for Building a SaaS with Windsurf and MakerkitWindsurf is a new AI-powered editor taking the developer experience to the next level. With the new optimized rules for Makerkit, building a SaaS just got a lot easier!
Jan 16, 2025Best Practices for Building a SaaS with Cursor and MakerkitCursor is the hottest AI editor in the market. With the new optimized rules for Makerkit, building a SaaS just got a lot easier!
Dec 26, 2024Choosing the best hosting provider for your Next.js applicationIn this post, we'll show you how to choose the best hosting provider for your Next.js application.