# How to Implement Firebase Push Notifications in a .NET MAUI Hybrid App

## Step 1: Add Firebase Configuration Files

### Add `google-services.json` for Android

1. Go to the Firebase Console.
    
2. Create a new project or select an existing one.
    
3. Navigate to **Project Settings > General**.
    
4. In the "Your apps" section, register your Android app.
    
5. Follow the instructions to download the `google-services.json` file.
    
6. Place it in your project under `Platforms/Android`.
    

## Set Build Action

1. Right-click the `google-services.json` file in **Solution Explorer**.
    
2. Choose **Properties**.
    
3. Set **Build Action** to `GoogleServicesJson`.
    

## Step 2: Create a .NET MAUI Hybrid Project

In Visual Studio:

* Create a new project using the **.NET MAUI Blazor App** template.
    
* This enables you to mix web and native mobile functionality using Razor and C#.
    

## Step 3: Install Required NuGet Packages

Install the following packages via NuGet:

```bash
Plugin.Firebase
Plugin.Firebase.Crashlytics
Plugin.Firebase.CloudMessaging
```

## Step 4: Handle Notification Permissions (Android)

In your `AndroidManifest.xml`, add the necessary permissions:

```xml
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.POST_NOTIFICATIONS" />
```

## Step 5: Android Firebase Initialization

### Create CrossFirebase Class

Inside `Platforms/Android`, create a file named `CrossFirebase.cs`:

```csharp
public static class CrossFirebase
{
    public static void Initialize(
        Activity activity,
        CrossFirebaseSettings settings,
        FirebaseOptions firebaseOptions = null,
        string name = null)
    {
        if(firebaseOptions == null) {
            FirebaseApp.InitializeApp(activity);
        } else if(name == null) {
            FirebaseApp.InitializeApp(activity, firebaseOptions);
        } else {
            FirebaseApp.InitializeApp(activity, firebaseOptions, name);
        }

        if(settings.IsAnalyticsEnabled) {
            FirebaseAnalyticsImplementation.Initialize(activity);
        }
    }
}
```

## Add Required Resources

Create a file `strings.xml` under `Platforms/Android/Resources/values`:

```xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="com.google.firebase.crashlytics.mapping_flied_id">none</string>
    <string name="com.crashlytics.android.build_id">1</string>
</resources>
```

## Step 6: Configure MauiProgram.cs

Update `MauiProgram.cs` file to register Firebase services:

```csharp
#if IOS
using Plugin.Firebase.Bundled.Platforms.iOS;
#elif ANDROID
using Plugin.Firebase.Bundled.Platforms.Android;
#endif

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder.UseMauiApp<App>()
               .RegisterFirebaseServices()
               .ConfigureFonts(fonts =>
               {
                   fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
               });

        builder.Services.AddMauiBlazorWebView();

#if DEBUG
        builder.Services.AddBlazorWebViewDeveloperTools();
        builder.Logging.AddDebug();
#endif

        return builder.Build();
    }

    private static MauiAppBuilder RegisterFirebaseServices(this MauiAppBuilder builder)
    {
        builder.ConfigureLifecycleEvents(events =>
        {
#if IOS
            events.AddiOS(iOS => iOS.WillFinishLaunching((app, _) =>
            {
                CrossFirebase.Initialize(CreateCrossFirebaseSettings());
                return false;
            }));
#elif ANDROID
            events.AddAndroid(android => android.OnCreate((activity, _) =>
            {
                var settings = CreateCrossFirebaseSettings();
                CrossFirebase.Initialize(activity, settings);
            }));
#endif
        });

        builder.Services.AddSingleton(_ => CrossFirebaseAuth.Current);
        builder.Services.AddSingleton(_ => CrossFirebaseCloudMessaging.Current);
        return builder;
    }

    private static CrossFirebaseSettings CreateCrossFirebaseSettings()
    {
        return new CrossFirebaseSettings(
            isAuthEnabled: true,
            isCloudMessagingEnabled: true,
            isCrashlyticsEnabled: true
        );
    }
}
```

## Step 7: Create Firebase Admin SDK to Send Notifications

* ### Download `firebase-adminsdk.json`
    
    1. Go to **Firebase Console &gt; Project Settings &gt; Service Accounts**
        
    2. Click **Generate new private key**
        
    3. Save the file as `firebase-adminsdk.json` in your project
        
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1746516926956/19d35ae5-a64c-4816-9580-b0ed778018b6.png align="center")

