React Horizon UI – avoimen lähdekoodin Firebase Starter

Julkaissut Platon

seuraajia: 0

Hei koodaajat!

Tässä artikkelissa esitellään avoimen lähdekoodin täyden pinon käynnistin, joka käyttää Firebasen tuottamaa React-käyttöliittymää todennuskerroksena. Reagoi Horizon Firebaseen voidaan ladata Githubista ja se perustuu permissive (MIT) -lisenssiin, jota käytetään kaupallisissa projekteissa ja eLearning-toiminnassa. Uusille tulokkaille, suhtautua on johtava JS-kirjasto, jota käytetään koodaamaan interaktiivisia käyttöliittymiä ja Firebase on suosittu Googlen kehittämä taustapalvelu. Thanks for reading!

Tämän hämmästyttävän käyttöliittymän on suunnitellut ja tarjoanut ilmaiseksi Yksinkertaista, luova verkkotoimisto, joka käyttää Charka UI:ta käyttöliittymän pääkirjastona.

✨ Tuotteen ominaisuudet

Chakra UI:n tuottaman käyttöliittymän koodikanta
7 esimerkkisivua: Dashboard, NFT Market, User Profile
Yli 70 komponenttia – hienosti dokumentoitu täällä
Dark-Mode, RTL-tuki
Firebase-taustajärjestelmä
Sosiaalinen kirjautuminen Googlen kautta
Klassinen todennus (käyttäjä/salasana)

Malliversio (ilman todennusta) löytyy ja ladata viralliselta sivulta: Horizon käyttöliittymä.

✨ Kuinka käyttää tuotetta

Rakentaaksemme tuotteen paikallisessa ympäristössä tarvitsemme muutamia perustyökaluja, kuten Git ja kunnollisen NodeJS-version (16.x tai uudempi).

???? Vaihe 1 – Kloonaa lähteet

$ git clone https://github.com/app-generator/react-horizon-ui-chakra-firebase.git
$ cd react-horizon-ui-chakra-firebase

???? Vaihe 2 – Asenna riippuvuudet

$ npm i
// OR
$ yarn

???? Vaihe 3 – Määritä Firebase-kirjautumistiedot



const config = {
    ...
    firebase: {                                               
        apiKey: 'YOUR_API_KEY',                            
        authDomain: 'YOUR_DOMAIN_HERE',                    
        projectId: 'YOUR_PROJECT_ID',                      
        storageBucket: 'YOUR_STORAGE_BUCKET',              
        messagingSenderId: 'YOUR_MESSAGING_SENDER_ID',     
        appId: 'YOUR_APP_ID',                   
        measurementId: 'YOUR_TRACKER_ID'
    }
};

???? Vaihe 4 – Käynnistä sovellus

$ npm run start 
// OR
$ yarn start

Kun määritys on valmis, meidän pitäisi pystyä käyttämään sovellusta selaimessa, rekisteröimään uusia käyttäjiä tai todentamaan Googlen sosiaalisen sisäänkirjautumisen avulla.

React Horizon Firebase – kirjautumissivu

React Horizon Firebase – NFT-sivu

React Horizon Firebase - NFT-sivu

✨ Firebase-esittely

Tässä osiossa esitellään muutamia tämän hämmästyttävän palvelun avainkohtia ja esitellään myös vaiheet yksinkertaisen Firebase-sovelluksen luomiseksi.

Firebase on Googlen kehittämä alusta mobiili- ja verkkosovellusten luomiseen. Se on Backend-as-a-Service (BaaS). Se tarjoaa kehittäjille erilaisia työkaluja ja palveluita, jotka auttavat heitä kehittämään laadukkaita sovelluksia ja kasvattamaan käyttäjäkuntaansa.

Firebase vapauttaa kehittäjät keskittymään fantastisten käyttökokemusten luomiseen. Sinun ei tarvitse hallita palvelimia tai kirjoittaa sovellusliittymiä. Firebase on palvelimesi, sovellusliittymäsi ja tietovarastosi. kaikki on kirjoitettu niin yleisesti, että voit muokata sitä vastaamaan useimpia tarpeitasi.

✨Miksi Firebasea käytetään

???? Realtime Database: Firebase lähettää sinulle uusia tietoja heti, kun ne päivitetään WebSocketsin kautta.
???? Authentication: Firebase-todennus sisältää sisäänrakennetun sähköpostin/salasanan todennusjärjestelmän, joka tukee OAuth2:ta Googlelle, Facebookille, Twitterille ja GitHubille.
???? Static Files Hosting: Siinä on helppo staattinen tiedostojen isännöintipalvelu, joka palvelee tiedostojasi CDN:n kautta, mikä tekee niistä saatavilla nopeammin.
???? Push Notifications: Se auttaa yhdistämään käyttäjän laitteet ja palvelimet niin, että alkuperäisten/push-ilmoitusten lähettämisestä tulee yksinkertaista ja luotettavaa.
???? Analytics: Firebase tarjoaa saumattoman tavan integroida Google-analytiikkaan.
???? Crash Reporting: Se tarjoaa myös reaaliaikaisen kaatumisraportin reaaliaikaista seurantaa ja virheiden korjaamista varten.
???? Remote Configuration: Firebase mahdollistaa välittömien päivitysten julkaisemisen loppukäyttäjille etämäärityksen kautta.Testilaboratorio: Palvelu auttaa testaamaan sovelluksiasi Googlen tarjoamilla todellisilla ja virtuaalisilla laitteilla.