Download stencil firebase - Download de código fonte stencil firebase

stencil firebase

Dados do site

vicon icons

Baixar

Estêncil + Firebase

Este é um caldeira para criar um WebApp usando o Stencil + Firebase + Stoncil Store.

Características ?

Configuração do Firebase
Configuração da loja de estêncil
Funcionalidade de Login/Registro/Atualizar/Logout (Basic One)
Protegendo rotas que são acessadas após o login

Começando

Para começar a usar este boilerplate, clone este repositório para um novo diretório:

git clone https://github.com/ranjeetsinghbnl/stencil-firebase.git

e correr:

npm install

Uso?

Configuração do Firebase de configuração

Configure a configuração do Firebase no arquivo

 src -> config -> config.ts

 const firebaseConfig = {
  apiKey : "" ,
  authDomain : "" ,
  databaseURL : "" ,
  projectId : "" ,
  storageBucket : "" ,
  messagingSenderId : "" ,
  appId : ""
} ;

Você pode encontrar mais sobre o Firebase Web Config Setup Firebase Web Config

Para iniciar um projeto, execute:

npm run start

Para construir o aplicativo para produção, execute:

npm run build

Para executar os testes de unidade uma vez, execute:

 npm run test

Para executar os testes de unidade e observe as mudanças de arquivo durante o desenvolvimento, execute:

 npm run test.watch

Estrutura do projeto? ️

Serviço

Esta classe lidará com os recursos autenticará os recursos do FireBase.

 src -> services -> auth.service.ts -> Class FirebaseAuthService

Você pode criar mais classes para agrupar uma funcionalidade.

Loja

Loja de aplicativos

 src -> store -> app.store.ts

Interfaces

Interfaces usadas no aplicativo

 src -> interface -> interface.ts

Utilidade

Utilidade para analisar mensagens de aplicativo e manter configurações de formulário

 src -> util -> util.ts

Configuração

Configurações no nível do aplicativo

 src -> config -> config.ts

Ativos

Ativo de nível de aplicação

 src -> assets

Componentes

Componentes do nível do aplicativo

 src -> components ->
1. <app-flash-message> for showing alert messages
2. <app-home> Dashboard 
3. <app-root> entry component of the application
4. <common> sidebar functional component used in login/register components
5. <page> for showing pages
6. <auth> -> having login/register/update-profile components

Estilo?

Eu usei scss para componentes de estilo. Este caldeira tem um design básico, ou seja, foco mais em configurar e usar o Firebase no aplicativo da Web de estêncil junto com a loja de estêncil. Você pode personalizar a aparência de acordo com suas necessidades.

Mensagens de erro do Firebase

Eu mostrei a mensagem de erro diretamente sem modificá -los retornados pela API. Você pode personalizá -los modificando o código FirebaseAuthService