Unduh stencil firebase - Unduh Kode Sumber stencil firebase

stencil firebase

Data situs web

vicon icons

Unduh

Stensil + Firebase

Ini adalah boilerplate untuk membuat Webapp menggunakan stensil + firebase + stensil store.

Fitur ?

Pengaturan Firebase
Pengaturan toko stensil
Login/Register/Perbarui Fungsionalitas Profil/Logout (BASIC ONE)
Melindungi rute yang diakses setelah login

Memulai

Untuk mulai menggunakan boilerplate ini, klon repo ini ke direktori baru:

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

dan jalankan:

npm install

Penggunaan ?

Mengatur Konfigurasi Firebase

Harap atur konfigurasi firebase di file

 src -> config -> config.ts

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

Anda dapat menemukan lebih banyak tentang Firebase Web Config Setup Firebase Web Config

Untuk memulai proyek, jalankan:

npm run start

Untuk membangun aplikasi untuk produksi, jalankan:

npm run build

Untuk menjalankan tes unit sekali, jalankan:

 npm run test

Untuk menjalankan tes unit dan menonton perubahan file selama pengembangan, jalankan:

 npm run test.watch

Struktur Proyek? ️

Melayani

Kelas ini akan menangani fitur otentikasi aplikasi ke Firebase.

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

Anda dapat membuat lebih banyak kelas untuk mengelompokkan fungsionalitas.

Toko

Toko aplikasi

 src -> store -> app.store.ts

Antarmuka

Antarmuka yang digunakan dalam aplikasi

 src -> interface -> interface.ts

Kegunaan

Utilitas untuk Petsing Pesan Aplikasi dan Menahan Konfigurasi Formulir

 src -> util -> util.ts

Konfigurasi

Konfigurasi Tingkat Aplikasi

 src -> config -> config.ts

Aktiva

Aset tingkat aplikasi

 src -> assets

Komponen

Komponen level aplikasi

 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

Styling?

Saya telah menggunakan scss untuk komponen styling. Boilerplate ini memiliki desain dasar yaitu lebih fokus pada mengkonfigurasi dan menggunakan firebase di aplikasi web stensil bersama dengan stensil store. Anda dapat menyesuaikan penampilan sesuai kebutuhan Anda.

Pesan Kesalahan Firebase

Saya telah menunjukkan pesan kesalahan secara langsung tanpa memodifikasi mereka dikembalikan oleh API. Anda dapat menyesuaikannya dengan memodifikasi kode FirebaseAuthService