Um dica rápida de como criar um projeto Flutter já com o bundle identifier para os projetos Android e iOS, assim economizando tempo de configuração.
Continue reading →Flutter Create com Bundle Identifier
Tag / Firebase
Firebase Web – Zero to Hero parte 5
Authentication parte 4
Criando componente de email e senha
Agora vamos adicionar um formulário de signin de email e senha
O Id do provider de autenticação de email e senha dentro do authentication é password, porém como fica semanticamente pobre para entendimento, eu costumo descrever o componente que crio para o formulário como auth/auth-email-password
Essa informação vem de firebase.auth.EmailAuthProvider.PROVIDER_ID, mas não se assuste, iremos ver isso mais tarde. =D
Então vamos codar, vamos adicionar o componente
ng g c auth/auth-email-password
CREATE projects/principal/src/app/auth/auth-email-password/auth-email-password.component.scss (0 bytes)
CREATE projects/principal/src/app/auth/auth-email-password/auth-email-password.component.html (34 bytes)
CREATE projects/principal/src/app/auth/auth-email-password/auth-email-password.component.spec.ts (707 bytes)
CREATE projects/principal/src/app/auth/auth-email-password/auth-email-password.component.ts (320 bytes)
UPDATE projects/principal/src/app/auth/auth.module.ts (379 bytes)Firebase Web – Zero to Hero parte 3
Authentication parte 2
Arrumando o layout
Vamos arrumar o layout, afinal, temos que deixar bonito 🤩
Primeiro, quero colocar um background na tela de auth, porém somente na tela de auth.
Mas como se é um component, e o background para ficar bom precisa ser estilizado no body?
Primeiro preciso de um background, adicionei um a pasta assets/images, pasta images essa que eu criei.
projects/principal/src/assets/images/auth-background.png
Firebase Web – Zero to Hero parte 2
Authentication parte 1
Criando os módulos e components de auth
Vamos começar definindo o que fará parte do módulo authentication
O que costumo fazer é ter um módulo chamado, auth.module.ts
Para isso uso o comando de gerar módulo do CLI do Angular, o ng g(generate) m(module), no caso, ng g m auth, ele irá criar uma pasta chamada auth com o módulo dentro dela
Vamos nessa?
ng g m auth
CREATE projects/principal/src/app/auth/auth.module.ts (190 bytes)Firebase Web – Zero to Hero parte 1
Desenvolvendo uma aplicação web usando Angular acessando os recursos do Firebase
Durante essa série de artigos iremos ver tudo que a aba Desenvolver do console do Firebase oferece:
Authentication, Database, Storage, Hosting,Functions
Nessa primeira parte iremos criar a aplicação Angular
E o que precisamos para isso?
Acredito que vc já tenha familiaridade com gerenciadores de pacotes, no caso uso o NPM https://www.npmjs.com/ e será com ele que os exemplos serão exemplificados 😋
Para ter o NPM instalado primeiramente instala o nodejs https://nodejs.org/en/, caso ainda não tenha, esse é o momento de instalá-lo
Fazendo requisições para a API do GraphQL nas Cloud Functions
Nesse vídeo falo de uma parte que ficou faltando, como chamar a API fora do ambiente apresentado no anterior, o graphiql, então uso para isso o Postman numa requisição simples https post.
GraphQL e Express nas Cloud Functions do Firebase
Nesse vídeo mostro um exemplo bem prático e simples de como usar GraphQL junto com o Express retornando dados da Realtime Database, espero que gostem e seja útil
Simples aplicação real time com Angular 4 e Firebase, parte 6
No artigo anterior falei sobre autenticar um usuário no firebase, nesse quero mostrar como criar um novo usuário e também falar sobre rotas filhas
Disclaimer
Esses artigos foram escritos entre maio e junho de 2017, muita coisa mudou desde lá, então procure usar as libs e referências mais atualizadas para implementar os passos que são aqui descritos
fontes: https://github.com/evlymn/simplesapprealtime
Esses artigos foram escritos entre maio e junho de 2017, muita coisa mudou desde lá, então procure usar as libs e referências mais atualizadas para implementar os passos que são aqui descritos
fontes: https://github.com/evlymn/simplesapprealtime
Por questões de segurança, eu acredito, o firebase não implementa uma forma de listar os usuários registrados, o que vejo muito é usarem a base dados regular, linkando o uid do usuário com um novo registro e assim fornecendo outro dados que a api de autenticação não suporta, como endereço, etc… Mas existe um porém, lembrem-se que essa base de dados não é relacional, e esse é o primeiro pecado que temos que evitar, não trazer o mundo relacional para o Firebase #FicaDica
Vamos colocar a mão na massa então
Continue reading →Simples aplicação real time com Angular 4 e Firebase, parte 5
Nesse artigo irei mostrar como fazer um formulário de login usando a api de autenticação do firebase.
Disclaimer
Esses artigos foram escritos entre maio e junho de 2017, muita coisa mudou desde lá, então procure usar as libs e referências mais atualizadas para implementar os passos que são aqui descritos
fontes: https://github.com/evlymn/simplesapprealtime
Esses artigos foram escritos entre maio e junho de 2017, muita coisa mudou desde lá, então procure usar as libs e referências mais atualizadas para implementar os passos que são aqui descritos
fontes: https://github.com/evlymn/simplesapprealtime
Uma situação que teremos que implementar para seguirmos na autenticação, são as rotas, sem elas o nosso aplicativo não saberá quem apresentar para login e cadastro de pessoas.
Bem, vamos lá, primeiramente iremos habilitar a autenticação
No console do firebase clique no link Authentication
Simples aplicação real time com Angular 4 e Firebase, parte 3
Nessa parte iremos fazer a ligação dos dados do angular com o Firebase.
Disclaimer
Esses artigos foram escritos entre maio e junho de 2017, muita coisa mudou desde lá, então procure usar as libs e referências mais atualizadas para implementar os passos que são aqui descritos
fontes: https://github.com/evlymn/simplesapprealtime
Esses artigos foram escritos entre maio e junho de 2017, muita coisa mudou desde lá, então procure usar as libs e referências mais atualizadas para implementar os passos que são aqui descritos
fontes: https://github.com/evlymn/simplesapprealtime
Agora sim, vamos integrar tudo e ver a mágica acontecer =D
Na primeira parte criamos uma lista que é alimentada no método form_submit, dessa vez iremos enviar esses dados diretamente ao Firebase e de lá iremos listar no template html
Vamos nós?