Como utilizar o Firebase com Flutter — FlutterFire (Parte 1)

Introdução — Configurando o FlutterFire

Igor L Sambo💙🇲🇿
GDG Maputo
4 min readFeb 2, 2021

--

Desde que iniciou-se com o desenvolvimento usando o Flutter sempre sentiu-se falta de uma documentação e implementação específica para integração do Firebase. A google assumiu que sempre esteve trabalhando no projecto, porém, com vários projectos por manter ficava difícil de manter o FutterFire, que seria uma implementação específica do Firebase para o Flutter.

Após um tempo decidiu-se passar este projecto para ser mantido (mantido sim, afinal de contas é open-source e você pode contribuir nele agora mesmo — logo após ler este artigo rsrsrsrs) pela Invertase que é uma empresa baseada no Reino Unido com grande experiência e expertise em Dart, Flutter e Firebase (saiba mais em Updates on Flutter and Firebase) anunciado em um artigo de Maio de 2020.

O objectivo com esta migração é permitir obter funções mais específicos possíveis para o Flutter, embora, os anteriores continuem funcionando por agora (até a data deste artigo estão funcionando), assim, não havendo necessidade de ir a documentação nativa para Android ou Web de forma a adivinhar como implementar. Experiência própria, aprendi a implementar muitas das queries e sua combinação com future responses com o Javascript, e demais implementações com o Android, na base da experimentação, e hoje… não é mais necessário.

Ok, indo directo ao assunto. Este artigo é o início de uma série (que devia ter sido lançada em Outubro de 2020) que visa cobrir algumas das funcionalidades principais do FlutterFire como Authentication, Cloud Firestore, Real Time DataBase, CrashAnalitcs, etc.

https://media.giphy.com/media/TKIQ7f57MrZePkkycx/giphy.gif
  1. Como utilizar o Firebase com Flutter (Introdução — Configurando o FlutterFire) (este artigo)
  2. Como utilizar o Firebase com Flutter (FlutterFire Auth — Email/Password)
  3. Como utilizar o Firebase com Flutter (FlutterFire Auth — Phone)
  4. Como utilizar o Firebase com Flutter (FlutterFire Auth — Social(Google))
  5. Como utilizar o Firebase com Flutter (Cloud Firestore)

O que é FlutterFire?

FlutterFire nada mais é que um conjunto de plugins que permitem conectar o projecto Flutter ao Firebase. Dito isto, conseguimos notar que ele sempre esteve presente ao longo do desenvolvimento de nossas apps, contudo, não contava até então com funções específicos e documentação oficial para reger a sua implementação.

https://media.giphy.com/media/cN2UV0o6ErHU5PQDiq/giphy.gif

Até a data de lançamento deste artigo, o FlutterFire é ainda um projecto em curso, em termos de especificação de código e documentação, por isso, as funções antes usados com base no código nativo Android e Web continuam válidos, contudo faltando apenas o Cloud Messaging.

https://github.com/FirebaseExtended/flutterfire/issues/2582 — por Mike Diarmid (actualização de 27 de Outubro de 2020)

Como começar utilizando o FlutterFire?

Os passos para configuração de um projecto usando FlutterFire continuam os mesmos para o nativo pela console do firebase. O acesso às funcionalidades do Firebase pelo flutter continua sendo pelos plugins previamente existentes, alterando apenas a sua implementação (em vários casos a similaridade é notória com o nativo) como código.

Após configurar o projecto firebase e passar os ficheiros necessário para o seu projecto flutter é momento de importar os plugins que iremos precisar para o projecto em específico, lembrando que o firebase_core é essencial para configurar qualquer projecto firebase em nossa app, pois só assim inicializamos o Firebase, que é mandatório para usar os serviços do mesmo.

No pubspec.yaml (assumindo que não foi efectuada a migração para nullsafety):

dependencies:
flutter:
sdk: flutter
firebase_core: ^0.x.0

E correr o

$ flutter pub get

para actualizar o projecto com as novas dependências, ou então usando o pub get directo do IDE que usa.

Mais sobre como configurar o seu projecto para plataformas específicas em:

  1. Android
  2. iOS
  3. Web
  4. MacOS

Inicializando o FlutterFire

Para inicializar o FlutterFire em nosso projecto flutter é necessário invocar o

await FirebaseApp.configure();

antes que a app esteja a correr

void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();

runApp(MyApp());
}

É importante tomar atenção que esta função é assíncrona, portanto, é importante que se use a notação await de modo a garantir que só depois que esta terminar passamos a próxima instrução, que seria carregar a app em si, de contrário acabamos com algo como:

mesmo invocando o FirebaseApp.configure(), sem colocar o await.

Pode ter acesso ao exemplo usado para este artigo no github.

NOTA: Este projecto foi desenvolvido sem ter em conta a migração para null-safety packages.

Este foi apenas um artigo introdutório, por favor deixe um comentário sobre o que achou, e dúvidas caso hajam assim como sugestões do que se deve ou pode melhorar.

https://media.giphy.com/media/bX9FkoOXgEZ394f8m3/giphy.gif

Espero que tenha aprendido com este artigo e que se tenha divertido enquanto lia.

Obrigado por acompanhar até ao fim e espero por você no próximo artigo.

Para questões e sugestões esteja a vontade para tal nos comentários, email igorlsambo1999@gmail.com ou twitter @lsambo02.

Obrigado e até ao próximo artigo!!!

--

--