Google Cloud Firestore

In your FlutterFlow project, click the Firebase icon in the left toolbar — it looks like the Firebase flame logo. This opens the Firebase panel. Click 'Connect' and sign in with the Google account that has Owner or Editor access to your Firebase project. FlutterFlow will list all Firebase projects associated with that account. Select the project you want to use, then click 'Auto-generate Config Files.' FlutterFlow calls the Firebase Management API to download the google-services.json (Android) and GoogleService-Info.plist (iOS) files automatically and embeds them in your build. You will see a green checkmark next to 'Firebase Connected' in the panel when this succeeds. If it fails silently, it almost always means your Google account has Viewer-only access — the account connecting must have Owner or Editor permissions at the Google Cloud project level, not just the Firebase console.

Inside the Firebase panel, click the 'Firestore' tab. If Firestore is not yet enabled on the Firebase project, FlutterFlow will show a prompt to enable it — click it and choose a region close to your users (for example, us-central1 or europe-west1). Once enabled, you will see FlutterFlow's Firestore schema editor. Click '+ Add Collection' and give your first collection a name (for example, 'products' or 'tasks'). Collections hold your documents; think of them like database tables. Inside the collection, click '+ Add Field' to define each field: give it a name, choose a FlutterFlow data type (String, Integer, Double, Boolean, Timestamp, LatLng, Document Reference, or a custom Data Struct you define), and mark whether it is nullable. Document References are especially powerful — a 'userId' field of type Document Reference pointing to the 'users' collection creates a relational link between documents. Add all the fields your app will need. FlutterFlow will generate the type-safe Dart models from this schema automatically, saving you from writing boilerplate code.

This is the most important step and the one most often skipped. In the Firebase panel, click 'Firestore' then 'Settings.' You will see the Security Rules editor. When you first enable Firestore, Google puts it in test mode with a rule that reads: `allow read, write: if request.time < timestamp.date(YEAR, MONTH, DAY);` — this rule allows any unauthenticated person to read and write ALL of your data until the expiry date, which is typically 30 days after you enabled Firestore. You must replace this with real rules before you go live. A safe starting rule for apps using Firebase Auth looks like this: for a 'tasks' collection where each document has a userId field, the rule is `allow read, write: if request.auth != null && resource.data.userId == request.auth.uid;`. For the create operation, use `request.resource.data.userId == request.auth.uid` instead of `resource.data.userId` because `resource.data` refers to the existing document, which does not exist yet on a create. After editing, click 'Save Rules.' The changes deploy to Firebase within a few seconds. You can test your rules in the Firebase console under Firestore → Rules → Rules Playground without having to run the actual app.

1rules_version = '2';
2service cloud.firestore {
3  match /databases/{database}/documents {
4    // Users can only read and write their own task documents
5    match /tasks/{taskId} {
6      allow read, update, delete: if request.auth != null
7        && resource.data.userId == request.auth.uid;
8      allow create: if request.auth != null
9        && request.resource.data.userId == request.auth.uid;
10    }
11    // Users can read and write their own profile
12    match /users/{userId} {
13      allow read, write: if request.auth != null
14        && request.auth.uid == userId;
15    }
16  }
17}

Navigate to the page in your FlutterFlow app where you want to display your Firestore data. Add a ListView widget from the widget panel. Click the ListView to select it, then open the Backend Query panel on the right side. Click '+ Add Query' and choose 'Query Collection' as the query type. In the dropdown, select the collection you defined in the schema editor (for example, 'tasks'). You can add Filter conditions — for example, filter where userId equals the authenticated user's UID by clicking '+ Filter,' selecting the 'userId' field, choosing 'Equal To,' and setting the value to 'Authenticated User → User Reference.' You can also add Order By (for example, created_at Descending) and a Limit. Click 'Confirm.' FlutterFlow generates a StreamBuilder under the hood, so the list updates in real time whenever a document in the collection changes — no pull-to-refresh button needed. Inside the ListView, add your UI widgets (Text, Image, etc.) and bind each one to a field from the query result using the variable picker.

Now wire up write operations. For a Create: add a Form widget (or individual TextField widgets) to a new page, then add a Button. Click the Button, open the Action Flow Editor (the Actions panel on the right side), click '+ Add Action,' and choose 'Backend/Database → Create Document.' Select your target collection, then map each document field to the corresponding form input using the variable picker. For example, map 'title' to the TextField's value and 'userId' to Authenticated User → User Reference. For an Update: on a detail page that receives the document as a page parameter, use a similar Action Flow with 'Update Document' instead — set the Document Reference from the page parameter and map only the fields you want to change. For a Delete: add a Delete button, set its action to 'Delete Document,' and point it at the document reference from the page state or parameter. All three action types run client-side using the authenticated user's Firestore session, so your Security Rules govern whether the operation is allowed — they are your last line of defense.