Opgaveliste i realtid ved hjælp af Google Firebase: 12 trin

2024 Forfatter: John Day | [email protected]. Sidst ændret: 2024-01-30 08:29

Hej med dig!

Vi bruger alle opgavelister dagligt, uanset om det er online eller offline. Mens offline lister er tilbøjelige til at gå tabt, og virtuelle lister kan være malplaceret, ved et uheld slettet eller endda glemt. Så vi besluttede at lave en på Google Firebase, en database i realtid. Hvorfor? Fordi:

1. Det er fedt

2. Det er realtid, så ændringer foretages øjeblikkeligt.

3. Let at bruge og centraliseret; alle data er i skyen og tilgængelige via enhver platform.

4. En vidunderlig API, der er meget understøttende.

5. Opdateringer er lette at gøre.

Vi vil fokusere på at tilføje data manuelt til Firebase i dette projekt!

Trin 1: Start med Google Firebase

Besøg Google Firebase -webstedet, og klik på knappen "Log på" i øverste venstre hjørne, og log ind via din Google -konto.

Efter at have logget ind, skal du klikke på 'Gå til konsol' for at få adgang til din firebase -databankonsol. Bare rolig, det er ikke noget avanceret.

Trin 2: Lav et 'projekt'

På din nye skærm skal du klikke på det enorme Plus -ikon (Tilføj projekt) for at oprette et nyt projekt. Hvert projekt kan kun have en database, så du bliver nødt til at gentage dette projekt flere gange, hvis du vil have flere databaser i realtid.

Skriv nu dit projektnavn, og vælg det land, der skal bruges. Klik på Opret projekt for at komme i gang!

Trin 3: Velkommen til Firebase Console

Efter indlæsning skal du klikke på fortsæt. Dette tager dig til en ny skærm.

Velkommen til din Google Firebase -konsol!

Trin 4: Oprettelse af databasen

Klik på 'Database' i menuen til venstre. Dette fører dig til en ny skærm, hvor du kan vælge mellem Cloud Firestore eller Realtime Database. Vi vil bruge Realtime Database til dette projekt. Klik på Kom godt i gang!

Trin 5: Definere sikkerhedsregler for din Firebase

Firebase tilbyder kraftfulde godkendelsesfunktioner, så der ikke er uautoriseret adgang til din database. For at holde det simpelt vil vi dog bruge en 'offentlig' database, som kan ændres af alle, der har adgang til din databases 'legitimationsoplysninger'. Mere om legitimationsoplysninger senere.

Vælg 'Testtilstand' for dette projekt, og klik på Aktiver.

Trin 6: Velkommen til din Firebase

Sådan ville din skærm se ud. Undtagen navnet på projektet.

Trin 7: Oprettelse af din første opgaveliste

Vi opretter opgavelister, kaldet 'skovle'. Hver spand er en indlejret liste over data. Selvom du frit kan vælge de former for indlejring, du gerne vil have, repræsenterer hver spand for dette projekt en opgave.

For at tilføje den første spand skal du klikke på ikonet '+' foran null som vist.

Trin 8: Navn på opgavelisten

2 Attributter vises. Navn og værdi.

"Navn" -tagget bruges til at henvise til navnet på din opgave. For eksempel vil du gerne oprette en liste over instruktioner, du vil se senere. Så vi bruger navnet som instruktioner, for hvorfor ikke.

Bemærk, at felterne er korte i længden, så synlighed af længere navne kan være et problem. Vær dog sikker på, at navnet er præcis det, du skrev.

Selvom vi kunne oprette en hvilken som helst værdi for værdimærket, vil vi i stedet gerne tilføje en liste med varer under overskriften. Så for at oprette denne rede klikker vi på ikonet 'Plus' foran værdimærket.

Trin 9: Tilføjelse af detaljer til listen

Du kan se et andet 'niveau' på listen er vist.

Vi vil nu tildele en attribut kaldet 'Hvornår' for at angive den dag, du vil gøre dette. Skriv 'Når' i navneskiltet og 'Søndag', for eksempel i værdimærket.

Nu vil du gerne tilføje de typer instruktioner, du gerne vil se. Vi grupperer disse under navnet 'Hvad'.

Trin 10: Tilføjelse af delopgaver til listen

Klik på plusikonet foran dit 'Bucket' eller 'Task' eller 'List' navn. I det nye felt skal du skrive 'Hvad' i navnet og klikke på plusikonet for at lave en liste under denne overskrift. Klik på plusikonet foran det, der skal tilføjes et andet felt.

Du kan se et andet niveau er dukket op. Indtast dine opgaver i "Navn" -tagget og en beskrivelse i "Værdi" -tagget. Eksperimenter gerne her med mere indlejring.

Klik på tilføj for at afslutte dette. Eller klik på Annuller, hvis du har en anden tanke om at tilføje dataene.

Trin 11: Tada

Du vil se listen lyse grøn, og derefter materialiserer den sig fast som de data, du angiver. Du vil bemærke, at Firebase automatisk sorterer 'Navne' på listerne og underlisterne alfabetisk.

Hvis en opgave ser ufuldstændig ud, skal du klikke på den og rulle til højre for at se den fuldstændigt.

Trin 12: Fuldfør tilføjelsen af dine opgaver

Gentag dette for at lave din liste!

En hurtig opsummering:

Nye spande ved at indsætte på listen til venstre med et projekt-projektnavn.

Nye attributter ved at indsætte i opgaven.

Nye sublister ved at indsætte opgaver på en liste!

Du kan se denne liste når som helst og hvor som helst! Det er perfekt synkroniseret. God fornøjelse!