> ## Documentation Index
> Fetch the complete documentation index at: https://docs.clix.so/llms.txt
> Use this file to discover all available pages before exploring further.

# SDK Quickstart - Flutter

> Start sending your first notification in 10 minutes.

## Before Getting Started

### Overview

Clix leverages Firebase Cloud Messaging (FCM) to deliver notifications efficiently. The goal is to ensure a smooth integration process and reliable delivery of push notifications to your app users.

### Environment

* Flutter 3.0.0 or later
* Dart 2.17.0 or later
* iOS 14.0+ / Android API 21+
* Firebase configured in your Flutter app ([Firebase setup guide](https://firebase.google.com/docs/flutter/setup?platform=android)).
  * We recommend using `flutterfire` for the installation.

<Note>
  [******Make sure you’ve completed the Firebase setup.******](/firebase-setting)

  If the setup is complete, the following items should be in place.

  1. Make sure GoogleService-Info.plist is in your project's ios > Runner directory and google-services.json is in your project's android > app > src directory.
  2. Upload the Service Account Key file to the Clix console.
</Note>

## Setup Clix - Manual Installation

<Info>
  Clix Flutter SDK only supports manual installation.
</Info>

<AccordionGroup>
  <Accordion title="1. Install Dependencies" defaultOpen>
    Add the Clix Flutter SDK dependency to your project's `pubspec.yaml`:

    ```yaml theme={null}
    dependencies:
      clix_flutter: ^0.0.1
      firebase_core: ^3.6.0
      firebase_messaging: ^15.1.3
    ```

    Install dependencies:

    ```bash theme={null}
    flutter pub get
    ```
  </Accordion>

  <Accordion title="2. Add Initialization Code" defaultOpen>
    Initialize Firebase and Clix in your app's entry point (`main.dart`):

    ```dart main.dart theme={null}
    import 'package:flutter/material.dart';
    import 'package:firebase_core/firebase_core.dart';
    import 'package:clix_flutter/clix_flutter.dart';

    void main() async {
      WidgetsFlutterBinding.ensureInitialized();

      await Firebase.initializeApp();

      await Clix.initialize(const ClixConfig(
        projectId: 'YOUR_PROJECT_ID',
        apiKey: 'YOUR_PUBLIC_API_KEY',
      ));

      runApp(MyApp());
    }
    ```

    Replace `YOUR_PROJECT_ID` and `YOUR_PUBLIC_API_KEY` accordingly.
  </Accordion>

  <Accordion title="3. Add Capabilities (iOS only)" defaultOpen>
    To add Push Notification Capability,

    1. Select your app target.
    2. Go to the **Signing & Capabilities** tab.
    3. Click the **+** button and choose **Push Notification** from the list.
    4. Click the **+** button and choose **Background Modes** from the list.
    5. Then check **'Remote notifications'**.
  </Accordion>

  <Accordion title="4. Build and Run" defaultOpen>
    ```bash theme={null}
    flutter run
    ```

    <Warning>
      **Known Issue: iOS 26.0 Simulator**

      Push notification token generation may fail on iOS 26.0 Simulator. If you encounter this issue, update to iOS 26.1 or later. See [Apple Developer Forums](https://developer.apple.com/forums/thread/797507) for details.
    </Warning>
  </Accordion>
</AccordionGroup>

For more details, please refer to the README file on the clix-flutter-sdk GitHub repository.

## Next Steps

<CardGroup cols={1}>
  <Card title="Setup Notification Service Extension (iOS)" icon="apple" href="/sdk-ios-nse">
    Complete the iOS setup by adding a Notification Service Extension to enable rich notifications with images and track delivery events.
  </Card>
</CardGroup>

<CardGroup cols={1}>
  <Card title="Clix Flutter SDK" icon="github" iconType="regular" href="https://github.com/clix-so/clix-flutter-sdk">
    Check out the latest guides and API for the Clix Flutter SDK.
  </Card>
</CardGroup>

<CardGroup cols={1}>
  <Card title="Setup Firebase" icon="fire" href="https://docs.clix.so/firebase-setting">
    You need to set up Firebase before you start integrating it into your project.
  </Card>

  <Card title="Clix Sample Project - Flutter" icon="github" iconType="regular" href="https://github.com/clix-so/clix-flutter-sdk/tree/main/samples/basic_app">
    If you'd like to see a working example, check out our sample project.
  </Card>
</CardGroup>
