Chat com Flutter e Firebase | Parte 1 — Criando e configurando o projeto

Nessa série de artigos iremos criar um chat usando Flutter e Firebase.

Inicialmente, iremos criar um chat P2P (person to person) simples e vamos melhorá-lo constantemente. A idéia é que a série seja gradual e passe por alguns refactories, assim como é o dia a dia do desenvolvedor.

Iremos rodar o aplicativo em iOS (meu ambiente de desenvolvimento) e Android. Atualmente estou usando FVM para gerenciar as diferentes versões do Flutter em minha máquina. Atualmente estou usando a versão 3.7.10.

Versões do Flutter (usando a global 3.7.10)

Dito isso, vamos ao que realmente interessa!

Vamos criar o projeto via linha de comando. Navegue no terminal até a pasta que deseja criar o projeto e rode o seguinte comando (explico abaixo cada argumento usado):

Linha de comando para a criação do projeto

flutter create flutterfirebasechat --empty --org=com.mycompany --project-name=flutterfirebasechat --description="Chat application using Flutter + Firebase"

• flutter create flutterfirebasechat: Comando básico para criação do projeto. Substitua flutterfirebasechat pelo nome de sua preferência. Esse comando, sem nenhum outro argumento, irá criar uma pasta com o nome do projeto com a estrutura de exemplo do Flutter (com aquele famoso contador). Como não queremos o exemplo padrão, iremos passar o próximo parâmetro;
• — empty: Esse argumento informa ao CLI que não desejamos que sejam criadas as classes de exemplo, bem como não sejam adicionados comentários desnecessários no arquivo main.dart e nem no pubscpec.yaml, bem como nenhum tipo de teste;
• — org: Será o nome do pacote utilizado pelos projetos nativos. Por padrão usamos o domínio reverso de um site (do seu cliente, seu próprio etc…). Caso não seja informado, or padrão o flutter cria o pacote com.example;
• — project-name: Nome do projeto. Deve seguir o padrão de nomenclatura de pacotes. Lembre-se que o iOS não aceita _ para separar as palavras, então a sugestão é escrever tudo junto mesmo. Esta informação será adicionada ap README.md e também ao pubspec.yaml;
• — description: Uma breve descrição do projeto. Esta informação será adicionada ap README.md e também ao pubspec.yaml.

Com o projeto criado, iremos adicionar alguns pacotes necessários para que possamos criar a aplicação básica e conectá-la ao Firebase. No terminal, acesse a pasta do projeto e rode o seguinte comando (explico abaixo):

Linha de comando adicionando os pacotes em nossas dependências

flutter pub add firebase_core cloud_firestore intl envied

• fireabase_core: Pacote para permitir conectar aplicações com o Firebase Core API;
• cloud_firestore: Pacote para permitir usar funcionalidades do Cloud Firestore API (usaremos o banco de dados);
• intl: Pacote para internacionalizarmos o projeto e nos ajudará incialmente com a formatação de datas;
• envied: Plugin para fazermos uso de arquivos de variáveis de ambiente (.env), permitindo manter as credenciais do Firebase seguras e sem a necessidade de enviarmos tais informações para nosso gerenciador de versão (git).

Além destes pacotes de dependência, serão necessários alguns pacotes para desenvolvimento. Rode o seguinte comando (explico abaixo):

Linha de comando adicionando pacotes em nossas dependências de desenvolvimento

flutter pub add --dev envied_generator build_runner

• envied_generator: Pacote para gerar arquivos do pacote enveid;
• build_runner: Dependência necessária para gerar os arquivos do pacote envied.

Com todas as dependências instaladas, é necessário ajustar 2 configurações no projeto Android para que a aplicação funcione (caso contrário nem mesmo o build será possível).

Abra o arquivo build.gradle do nível app (android/app/build.gradle). nele será necessário que a gente altere a versão mínima do SDK (minSdkVersion) para a 19 e ainda adicionar o suporte ao MultiDex (multiDexEnable) para que os pacotes relacionados ao Firebase funcionem. Essas informações estão contidas no nó defaultConfig. Nosso arquivo deve ficar assim:

Arquivo android/app/build.gradle com a versão mínima 19 e habilitado o multiDex

Aplicação configurada rodando no iOS e Android

Feito essas alterações, agora é possível rodar a aplicação. Sim, ainda não fizemos nenhuma alteração de código. Iremos fazer isso na próxima parte. Por hora, a gente pode entender que a configuração do firebase está funcionando, mesmo ainda sem conectarmos a aplicação de fato.

Nesse artigo a gente conseguiu:

• Criar um projeto via linha de comando;
• Adicionar as dependências e entender o que cada uma faz;
• Configurar o projeto Android para que o Firebase funcione corretamente.

Acompanhe a série e deixe suas sugestões e comantários. Até a próxima!