Skip to main content

FireCMS PRO

No more limits. No more compromises.

Try self-hosted FireCMS PRO completely for free.

yarn create firecms-app --pro
See the docs

The most customizable headless CMS. Ever.

The perfect solution for your team or clients, built on top of Firebase, MongoDB or any other backend.

Build better applications faster

FireCMS PRO allows you to use all the internal components and features of FireCMS, but also provides additional tools and components to help you build better back-office applications faster.

Customizable, extensible and with a strong focus on developer experience, FireCMS PRO is the perfect solution for your next project.

Advanced Functionality, Built-In

FireCMS PRO gives you full access to all the features and components of FireCMS, with the freedom to style and customize as you like. Plus, it offers extra tools and elements to help you create superior back-office applications more efficiently. With FireCMS PRO, you gain greater control and efficiency, enjoying a user experience tailored for professionals. Take charge of your data with advanced tools, including an easy-to-use spreadsheet view and dynamic, feature-rich forms. It's the professional advantage your projects need.

Users and Roles Management
Control app settings based on who's logged in. Connect with your existing user management system for a unified experience.
Self-hosted
Operate independently without external services. Enjoy full control over your data and infrastructure for enhanced security and compliance.
Dedicated Support
Receive dedicated support with a personal account manager. Address questions or issues quickly and stay focused on delivering your best work.
Data enhancement
Use large language models (LLMs) to automatically enrich data for you and your clients. Gain valuable insights, context, and added value from your information.

FireCMS PRO was crafted through collaboration with various companies, out of the need to have a CMS that could be used in different scenarios and that could be easily customized to fit different needs.

Public Facing Applications

If you are building a CRUD public facing application based on Firebase or MongoDB, FireCMS PRO is the perfect solution for you. Define exactly what each user can do and customize the experience for each role.

Use all the internal components of FireCMS, including the schema editor, data inference, advanced data import and export, default roles and more.

Overlay
Pixel Genius is a public facing application that allows users to manage their augmented reality experiences. It is built on top of Firebase and uses FireCMS PRO, and it integrated the three.js editor.

Simple Data Import, from file to CMS

FireCMS offers a streamlined data import feature designed to make your life easier. Whether you're working with extensive CSV, JSON or Excel files, our intuitive tools enable you to transfer and integrate your datasets into FireCMS. No more tedious manual data entry or convoluted import processes—just quick, efficient, and reliable data importation.

Our data import tool will detect your data types automatically, and if you override a mapping, it will do the data conversion for you.

Modern UI components based on tailwindcss

For developers

No config, just React components

FireCMS is simply a set of React components and hooks. You can use them to build your own back-office applications, with your own authentication, data sources and storage.

No need to learn a new framework or a new way of doing things. Just use the components and hooks you need. No magic, no hidden logic, no configuration.

function ProSample() {

    // Use your own authentication logic here
    const myAuthenticator: Authenticator<FirebaseUserWrapper> = useCallback(async ({
                                                                                user,
                                                                                authController
                                                                            }) => {

        if (user?.email?.includes("flanders")) {
            throw Error("Stupid Flanders!");
        }

        // This is an example of retrieving async data related to the user
        // and storing it in the controller's extra field
        const idTokenResult = await user?.getIdTokenResult();
        const userIsAdmin = idTokenResult?.claims.admin || user?.email?.endsWith("@firecms.co");

        console.log("Allowing access to", user);
        return Boolean(userIsAdmin);
    }, []);

    const collections = [
        booksCollection,
        // Your collections here
    ];

    const {
        firebaseApp,
        firebaseConfigLoading,
        configError
    } = useInitialiseFirebase({
        firebaseConfig
    });

    // Controller used to manage the dark or light color mode
    const modeController = useBuildModeController();

    const signInOptions: FirebaseSignInProvider[] = ["google.com"];

    // Controller for managing authentication
    const authController: FirebaseAuthController = useFirebaseAuthController({
        firebaseApp,
        signInOptions
    });

    // Controller for saving some user preferences locally.
    const userConfigPersistence = useBuildLocalConfigurationPersistence();

    // Delegate used for fetching and saving data in Firestore
    const firestoreDelegate = useFirestoreDelegate({
        firebaseApp
    });

    // Controller used for saving and fetching files in storage
    const storageSource = useFirebaseStorageSource({
        firebaseApp
    });

    const navigationController = useBuildNavigationController({
        collections,
        authController,
        dataSourceDelegate: firestoreDelegate
    });

    const dataEnhancementPlugin = useDataEnhancementPlugin({
        getConfigForPath: ({ path }) => {
            if (path === "books")
                return true;
            return false;
        }
    });

    const importExportPlugin = useImportExportPlugin();

    if (firebaseConfigLoading || !firebaseApp) {
        return <CircularProgressCenter/>;
    }

    if (configError) {
        return <CenteredView>{configError}</CenteredView>;
    }
    return (
        <SnackbarProvider>
            <ModeControllerProvider value={modeController}>
                <FireCMS
                    navigationController={navigationController}
                    authController={authController}
                    userConfigPersistence={userConfigPersistence}
                    dataSourceDelegate={firestoreDelegate}
                    storageSource={storageSource}
                    plugins={[dataEnhancementPlugin, importExportPlugin]}
                >
                    {({
                          context,
                          loading
                      }) => {

                        if (loading) {
                            return <CircularProgressCenter size={"large"}/>;
                        }
                        if (authController.user === null) {
                            return <FirebaseLoginView authController={authController}
                                                      firebaseApp={firebaseApp}
                                                      signInOptions={signInOptions}/>
                        }

                        return <Scaffold autoOpenDrawer={false}>
                            <AppBar title={"My amazing CMS"}/>
                            <Drawer/>
                            <NavigationRoutes/>
                            <SideDialogs/>
                        </Scaffold>;
                    }}
                </FireCMS>
            </ModeControllerProvider>
        </SnackbarProvider>
    );

}

LEARN MORE ABOUT FIRECMS PRO

Try out FireCMS PRO completely for FREE!
yarn create firecms-app --pro
Sign up to our newsletter to get the latest news and updates. No spam!