# Vocabulary app - Newbie!

**URL:** https://community.thunkable.com/t/vocabulary-app-newbie/3994817
**Category:** Issues / Bugs
**Created:** [July 14, 2025, 7:06am UTC](https://community.thunkable.com/t/vocabulary-app-newbie/3994817 "2025-07-14T07:06:16Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![evie23321](https://avatars.discourse-cdn.com/v4/letter/e/bbce88/32.png) [@evie23321](https://community.thunkable.com/u/evie23321)
#### Post date: [July 14, 2025, 7:06am UTC](https://community.thunkable.com/t/vocabulary-app-newbie/3994817/1 "2025-07-14T07:06:16Z")

</div>

Hi there! I’m new to Thunkable. Trying to create a very simple vocabulary app - one of those standard quizes where in each round 4 pictures are shown and you have to select the correct picture when hearing a word. I’ve created a container with four images, connected to google sheets, but have been struggling for a day with the blocks to actually fetch random images from google sheets into the images. ChatGPT seems to provide solutions for no longer existing blocks. I got stuck at step 3 (see below)…Any ideas how to solve this or is there perhaps a ready template out there or a tutorial explaining this? Thanks a lot for your help to this newbie!

✅ STEP 1: VARIABLES (You’ve likely already done this)

From the **Variables** drawer:

1. `initialize app variable allFlashcards to empty list`
2. `initialize app variable shuffledList to empty list`

* * *

### ✅ STEP 2: LOAD DATA FROM GOOGLE SHEETS

From the **Blocks view** under **Control** and **Data Sources** :

blocks

CopyEdit

```auto
when FlashcardScreen Opens
  set app variable allFlashcards to list of values in GoogleSheet "YourSheet" in Sheet1 in Default View

```

Make sure your sheet has a column `image_url` with **direct PNG or JPG links** (like ones from [imgur](https://imgur.com).

* * *

### ✅ STEP 3: SHUFFLE 4 RANDOM ITEMS

Now you’ll use the **new “Shuffle list with quantity” block** :

1. From the **Lists drawer** , drag:

blocks

CopyEdit

```auto
set app variable shuffledList to shuffle list with quantity [4] from list []

```

1. You **can’t drag app variable directly** , so do this:

- In the **Lists drawer** , find this block:

blocks

CopyEdit

```auto
get list [app variable allFlashcards]

```

- Drag it into the empty `[]` slot in the shuffle block.

✅ Final result:

blocks

CopyEdit

```auto
set app variable shuffledList to shuffle list with quantity [4] from list [app variable allFlashcards]

```

💡 **Note** : You might need to hover a bit before it drops into the slot. If it’s not snapping, try zooming in or drag slower.

* * *

### ✅ STEP 4: SET IMAGES

From the **Image drawer** , drag and connect:

blocks

CopyEdit

```auto
set Image1.Picture to get property "image_url" of item #1 of app variable shuffledList
set Image2.Picture to get property "image_url" of item #2 of app variable shuffledList
set Image3.Picture to get property "image_url" of item #3 of app variable shuffledList
set Image4.Picture to get property "image_url" of item #4 of app variable shuffledList

```

If `get property of item` isn’t available, you might see this updated version:

blocks

CopyEdit

```auto
get object property "image_url" of item #1 in list [app variable shuffledList]

```

Either one works.

* * *

### ✅ STEP 5 (OPTIONAL): Add a “Next” Button

If you want to show 4 new cards when the user taps a button:

blocks

CopyEdit

```auto
when Button1 Click
  set app variable shuffledList to shuffle list with quantity 4 from list [app variable allFlashcards]

  set Image1.Picture to get property "image_url" of item #1 of app variable shuffledList
  set Image2.Picture to ...

```

* * *

### ✅ STEP 6: TROUBLESHOOTING

- Confirm image URLs are **direct links** ending in `.png`, `.jpg`, etc.
- Add a debug label to see if data loads:

blocks

CopyEdit

```auto
set Label1.Text to join ["Loaded ", length of app variable allFlashcards, " flashcards"]

```
