Page 4: Data Integration: Firebase and API Connectivity

4. Data Integration: Firebase and API Connectivity

For dynamic and data-driven apps, integrating external data sources is essential. Thunkable offers seamless integration with Firebase and APIs.

4.1. Connecting to Firebase Realtime Database

Firebase Realtime Database allows you to store and sync data in real time. To connect:

  1. Go to your Firebase project console and create a Realtime Database.
  2. In Thunkable, add the "Firebase Realtime DB" component from the "Data & Cloud" section.
  3. In its properties, enter your Firebase API Key and Database URL.

Now, in the Blocks Tab, you can use Firebase blocks to store value, get value, or listen for changes at specific data paths.

when Button_Save Click do
  call Firebase_RTDB1 save value Text_Input1's Text at "users/username"

4.2. Working with REST APIs

APIs (Application Programming Interfaces) allow your app to communicate with other services. Thunkable's "Web API" component makes this easy.

  1. Add the "Web API" component from "Data & Cloud".
  2. In its properties, set the URL of the API endpoint.
  3. In the Blocks Tab, use blocks like call Web_API1 GET or call Web_API1 POST.
  4. Handle the when Web_API1 GET receives JSON event to process the returned data.

Example: Fetching data from a public API

when Button_Fetch Click do
  call Web_API1 GET

when Web_API1 GET receives JSON do
  set Label_Result's Text to response

Remember to parse JSON responses using appropriate blocks (e.g., get object from JSON).