Connecting an App to Data

Thunkable coding

DragAndDropCode.com, David Wolber

OPEN UP A WORLD OF DATA TO YOUR APP BUILDING

COVID Data

Genome Data

Sports Data

Political Data

APP

User-Generated Data

DragAndDropCode.com, David Wolber

Apps with Dynamic Data

Example: quiz app, the questions/answers are “fixed data”.

​

What if you wanted to create a quiz maker where a user enters the questions/answers? This is “dynamic data” and in this case “user-generated data”.

​

For this, you need to store data in a database/sheet, so it is persistent.

DragAndDropCode.com, David Wolber

Thunkable Makes Connecting to a Spreadsheet Easy

Thunkable App

use spreadsheet as your database

DragAndDropCode.com, David Wolber

DataViewerList and Data SoURCEs

It is super easy to show info in spreadsheet in your app.

1.choose Google sheet as data source 2. connect DataViewer to it

DragAndDropCode.com, David Wolber

Demo: Connecting an App to a sheet

DragAndDropCode.com, David Wolber

Thunkable Generates blocks for Reading and Writing Spreadsheet Data

DragAndDropCode.com, David Wolber

Accessing Cells and Columns

get the value from a single cell. Replace “id” with either an index number or an auto-generated id for the spreadsheet row

get an entire column from the sheet and put into a list

The purple blocks below are found in Data Sources folder

what is the result of each operation?

DragAndDropCode.com, David Wolber

Processing Data

Why access data from sheet? Why use the “get value from” or “list of values in”?

You do it to “process” the data, e.g. if your sheet has user ratings for a musician or song, find the average of those ratings and show to user.

Another example is to bring in location data (lat/long) to show where something is on a map.

DragAndDropCode.com, David Wolber

Sample: Find the Average of Ratings

DragAndDropCode.com, David Wolber

Code to Find the Average of a column of Numbers

bring in ratings from sheet

loop through list and add to running total

average by dividing total by #ratings

DragAndDropCode.com, David Wolber

Adding Data to a Sheet

DragAndDropCode.com, David Wolber

FilterED Views

DragAndDropCode.com, David Wolber

Now you can “Appify” any Data Source!

DragAndDropCode.com, David Wolber

If your Data Source is NOT Google Sheets

• You can use other databases like “AirTable”.�
• You can’t use numbers to id the rows in table. You have to use the generated ids.�
• Check out slides below if you are not using a Google sheet for your data source

DragAndDropCode.com, David Wolber

Advanced Slides after this...

​

DragAndDropCode.com, David Wolber

Working with IDs and “Next” Navigating through Rows

• Each spreadsheet row has a “hidden” id column
• The ids are auto-generated (see examples below)
• The ids are not row #s 1, 2, 3, etc.

DragAndDropCode.com, David Wolber

Working with IDs and “Next” Navigating through Rows

1.use data source block “list of values in” to get all ids into a list

idList

1

​

​

​

2

​

​

​

​

3

DragAndDropCode.com, David Wolber

Working with IDs and “Next” Navigating through Rows

2.use “in list find” to get the index of each id in the list.

idList

3. Increment index and then get the rowid of the indexth item

DragAndDropCode.com, David Wolber

Google Sheets and IDs

All data sources have an auto-generated id which is a long text.

If you are using Google sheets, you can instead use numbers for your ids: 1,2,3, etc., to access items from the sheet. For example:

​

​

​

This block will get the value from the 2nd row of the sheet (and the “name” column). Note that the header row isn’t considered, so the cell in the 2nd row in name column is “La Taqueria”

Note: In the book, chapter 5, it shows how to use auto-generated ids which is more complicated. Just use numbers (1,2, etc.) if you are using Google sheets

DragAndDropCode.com, David Wolber