Storing and retrieving application data is an essential part of Flutter application development. Most real-world applications need to save information such as user profiles, products, orders, messages, tasks, settings, and other application data.
Flutter applications can work with different types of storage depending on the requirements. For cloud-based application data, Cloud Firestore is a popular Firebase solution. Firestore is a NoSQL document database that stores data in collections and documents and supports one-time reads, queries, real-time listeners, and offline capabilities.
Application data is information created, entered, or used by an application during its operation.
Examples include:
For example, an e-commerce application may store products like this:
products
├── product001
│ ├── name: "Laptop"
│ ├── price: 65000
│ └── category: "Electronics"
└── product002
├── name: "Phone"
├── price: 35000
└── category: "Electronics"Without persistent storage, information entered by users may disappear when the application is closed or the application state is recreated.
Data storage allows applications to:
Different applications require different storage solutions.
| Storage Type | Common Use |
|---|---|
| Shared Preferences | Small key-value settings and preferences |
| SQLite | Structured local relational data |
| Hive | Local NoSQL-style storage |
| Secure Storage | Sensitive local values such as tokens |
| Cloud Firestore | Cloud-based NoSQL application data |
| Firebase Realtime Database | Real-time JSON-based application data |
This topic focuses primarily on storing and retrieving application data using Cloud Firestore with Flutter.
Cloud Firestore is a flexible, scalable NoSQL document database provided by Firebase. It stores data in documents organized into collections. Documents can contain fields, nested objects, and subcollections.
Firestore also supports queries, real-time listeners, and offline capabilities on supported platforms.
Firestore uses a collection and document structure rather than traditional SQL tables and rows.
Firestore
|
+-- Collection
|
+-- Document
|
+-- Fields
|
+-- Subcollectionsusers
|
+-- user001
|
+-- name: "John Doe"
+-- email: "[email protected]"
+-- age: 25
+-- isActive: trueA collection is a group of related documents.
Examples:
users
products
orders
messages
courses
tasksA collection can contain many documents.
A document is a record containing fields and values.
users
|
+-- user001
|
+-- name: "John Doe"
+-- email: "[email protected]"
+-- age: 25Every document has an identifier. Firestore can generate an ID automatically, or your application can specify one.
Fields contain the actual data stored inside a document.
| Field | Example | Type |
|---|---|---|
| name | John Doe | String |
| age | 25 | Number |
| isActive | true | Boolean |
| skills | ["Flutter","Dart"] | Array |
| address | {city: "Mumbai"} | Map |
| createdAt | Timestamp | Timestamp |
Before storing and retrieving application data with Cloud Firestore, you should have:
For Firebase configuration, follow the official Flutter setup documentation.
Add the Cloud Firestore Flutter plugin using:
flutter pub add cloud_firestoreThen import it into the Dart file:
import 'package:cloud_firestore/cloud_firestore.dart';The Firestore instance can be accessed using FirebaseFirestore.instance.
final db = FirebaseFirestore.instance;You can then use the instance to access collections and documents.
Firebase must be initialized before Firestore operations are performed.
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(const MyApp());
}
In a FlutterFire-configured application, Firebase is commonly initialized using generated configuration options.
await Firebase.initializeApp(
options: DefaultFirebaseOptions.currentPlatform,
);Storing data means writing information from the Flutter application into a database.
Firestore provides methods such as:
add()set()update()The add() method creates a new document with an automatically generated document ID.
await FirebaseFirestore.instance
.collection('users')
.add({
'name': 'John Doe',
'email': '[email protected]',
'age': 25,
});Firestore generates a unique document ID for the new document.
Use doc() and set() when you want to specify the document ID.
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.set({
'name': 'John Doe',
'email': '[email protected]',
'age': 25,
});The resulting structure is:
users
|
+-- user001
|
+-- name: John Doe
+-- email: [email protected]
+-- age: 25Firestore documents can contain different types of values.
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.set({
'name': 'John Doe',
'age': 25,
'isActive': true,
'skills': ['Flutter', 'Dart', 'Firebase'],
'address': {
'city': 'Mumbai',
'country': 'India',
},
});Firestore supports timestamp values.
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.set({
'name': 'John Doe',
'createdAt': Timestamp.now(),
});You can also use a server-side timestamp:
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.set({
'name': 'John Doe',
'createdAt': FieldValue.serverTimestamp(),
});A common Flutter pattern is collecting information from a form and storing it in Firestore.
final nameController = TextEditingController();
final emailController = TextEditingController();Future saveUser() async {
final name = nameController.text.trim();
final email = emailController.text.trim();
await FirebaseFirestore.instance
.collection('users')
.add({
'name': name,
'email': email,
'createdAt': FieldValue.serverTimestamp(),
});
}
ElevatedButton(
onPressed: saveUser,
child: const Text('Save'),
)Always validate important user input before storing it.
Future saveUser() async {
final name = nameController.text.trim();
final email = emailController.text.trim();
if (name.isEmpty || email.isEmpty) {
return;
}
await FirebaseFirestore.instance
.collection('users')
.add({
'name': name,
'email': email,
});
}
For larger forms, Flutter's Form and TextFormField widgets can be used for structured validation.
Use get() to retrieve a document once.
final doc = await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.get();
if (doc.exists) {
print(doc.data());
}
The retrieved document contains its fields and values.
final doc = await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.get();
if (doc.exists) {
final data = doc.data();
print(data?['name']);
print(data?['email']);
print(data?['age']);
}
final doc = await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.get();
if (doc.exists) {
print('Document found');
} else {
print('Document not found');
}
Use get() on a collection reference to retrieve multiple documents.
final snapshot = await FirebaseFirestore.instance
.collection('users')
.get();
for (final doc in snapshot.docs) {
print('ID: ${doc.id}');
print('Data: ${doc.data()}');
}
Firestore query results can be converted into a list that can be displayed in Flutter.
final snapshot = await FirebaseFirestore.instance
.collection('users')
.get();
final users = snapshot.docs.map((doc) {
return {
'id': doc.id,
...doc.data(),
};
}).toList();
Firestore data can be displayed using Flutter's ListView.builder.
final snapshot = await FirebaseFirestore.instance
.collection('users')
.get();
final users = snapshot.docs;
ListView.builder(
itemCount: users.length,
itemBuilder: (context, index) {
final user = users[index].data();
return ListTile(
title: Text(user['name'] ?? ''),
subtitle: Text(user['email'] ?? ''),
);
},
)
FutureBuilder is useful when retrieving Firestore data once and displaying the result in the Flutter UI.
FutureBuilder(
future: FirebaseFirestore.instance
.collection('users')
.get(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const Center(
child: CircularProgressIndicator(),
);
}
if (snapshot.hasError) {
return const Center(
child: Text('Unable to load data'),
);
}
if (!snapshot.hasData || snapshot.data!.docs.isEmpty) {
return const Center(
child: Text('No data found'),
);
}
final users = snapshot.data!.docs;
return ListView.builder(
itemCount: users.length,
itemBuilder: (context, index) {
final user = users[index].data();
return ListTile(
title: Text(user['name'] ?? ''),
subtitle: Text(user['email'] ?? ''),
);
},
);
},
)
Cloud Firestore supports real-time listeners. Instead of retrieving data only once, an application can listen for changes and update the UI when the listened-to data changes.
FirebaseFirestore.instance
.collection('users')
.snapshots()
.listen((snapshot) {
for (final doc in snapshot.docs) {
print(doc.data());
}
});StreamBuilder can automatically rebuild the Flutter UI when Firestore data changes.
StreamBuilder>>(
stream: FirebaseFirestore.instance
.collection('users')
.snapshots(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const Center(
child: CircularProgressIndicator(),
);
}
if (snapshot.hasError) {
return const Center(
child: Text('Error loading data'),
);
}
final users = snapshot.data?.docs ?? [];
if (users.isEmpty) {
return const Center(
child: Text('No users found'),
);
}
return ListView.builder(
itemCount: users.length,
itemBuilder: (context, index) {
final user = users[index].data();
return ListTile(
title: Text(user['name'] ?? ''),
subtitle: Text(user['email'] ?? ''),
);
},
);
},
)
| Feature | get() | snapshots() |
|---|---|---|
| Purpose | Retrieve data once | Listen for data changes |
| Return Type | Future | Stream |
| Typical Widget | FutureBuilder | StreamBuilder |
| Real-Time Updates | No continuous listener | Yes |
| Common Use | One-time data loading | Live data screens |
Firestore queries allow the application to retrieve only documents that match specific conditions.
final snapshot = await FirebaseFirestore.instance
.collection('users')
.where(
'isActive',
isEqualTo: true,
)
.get();
for (final doc in snapshot.docs) {
print(doc.data());
}
final snapshot = await FirebaseFirestore.instance
.collection('users')
.where(
'email',
isEqualTo: '[email protected]',
)
.get();
for (final doc in snapshot.docs) {
print(doc.data());
}
final snapshot = await FirebaseFirestore.instance
.collection('products')
.where(
'category',
isEqualTo: 'Electronics',
)
.get();Firestore supports compound queries when the selected query structure is supported.
final snapshot = await FirebaseFirestore.instance
.collection('products')
.where(
'category',
isEqualTo: 'Electronics',
)
.where(
'isAvailable',
isEqualTo: true,
)
.get();The orderBy() method can be used to specify the sort order.
final snapshot = await FirebaseFirestore.instance
.collection('products')
.orderBy('price')
.get();final snapshot = await FirebaseFirestore.instance
.collection('products')
.orderBy(
'price',
descending: true,
)
.get();The limit() method restricts the number of documents returned.
final snapshot = await FirebaseFirestore.instance
.collection('products')
.limit(10)
.get();Limiting data is useful when the application does not need to retrieve an entire collection at once.
await FirebaseFirestore.instance
.collection('products')
.doc('product001')
.set({
'name': 'Laptop',
'price': 65000,
'category': 'Electronics',
'isAvailable': true,
});final doc = await FirebaseFirestore.instance
.collection('products')
.doc('product001')
.get();
if (doc.exists) {
final product = doc.data();
print(product?['name']);
print(product?['price']);
}
Application data often needs to be modified after it has been stored.
Use update() to modify selected fields.
await FirebaseFirestore.instance
.collection('products')
.doc('product001')
.update({
'price': 62000,
});await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.update({
'name': 'John Smith',
'age': 26,
'isActive': true,
});Use delete() to remove a document.
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.delete();CRUD represents the four basic database operations:
| Operation | Firestore Method | Purpose |
|---|---|---|
| Create | add() / set() | Store new data |
| Read | get() / snapshots() | Retrieve data |
| Update | update() | Modify existing data |
| Delete | delete() | Remove data |
Cloud Firestore is commonly used with Firebase Authentication. Authentication identifies the user, while Firestore stores additional application-specific user information.
A common structure is:
users
|
+-- USER_UID
|
+-- name
+-- email
+-- phone
+-- createdAtfinal user = FirebaseAuth.instance.currentUser;
if (user != null) {
await FirebaseFirestore.instance
.collection('users')
.doc(user.uid)
.set({
'name': 'John Doe',
'email': user.email,
'createdAt': FieldValue.serverTimestamp(),
});
}
final user = FirebaseAuth.instance.currentUser;
if (user != null) {
final doc = await FirebaseFirestore.instance
.collection('users')
.doc(user.uid)
.get();
if (doc.exists) {
final data = doc.data();
print(data?['name']);
print(data?['email']);
}
}
Firestore documents can contain nested maps.
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.set({
'name': 'John Doe',
'address': {
'city': 'Mumbai',
'state': 'Maharashtra',
'country': 'India',
},
});final doc = await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.get();
final data = doc.data();
if (data != null) {
final address = data['address'];
print(address['city']);
print(address['state']);
}
Subcollections can be used when data belongs to a particular document.
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.collection('orders')
.doc('order001')
.set({
'product': 'Flutter Course',
'price': 5000,
'status': 'completed',
});The structure becomes:
users
|
+-- user001
|
+-- orders
|
+-- order001
|
+-- product
+-- price
+-- statusfinal snapshot = await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.collection('orders')
.get();
for (final doc in snapshot.docs) {
print(doc.data());
}
For small applications, working directly with maps may be sufficient. For larger applications, Dart model classes provide a cleaner and more maintainable approach.
class UserModel {
final String id;
final String name;
final String email;
UserModel({
required this.id,
required this.name,
required this.email,
});
factory UserModel.fromFirestore(
DocumentSnapshot> doc,
) {
final data = doc.data() ?? {};
return UserModel(
id: doc.id,
name: data['name'] ?? '',
email: data['email'] ?? '',
);
}
}
final snapshot = await FirebaseFirestore.instance
.collection('users')
.get();
final users = snapshot.docs
.map(UserModel.fromFirestore)
.toList();
for (final user in users) {
print(user.name);
print(user.email);
}
A model can also provide a method for converting Dart objects into Firestore-compatible maps.
class UserModel {
final String id;
final String name;
final String email;
UserModel({
required this.id,
required this.name,
required this.email,
});
Map toFirestore() {
return {
'name': name,
'email': email,
};
}
}
final user = UserModel(
id: 'user001',
name: 'John Doe',
email: '[email protected]',
);
await FirebaseFirestore.instance
.collection('users')
.doc(user.id)
.set(user.toFirestore());
Database operations can be moved into a separate service class.
class UserService {
final FirebaseFirestore _db = FirebaseFirestore.instance;
Future createUser({
required String id,
required String name,
required String email,
}) async {
await _db.collection('users').doc(id).set({
'name': name,
'email': email,
'createdAt': FieldValue.serverTimestamp(),
});
}
Future>> getUser(
String id,
) {
return _db.collection('users').doc(id).get();
}
Future updateUser(
String id,
Map data,
) {
return _db.collection('users').doc(id).update(data);
}
Future deleteUser(String id) {
return _db.collection('users').doc(id).delete();
}
}
Database operations are asynchronous, so the UI should display a loading indicator while data is being retrieved.
bool isLoading = false;
Future loadUsers() async {
setState(() {
isLoading = true;
});
try {
final snapshot = await FirebaseFirestore.instance
.collection('users')
.get();
// Process data
} finally {
if (mounted) {
setState(() {
isLoading = false;
});
}
}
}
Firestore operations can fail because of network problems, permission errors, invalid queries, or other conditions. Always handle possible errors.
try {
final snapshot = await FirebaseFirestore.instance
.collection('users')
.get();
print(snapshot.docs);
} on FirebaseException catch (e) {
print('Firestore error: ${e.code}');
print('Message: ${e.message}');
} catch (e) {
print('Unexpected error: $e');
}
An application should handle the case where no documents are returned.
if (snapshot.docs.isEmpty) {
return const Center(
child: Text('No data available'),
);
}Empty-state messages provide useful feedback instead of displaying a blank screen.
Request Data
|
v
Loading
|
v
Firestore Request
|
+---- Error ----> Error State
|
+---- No Data --> Empty State
|
+---- Data ----> Success State
|
v
Display Dataclass UsersScreen extends StatelessWidget {
const UsersScreen({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Users'),
),
body: StreamBuilder<
QuerySnapshot>>(
stream: FirebaseFirestore.instance
.collection('users')
.snapshots(),
builder: (context, snapshot) {
if (snapshot.connectionState ==
ConnectionState.waiting) {
return const Center(
child: CircularProgressIndicator(),
);
}
if (snapshot.hasError) {
return const Center(
child: Text('Unable to load users'),
);
}
final users = snapshot.data?.docs ?? [];
if (users.isEmpty) {
return const Center(
child: Text('No users found'),
);
}
return ListView.builder(
itemCount: users.length,
itemBuilder: (context, index) {
final user = users[index].data();
return ListTile(
title: Text(user['name'] ?? ''),
subtitle: Text(user['email'] ?? ''),
);
},
);
},
),
);
}
}
Firestore can also store settings that need to be available across devices.
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.set({
'settings': {
'darkMode': true,
'notifications': true,
'language': 'English',
},
}, SetOptions(merge: true));final doc = await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.get();
final data = doc.data();
if (data != null) {
final settings = data['settings'];
print(settings['darkMode']);
print(settings['notifications']);
print(settings['language']);
}
An e-commerce application can store order information in Firestore.
await FirebaseFirestore.instance
.collection('orders')
.add({
'userId': 'user001',
'productId': 'product001',
'quantity': 2,
'totalAmount': 130000,
'status': 'pending',
'createdAt': FieldValue.serverTimestamp(),
});final snapshot = await FirebaseFirestore.instance
.collection('orders')
.where(
'userId',
isEqualTo: 'user001',
)
.get();
for (final doc in snapshot.docs) {
print(doc.data());
}
Firestore can be used to store messages for chat or communication features.
await FirebaseFirestore.instance
.collection('messages')
.add({
'senderId': 'user001',
'message': 'Hello!',
'createdAt': FieldValue.serverTimestamp(),
});StreamBuilder(
stream: FirebaseFirestore.instance
.collection('messages')
.orderBy('createdAt')
.snapshots(),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return const CircularProgressIndicator();
}
final messages = snapshot.data!.docs;
return ListView.builder(
itemCount: messages.length,
itemBuilder: (context, index) {
final message = messages[index].data();
return ListTile(
title: Text(message['message'] ?? ''),
subtitle: Text(message['senderId'] ?? ''),
);
},
);
},
)
When a collection contains a large number of documents, retrieving everything at once may not be appropriate. Firestore supports query cursors that can be used to retrieve data in pages.
A typical pagination flow is:
First Request
|
v
Load First Page
|
v
Remember Last Document
|
v
Request Next Page
|
v
Append New Data
|
v
Continue Until No More DataPagination should be designed together with appropriate ordering and filtering.
final snapshot = await FirebaseFirestore.instance
.collection('products')
.orderBy('createdAt', descending: true)
.limit(10)
.get();The last document from one query can be used as a cursor for a subsequent query when implementing cursor-based pagination.
Cloud Firestore provides offline capabilities on supported client platforms. Firestore can cache data that the application is actively using and synchronize local changes with the backend when connectivity returns.
This can help applications remain responsive when network connectivity is temporarily unavailable.
Application data should not be left publicly accessible in production. Firestore Security Rules can be used to control access to documents and collections.
For example, a user-specific document can be protected using the authenticated user's UID.
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /users/{userId} {
allow read, write: if request.auth != null
&& request.auth.uid == userId;
}
}
}
This rule allows an authenticated user to access the user document whose document ID matches their Firebase Authentication UID.
A clean application architecture can separate the UI, business logic, and database operations.
Flutter UI
|
v
Controller / ViewModel
|
v
Repository / Service
|
v
Cloud Firestore
|
v
Firebase BackendThis approach makes the application easier to maintain and test.
lib/
├── main.dart
├── firebase_options.dart
├── models/
│ ├── user_model.dart
│ ├── product_model.dart
│ └── order_model.dart
├── services/
│ ├── firestore_service.dart
│ └── auth_service.dart
├── repositories/
│ └── user_repository.dart
├── screens/
│ ├── home_screen.dart
│ ├── users_screen.dart
│ ├── products_screen.dart
│ └── orders_screen.dart
└── widgets/
├── user_card.dart
├── product_card.dart
└── loading_widget.dart| Mistake | Better Approach |
|---|---|
| Loading all documents unnecessarily | Use queries, limits, and pagination where appropriate. |
| Ignoring errors | Handle Firestore exceptions. |
| Ignoring empty results | Display an appropriate empty state. |
| No loading indicator | Show loading feedback during asynchronous operations. |
| Public database rules in production | Use appropriate Security Rules. |
| Mixing database code with every widget | Use services or repositories. |
| Using raw maps everywhere | Use Dart model classes for larger applications. |
| Retrieving data repeatedly | Use appropriate state management and listeners. |
| Ignoring query limitations | Design supported queries and indexes carefully. |
limit() and pagination for large datasets.Future createUser() async {
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.set({
'name': 'John Doe',
'email': '[email protected]',
'createdAt': FieldValue.serverTimestamp(),
});
}Future readUser() async {
final doc = await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.get();
print(doc.data());
}
Future updateUser() async {
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.update({
'name': 'John Smith',
});
}Future deleteUser() async {
await FirebaseFirestore.instance
.collection('users')
.doc('user001')
.delete();
}Create a Flutter application that stores and retrieves user information using Cloud Firestore.
users
|
+-- USER_UID
|
+-- name
+-- email
+-- phone
+-- createdAt
+-- updatedAtCreate a product management application that uses Firestore as its cloud database.
products
|
+-- product001
|
+-- name
+-- price
+-- category
+-- description
+-- isAvailable
+-- createdAtFirebaseFirestore.instance?add() and set()?get() and snapshots()?FutureBuilder?StreamBuilder?where()?orderBy()?limit()?| Concept | Firestore API |
|---|---|
| Firestore Instance | FirebaseFirestore.instance |
| Collection | collection() |
| Document | doc() |
| Store with Auto ID | add() |
| Store with Custom ID | set() |
| Update Data | update() |
| Retrieve Once | get() |
| Real-Time Retrieval | snapshots() |
| Filter Data | where() |
| Sort Data | orderBy() |
| Limit Data | limit() |
| Delete Data | delete() |
| Server Timestamp | FieldValue.serverTimestamp() |
| Increment Value | FieldValue.increment() |
| Array Add | FieldValue.arrayUnion() |
| Array Remove | FieldValue.arrayRemove() |
After completing this topic, you should be able to:
For structured Flutter learning, practical development training, and additional Flutter topics, explore the following resources:
Storing and retrieving application data is a fundamental requirement for real-world Flutter applications. Cloud Firestore provides a flexible NoSQL database where application data can be organized into collections and documents.
Flutter applications can use Firestore to create, read, update, delete, query, and listen to application data in real time. One-time reads can be performed with get(), while real-time updates can be handled with snapshots(). Queries such as where(), orderBy(), and limit() help retrieve the required data efficiently.
For production applications, Firestore should be combined with proper data modeling, loading and error handling, Firebase Authentication where appropriate, Security Rules, and a clean service or repository architecture.
