Firecms screenshot

Firecms

Author Avatar Theme by Firecmsco
Updated: 23 May 2025
1214 Stars

Awesome Firebase/Firestore-based CMS. The missing admin panel for your Firebase project!

Categories

Overview

FireCMS is a headless CMS and admin panel designed by developers for developers. It seamlessly integrates with Firebase and Firestore, but is also compatible with any backend. With FireCMS, you can effortlessly generate CRUD views based on your configuration. It is simple to set up for standard cases and easy to extend and customize for more specific needs. FireCMS covers a wide range of basic and advanced use cases, allowing you to create your own views or modify existing ones.

Features

  • Exceptional Spreadsheet View: FireCMS offers a highly efficient windowed spreadsheet view for collections, allowing inline editing for most common fields. It also supports text search, filtering and sorting, and exporting data.
  • Robust Forms: FireCMS provides a nested system of side dialogs for editing entities, allowing easy navigation through subcollections and custom views. It includes over 15 built-in fields with customization and validation options. You can also create your own custom field as a React component. FireCMS supports conditional fields in forms.
  • Authentication, Permissions, and Role System: FireCMS allows you to define which navigation views users can see and the operations they can perform based on your role system. It supports all Firebase authorization mechanisms, but you can implement your own.

Installation

To install FireCMS, follow these steps:

  1. Install the required dependencies:
npm install firebase @react-firebase/firestore react-router-dom @mui/material formik yup
  1. Import the necessary components in your project:
import { FirebaseAppProvider } from '@react-firebase/app';
import { FirestoreProvider } from '@react-firebase/firestore';
import { FireCMS } from 'firecms';
// add additional imports as needed
  1. Set up the Firebase configuration:
const firebaseConfig = {
  // your Firebase configuration
};

function App() {
  return (
    <FirebaseAppProvider firebaseConfig={firebaseConfig}>
      <FirestoreProvider {...firebaseConfig} firebase={firebase}>
        <FireCMS />
      </FirestoreProvider>
    </FirebaseAppProvider>
  );
}

export default App;
  1. Customize FireCMS according to your needs using the provided configuration options.

Summary

FireCMS is a powerful headless CMS and admin panel that seamlessly integrates with Firebase and Firestore. It offers exceptional features such as an efficient spreadsheet view, robust forms with customization options, and a flexible authentication and permissions system. With FireCMS, developers can easily build CMS/admin tools while providing a user-friendly interface for marketers and content managers.