Tutorial para configurar o Firebase para o projeto ZCar

Bruno Zaranza
7 min readNov 21, 2018

--

Figura 1. Logo do Firebase

Para o meu projeto ZCar, resolvi usar o Firebase. Esta publicação presume que você já saiba o que é o Firebase (e também saiba o que é o projeto ZCar) e mostrará apenas o passo a passo para configurar e começar a usá-lo com os serviços de Authentication, Firestore e Storage. Tem como objetivo principal mostrar o que é preciso configurar no Firebase para replicar o Zcar, mas também pode ser usado por qualquer um que queira aprender a fazer o processo de ativação dos seviços.

Este artigo não tem o objetivo de ensinar a condificação necessária no aplicavo do projeto para interagir com o Firebase.

1) Ter/criar uma conta no Google

Se você já tem uma conta na Google e deseja usá-la para o seu projeto, vá direto para o passo 2.

No meu caso, resolvi criar uma conta somente para este projeto, pois uso minha conta pessoal para vários testes e o plano gratuito do Firebase tem limite. Se você está replicando o projeto ZCar no seu carro, recomendo fortemente que crie uma conta específica pra isso.

Para isso, abra a página inicial do Gmail, se tiver autenticado, faça o logout para ir para a tela de início.

Figura 2. Tela inicial do Gmail

Clique em ‘Criar conta’ e preencha como quiser. Na Figura 3 é possível ver como preenchi com os dados do meu projeto.

Figura 3. Criar conta no Google

Clique em “Próxima” e preencha a tela seguinte com seu telefone, e-mail de recuperação e o precisar. Concorde com os termos de privacidade. Feito isso, você já pode usar todos os serviços da Google.

2) Criar o projeto Firebase

Devidamente autenticado na conta que você acabou de criar, abra o console do Firebase e clique em “Adicionar projeto”.

Figura 4. Tela inicial do console

Ao surgir o modal, adicione as informações do seu projeto e marque as caixas de checkbox até o botão “Criar projeto” ficar azul como mostra na Figura 5. Então, clique nesse botão.

Figura 5. Modal para adicionar um projeto a sua conta

O Firebase irá criar todo o ambiente de acordo com os dados preenchidos por você nas etapas passadas.

Figura 6. Console gerando um novo projeto

Quando estiver tudo pronto, o console irá mostrar para você um aviso que seu novo projeto está pronto para ser usado como mostra na Figura 7. Clique em “Continuar”.

Figura 7. Aviso de sucesso na criação do projeto

Agora você está vendo o dashboard do seu novo projeto, como mostra a Figura 8. No menu do lado esquerdo, é possível ver as opções do que você pode fazer para desenvolvimento, aumento de qualidade, análise de dados e ampliar seus resultados.

3) Criar um app para o seu projeto Firebase

Para criar um app, clique na imagem da plataforma que deseja utilizar na parte inferior, onde tem “Adicione um app para começar”. No meu caso, criei um app Android, então cliquei na imagem do robozinho.

Figura 8. Dashboard do projeto ZCar

Preencha com o mesmo nome do pacote do app que você utilizou ou pretende utilizar no Android Studio. Ao fazer isso, estaremos linkando o Firebase ao nosso app lá na IDE. Não é necessário colocar o “Certificado de assinatura de depuração SHA-1” agora, poderemos fazer isso depois direto da IDE (e só será necessário porque o projeto ZCar usa a autenticação). Coloque pacote, apelido e clique em “Registrar app”.

Figura 9. Tela para registrar um app

Agora baixe o arquivo que o console gerou para você, é nele que o seu app Android vai entender onde buscar as informações e você deverá adicioná-lo à sua pasta raiz do app no projeto do Android Studio como mostra a Figura 10.

No caso do projeto ZCar, temos dois módulos que com dois apps, um mobile e um things. Você deverá adicionar uma cópia do google-services.json na pasta mobile e outra cópia na pasta things.

Feito isso, clique em “Próxima”.

Figura 10. Download do arquivo google-services.json

Agora configure o gradle como recomenda o passo seguinte.

Se você fez um fork do ZCar, não se preocupe, o gradle já está configurado e você não vai precisar fazer isso.

