Realtime takenlijst met Google Firebase: 12 stappen

2024 Auteur: John Day | [email protected]. Laatst gewijzigd: 2024-01-30 11:18

Hoi!

We gebruiken allemaal dagelijks takenlijsten, zowel online als offline. Terwijl offline lijsten de neiging hebben om verloren te gaan, en virtuele lijsten kunnen misplaatst, per ongeluk verwijderd of zelfs vergeten worden. Dus besloten we er een te maken op Google Firebase, een realtime database. Waarom? Omdat:

1. Het is cool

2. Het is realtime, dus wijzigingen worden onmiddellijk doorgevoerd.

3. Makkelijk te gebruiken en gecentraliseerd; alle gegevens staan in de cloud en zijn toegankelijk via elk platform.

4. Een prachtige API die erg ondersteunend is.

5. Updates zijn eenvoudig te doen.

We zullen ons in dit project concentreren op het handmatig toevoegen van gegevens aan Firebase!

Stap 1: Beginnen met Google Firebase

Bezoek de Google Firebase-website en klik op de knop 'Aanmelden' in de linkerbovenhoek en log in via uw Google-account.

Nadat u bent ingelogd, klikt u op 'Go To Console' om toegang te krijgen tot uw Firebase-databaseconsole. Maak je geen zorgen, het is niets geavanceerd.

Stap 2: Een 'project' maken

Klik op je nieuwe scherm op het grote Plus-pictogram (Project toevoegen) om een nieuw project aan te maken. Elk project kan slechts één database hebben, dus u moet dit project meerdere keren herhalen als u meerdere realtime databases wilt.

Typ nu uw projectnaam en selecteer het land van gebruik. Klik op Create Project om aan de slag te gaan!

Stap 3: Welkom bij Firebase Console

Klik na het laden op doorgaan. Dit brengt u naar een nieuw scherm.

Welkom bij uw Google Firebase-console!

Stap 4: De database maken

Klik in het linkermenu op 'Database'. Dit leidt u naar een nieuw scherm waar u kunt kiezen tussen Cloud Firestore of Realtime Database. Voor dit project gebruiken we Realtime Database. Klik op Aan de slag!

Stap 5: Beveiligingsregels voor uw Firebase definiëren

Firebase biedt krachtige authenticatiefuncties zodat er geen ongeautoriseerde toegang tot uw database is. Om het echter eenvoudig te houden, zullen we een 'openbare' database gebruiken, die kan worden gewijzigd door iedereen die toegang heeft tot uw database 'referenties'. Later meer over de geloofsbrieven.

Selecteer de 'Test Mode' voor dit project en klik op Enable.

Stap 6: Welkom bij uw Firebase

Zo ziet je scherm eruit. Behalve de naam van het project.

Stap 7: Uw eerste takenlijst maken

We zullen takenlijsten maken, genaamd 'Buckets'. Elke bucket is een geneste lijst met gegevens. Hoewel je vrij bent om te kiezen welke vormen van nesten je wilt, voor dit project vertegenwoordigt elke emmer een taak.

Om de eerste bucket toe te voegen, klikt u op het '+'-pictogram voor null, zoals weergegeven.

Stap 8: Naam van de takenlijst

2 attributen verschijnen. Naam en waarde.

De tag 'Name' wordt gebruikt om naar de naam van uw taak te verwijzen. U zou bijvoorbeeld een lijst met instructables willen maken die u later wilt zien. Dus we gebruiken de naam als Instructables, want waarom niet.

Houd er rekening mee dat de velden kort zijn, dus de zichtbaarheid van langere namen kan een probleem zijn. Wees er echter zeker van dat de naam precies is wat u hebt getypt.

Hoewel we elke waarde voor de Value-tag kunnen invoeren, willen we in plaats daarvan een lijst met items onder de kop toevoegen. Dus om dit nest te maken, klikken we op het 'Plus'-pictogram voor de Value-tag.

Stap 9: Details toevoegen aan de lijst

U kunt zien dat er een ander 'niveau' van de lijst is verschenen.

We zullen nu een attribuut met de naam 'Wanneer' toewijzen om de dag aan te geven waarop u dit wilt doen. Typ 'When' in het naamlabel en bijvoorbeeld 'Sunday' in het Value-label.

Nu zou je de soorten instructables willen toevoegen die je zou willen zien. We zullen deze groeperen onder de naam 'Wat'.

Stap 10: Subtaken aan de lijst toevoegen

Klik op het pluspictogram voor de naam van uw 'Bucket', 'Taak' of 'Lijst'. Typ 'Wat' in de naam in het nieuwe veld en klik op het pluspictogram om een lijst te maken onder deze kop. Klik op het pluspictogram voor wat u nog een veld wilt toevoegen.

Je kunt zien dat er een ander niveau is verschenen. Typ uw taken in de tag 'Naam' en een beschrijving in de tag 'Waarde'. Voel je vrij om hier te experimenteren met meer nesten.

Klik op toevoegen om dit af te ronden. Of klik op Annuleren als u twijfels heeft over het toevoegen van de gegevens.

Stap 11: Tada

U zult de lijst groen zien oplichten en vervolgens stevig materialiseren als de gegevens die u instelt. U zult merken dat Firebase de 'Namen' van de lijsten en de sublijsten automatisch alfabetisch sorteert.

Als een taak onvolledig lijkt, klik erop en scrol naar rechts om deze volledig te zien.

Stap 12: Voltooi het toevoegen van uw taken

Herhaal dit om je lijst te maken!

Een korte samenvatting:

Nieuwe buckets door in de meest linkse lijst met projectproject-achtige naam in te voegen.

Nieuwe attributen door op taak in te voegen.

Nieuwe sublijsten door taken in een lijst in te voegen!

Je kunt deze lijst altijd en overal bekijken! Het is perfect gesynchroniseerd. Genieten van!