Introduction to Firebase by Dominik - GDE Firebase

1. Dominik Šimoník
Co-founder @yadada / Firebase GDE / GDG Ostrava
@ryzizub
Firebase
Introduction
With example :)

3. Firebase
Helps app teams succeed
Backend-as-a-Service
Service provided by Google

9. Authentication
Prebuild UI’s
Supports Auth2
Google, Facebook, Github...

10. Firestore
NoSQL Cloud Database
Modelled as collection of
documents
Horizontally scaled

11. Firestore vs Realtime Database
● JSON Tree
● Just basic queries
● Limited by region
● Limited scaling
● Collections of documents (JSON)
● Strong queries (sort and query)
● Regional and multi-regional
● Automatic scaling

12. What is Cloud Firestore?
● Newer solution inspired by Realtime database
● Modeled as collections of documents
● Stronger queries
● Pay for reads/writes
● Horizontally scaled
● Shallow by default

13. Cloud Storage
Object storage service
High scalability
High availability
Any file

14. Firebase Hosting
Free Hosting
Can serve from your CSS and HTML files to
your Express.js microservices or APIs.
Backups

15. Cloud Functions
Run your backend code without
managing servers
Triggers

16. ● Cloud Firestore Triggers
● Realtime Database Triggers
● Remote Config Triggers
● Firebase Authentication Triggers
● Google Analytics for Firebase
Triggers
● Crashlytics Triggers
● Cloud Storage Triggers
● Cloud Pub/Sub Triggers
● HTTP Triggers

17. Machine Learning
Prebuild API’s
AutoML
Custom Tensorflow models

18. Analyze

19. Google analytics
App measurement solution
App usage
App engagement

20. Cloud Firestore
Offline support
● Při získání jakýkoliv dat, vše se automaticky ukládá do
lokální cache

21. Performance
monitoring
Easy tracking of app’s
performance issues

22. Firebase
Crashlytics
Realtime crash reporter

23. Cloud Firestore
Offline support
● Při získání jakýkoliv dat, vše se automaticky ukládá do
lokální cache

24. SocialApp

26. Sign in / up
● Facebook login
● Twitter login
● Google login
● Email login
● Registration
● Close

27. Activity
● Feed
● Images
● (Notification)

28. Profile
● User information
● Profile image

29. Nearby places
● Images
● Comments
● (Search)

30. Firebase use

31. Sign in / up
Firebase Authentication
● Facebook login
● Twitter login
● Google login
● Email login
● Registration
● Close

32. e
Activity
Realtime Database / Cloud Firestore
Cloud Functions
Cloud Storage
Cloud Messaging
● Feed
● Images
● (Notification)

33. Profile
Cloud Firestore
Cloud Storage
Firebase Authentication
● User information
● Profile image

34. Nearby places
Cloud Storage
Cloud Firestore
● Images
● Comments
● (Search)

35. firebase_core: "0.7.0"
Core

36. Sign in

37. firebase_auth: "^0.20.0+1"
google_sign_in: ^4.5.1
Google Sign in

38. final FirebaseAuth _firebaseAuth = FirebaseAuth.instance;
final GoogleSignInAccount gUser = await GoogleSignIn().signIn();
final GoogleSignInAuthentication gAuth = await gUser.authentication;
final AuthCredential credential = GoogleAuthProvider.credential(
accessToken: gAuth.accessToken, idToken: gAuth.idToken);
var result = await _firebaseAuth.signInWithCredential(credential);
Google sign in

39. final authResult = await FirebaseAuth.instance.signInAnonymously();
Anonymous sign in

42. Activity

43. storage: ^7.0.0
cloud_firestore: "^0.16.0"
Google Sign in

44. final FirebaseStorage _fsStorage = FirebaseStorage.instance;
TaskSnapshot task = await _fsStorage.ref(path).putFile(file,
metadata);
var url = task.ref.getDownloadURL();
File upload

45. final FirebaseFirestore _fsSt = FirebaseFirestore.instance;
_fsSt.collection('feed').add({
'title': 'Hello Flutter OnAir 2021',
'content': 'How are you?',
});
Database

46. CollectionReference urRef = _fsSt.collection('feed');
return StreamBuilder<QuerySnapshot>(
stream: users.snapshots(),
builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot)
{
return new ListView(
children: snapshot.data.docs.map((DocumentSnapshot document) {
return new ListTile(
title: new Text(document.data()['title']),
subtitle: new Text(document.data()['content']),
);
}).toList(),
);
Feed List

48. firebase_messaging: "^8.0.0-dev.11"

49. Notification

50. Background
Firebase
Foreground
Notification

51. FirebaseMessaging.onBackgroundMessage(backgroundHandler);
static Future<void> backgroundHandler(RemoteMessage message) async {
NotificationData latest = NotificationData.fromMap({
'title': message.data['title'],
'body': message.data['body'],
});
await LocalDatabase().saveLatestNotification(latest);
}
Code slides use Source Code Pro
Background

52. FirebaseMessaging.onMessage.listen((message) {
var latest = NotificationData.fromMap({
'title': message.data['title'],
'body': message.data['body'],
});
});
Code slides use Source Code Pro
Foreground

53. That’s it

56. FlutterError.onError = FirebaseCrashlytics.instance.recordFlutterError;
Isolate.current.addErrorListener(RawReceivePort((pair) async {
final List<dynamic> errorAndStacktrace = pair;
await FirebaseCrashlytics.instance.recordError(
errorAndStacktrace.first,
errorAndStacktrace.last,
);
}).sendPort);
Code slides use Source Code Pro
Background

58. firebase_performance: "^0.5.0+1"
Performance monitoring

60. Security

61. What are Security rules?
● Provide access control and data validation
● Flexible rules syntax allows you to create rules that match anything

62. rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /burgers/{burgerId}/reviews/{reviewId} {
allow write: if request.resource.data.stars > 0;
allow read: if resource.data.visibility == 'public';
}
}
}

63. rules_version = '2';
function isValidItemSchema() {
return hasFields(
incomingData(),
['bought', 'internalNumber', 'invoiceNumber', 'location', 'name', 'notes',
'serialNumber', 'status', 'type', 'user', 'warrantyUntil', 'createdBy', 'createdAt',
'costCenter'],
['updatedBy', 'updatedAt', 'parent', 'children']
)
&& (isMissingField(incomingData(), 'children') || incomingData().children is map)
&& incomingData().createdBy is string
&& incomingData().createdAt is timestamp;
}

64. Thank you!
@ryzizub