Clique em “Próxima”.

Figura 11. Como adicionar a SDK do Firebase ao seu projeto nos arquivos gradle.

Na etapa final da adição do Firebase, o console fica esperando você compilar seu app e verificar se deu tudo certo, porém não é necessário compilar para ele realizar esta etapa. Apenas clique em “Pular etapa”.

Figura 12. Verificação de sucesso de configuração

Pronto. Agora você já pode começar a usar os serviços do Firebase em seu app. Na Figura 13, você pode ver que o app com o mesmo nome do projeto foi criado, e vê que pode adicionar outros apps também. Mas atenção, ao criar outros apps, tenha em mente que você estará usando o mesmo banco de dados, pode ficar uma bagunça se os apps tiverem abordagens diferentes.

Figura 13. App criado

4) Authentication

Para usar a autenticação, clique na opção do menu “Desenvolver” e em seguida em “Authentication”. Clique em “Configurar método de login” para escolher como o usuário poderá fazer login no seu app.

Figura 14. Página de configuração do serciço Authentication

Veja na Figura 15 que você pode criar vários métodos de login. Para o meu projeto, escolhi usar apenas o método de “E-mail/senha”. Mas você pode usar vários ou até mesmo todos de uma vez, se quiser.

Para ativar apenas o login com e-mail e senha, clique na linha onde tem “E-mail/senha”.

Figura 15. Métodos de login

No modal selecione apenas o primeiro switch, o segundo permite realizar login apenas com e-mail. Clique em “Salvar”.

Figura 16. Ativação do método de login com e-mail e senha

Agora você pode até mesmo adicionar um usuário com o login e a senha diretamente no console, clicando em “Adicionar usuário” como mostra a Figura 17.

Feito isso, seu aplicativo está pronto para ser implementado com a autenticação com e-mail e senha.

No projeto ZCar, isso já está configurado, apenas crie um usuário para você no console mesmo. Quando você terminar de configurar o que é necessário, o login irá funcionar.

Figura 17. Adicionar um usuário com e-mail e senha

5) Firestore

As opções de Database são o, ainda em fase de testes, o Firestore e o Realtime Database. A expectativa é que o Firestore tome o lugar do Realtime Database, por isso iremos escolhi ele para usar no ZCar, para garantir mais logenvidade ao projeto. Para começar, clique em “Criar bando de dados”.

Figura 18. Página de configuração do Database

No modal de ativação, apenas clique em “Ativar”.

Figura 19. Modal de ativação

O seu banco de dados com o Firestore já existe, agora precisamos configurar as regras para ter segurança com os nossos dados. Clique na tab “Regras”.

Figura 20. Banco de dados criado

Note na Figura 21 que a regra de segurança para leitura e escrita do banco está somente como false, assim não haverá possibilidade de ler ou escrever nada no banco. Vamos mudar essa regra para permitir leitura e escrita no banco de dados apenas os usuários autenticados.

Figura 21. Regra padrão de um novo projeto

Dentro do chaveamento match, escreva a seguinte linha de código:

allow read, write: if request.auth.uid != null;

Deverá ficar como mostra a Figura 22. Depois é só clicar em “Publicar” para fazer valer a alteração.

Figura 22. Alteração de regras do banco de dados

Agora, no seu aplicativo só poderá visualizar e enviar dados pro banco de dados, os usuários autenticados.

As regras podem ser mais detalhadas, garantindo permissões em apenas algumas coleções de acordo com o usuário ou outra regra. Você pode ver mais na documentação do Firestore.

6) Storage

O Storage é onde guardamos os aquivos. Para ativá-lo e começar a usar, clique em Storage no menu do lado esquerdo e você deverá ver algo tipo como mostra a Figura 23. E clique em “Primeiros passos”.

Figura 23. Página de configuração do Storage

Note no modal que a regra de gravação e leitura está compatível com a regra do Firestore. Então, apenas clique em “Ok”. E pronto.

Figura 24. Regra de segurança padrão do Storage

Pronto, agora o seu aplicativo Android pode usar os serviços de Authentication, Firestore e Storage do Firebase.

O projeto ZCar deverá funcionar se todo o passo a passo mostrado aqui for seguido por completo.

--

--