## Create `PushNotification.cs`

```csharp
using FirebaseAdmin;
using FirebaseAdmin.Messaging;
using Google.Apis.Auth.OAuth2;
using Message = FirebaseAdmin.Messaging.Message;
using Notification = FirebaseAdmin.Messaging.Notification;

public class PushNotification
{
    private readonly FirebaseMessaging _firebaseMessaging;

    public PushNotification()
    {
        if (FirebaseApp.DefaultInstance == null)
        {
            FirebaseApp.Create(new AppOptions
            {
                Credential = GoogleCredential.FromFile("firebase-adminsdk.json") 
            });
        }

        _firebaseMessaging = FirebaseMessaging.DefaultInstance;
    }

    public async Task SendPushNotification(string deviceToken, string title, string body, object data)
    {
        if (deviceTokens.Any())
        {
            var message = new Message()
            {
                Token = deviceToken,
                Notification = new Notification()
                {
                    Title = title,
                    Body = body,
                    ImageUrl = "https://media.istockphoto.com/id/472909414/photo/demo-sign-colorful-tags.jpg?s=612x612&w=0&k=20&c=JD4iYaMoe4x--zJrltwiQzZdDyvtrRuNBK0uQ80tdXg="
                },
                Data = new Dictionary<string, string>
                {
                    { "click_action", "FLUTTER_NOTIFICATION_CLICK" },
                    { "target", "counter" },
                    { "extraData", JsonConvert.SerializeObject(data) }
                }
            };

            try
            {
                var response = await _firebaseMessaging.SendAsync(message);
                Log.Information($"Push Notification sent successfully. Message ID: {response}");
            }
            catch (Exception ex)
            {
                Log.Error($"Error sending push notification: {ex.Message}");
            }
        }
    }
```

### **Register the Service**

In `MauiProgram.cs`, register the service:

```csharp
builder.Services.AddSingleton<PushNotification>();
```

## Step 8: Sending Notification from UI (Blazor)

In `Home.razor`:

```csharp
@page "/"
@using MauiNotificationApp.Services
@inject NavigationManager Navigation
@inject PushNotification PushNotification

<h1>Hello, world!</h1>
Welcome to your new app.

<div class="mt-4">
    @if (!string.IsNullOrEmpty(responseMessage))
    {
        <div class="@(isSuccess ? "text-success" : "text-danger")">
            @responseMessage
        </div>
    }

    @if (isLoading)
    {
        <p>Processing...</p>
    }

    <button class="btn btn-success" @onclick="SendNotification" disabled="@isLoading">Send Notification</button>
</div>

@code {
    private bool isLoading = false;
    private bool isSuccess = false;
    private string responseMessage = string.Empty;
    private string fcmToken = string.Empty;
    private string errorMessage = string.Empty;
    private string successMessage = string.Empty;

    // Get FCM token and store it in a variable
    protected override async Task OnInitializedAsync()
    {
        await CrossFirebaseCloudMessaging.Current.CheckIfValidAsync();
        fcmToken = await CrossFirebaseCloudMessaging.Current.GetTokenAsync();
        Console.WriteLine($"FCM token: {fcmToken}");
    }

    private async Task SendNotification()
    {
        if (string.IsNullOrEmpty(fcmToken))
        {
            errorMessage = "FCM token is not available. Please initialize Firebase first.";
            return;
        }
        
        isLoading = true;
        errorMessage = string.Empty;
        successMessage = string.Empty;
        
        try
        {
            var title = "Test Notification";
            var body = "This is a test notification";
            var data = new
            {
                Type = "Push Notification",
                Title = title,
                Message = body,
                Timestamp = DateTime.Now.ToString("o")
            };
            
            await PushNotification.SendPushNotification(fcmToken, title, body, data);
            successMessage = "Notification sent successfully!";
        }
        catch (Exception ex)
        {
            errorMessage = $"Error sending notification: {ex.Message}";
            Console.WriteLine($"Notification Error: {ex}");
        }
        finally
        {
            isLoading = false;
            StateHasChanged();
        }
    }
}
```

You've now successfully integrated **Firebase Push Notifications** into your **.NET MAUI Hybrid App**!

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1746527142470/2dbbd7e7-a228-40c9-8acd-6900b8ecd93b.jpeg align="center")

# **Diagram:**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1746527858268/b4c24348-5cdc-47ab-8295-040d6d22aa6e.png align="center")