Bubble.io Tutorial - Create a list of all countries in Bubble

In this video you will learn how to create lists with all countries of the world, for example to define dropdowns for the checkout process.

Free Countries Plugin from Coaching No Code Apps: https://bubble.io/plugin/countries-1485907924596x944498889467625500

Free CSV file from No Code Germany for all countries: https://drive.google.com/drive/folders/1ZNwPlOBpAB6zLFUARoMzG3XVgxmm8CRT?usp=sharing

Video transcript:

Hello, my name is Chris Strobl, I'm the founder of No Code Germany and today we're talking about countries in this example Check out Stripe See, we have a dropdown menu with all the countries where we can use Stripe. If I do the whole thing in English, Germany is called Germany. And if I do the whole thing in German, Germany means Germany and America means the United States. And how can we integrate this information in the bubble? There are two ways. One is with the Country Plugin. This is a free plugin and the other is a CSV import, where you have more freedom. Let's start with the Country Plugin. This is a free plugin from Coaching No Code Apps and there you have the possibility to enter all kinds of country information via a so-called Rest API, namely Ress Countries.

And now we want to apply this plug in. I have already prepared a Repeating Group here, this is a Full List and as Type of content we select List all countries. And Data source Get data Froman external API. Countries list all countries. And then we sort that all sorted. And now you can see here, and this is the special thing about the plugin, completely different ways to sort the whole thing. And we choose here translations german come. And the constant No. And now I'll add an index here for clarity. That is called in Search Dynamic data Current cell's Index. For German, we now select URL countries in Search Dynamic data Current cell's List and we take the Translation German come. For English, we again select Input Field, Dynamic data, Current cell's, list, URL Countries and Name come.

Let's go to the preview and have a look at the whole thing with the Country Plugin.... And we now see how we have a full list with no less than 250 countries and always once in German and once in English. As you have seen, it takes a while until all countries are loaded and therefore a second possibility that is faster is a CSV import. However, for this you need the schedule in the bubble. The cheapest plan is the Personal Plan, which allows you to upload up to 100 rues in one CSV file. And that is why I have prepared a few files.

On the one hand, all countries. That is again 250 countries and on the other hand also the countries up to 100 countries, split into three files. You can find this link in the Shownotes. The big advantage of CSV imports is that you can leave out the countries that don't suit you, so you can adapt the whole thing to your target group. We now go back into the editor and upload these files. For this we go to Data.

And now look here, we have a Custom Data type Countries, which in turn has two text fields German and English. If we now go to App data, countries, then we go here to Uploads. Icon Case Total Block. And you select Countries Part 1 CSV here. Type of data countries and you click here on Map Fields and now you can see here how Bubble already automatically makes a suggestion If this doesn't fit perfectly, we can select it again. Then click on Value Day Data Get data Set is ready to upload and uploads data. Then we go to New Exhaust Pick up Fall to Upload Part 2 We repeat the process because data upload data. And again New Uploads PKW to Exhaust Part 3 Valley Data Hublot Data. After that refresh here. All countries and we see that we have all countries now in the database. If we go back into Designated, into the Repeating Group CSV Import, then we Type of content countries. Do Search for countries sort for German the programme No. Analogous to the previous Repeating Group, I would like again for clarity Input Field Dynamic data Current cell's Index.

And here again select Insert Dynamic data Current users countries German and Current cell's countries English. If we now go to the preview, we can take a look at the loading times of this. And you can see how we have the same database, but the CSV imports load massively faster than via the API. I would say that both ways have their advantages and disadvantages and I would like to show you a third possibility, namely to work with option set, because the countries do not change often, but remain static. If you go into the database and click on Option set, you can define a custom option set here.

I have already done this once here as an example. With German and English and then the different options. However, I would also like to show you the advantages and disadvantages between option set and a database variant. Option sets are much easier to derive in the live application. In addition, your database is also much tidier, but unfortunately you cannot use CSV imports or workflows to add the data automatically. Therefore, it is also tedious to insert the data and, in addition, display is always present as a value.

And with many entries, such as all countries, the clarity also suffers here. And so you are really free to apply exactly the right variant, plug in option set or CSV import, for your use case. With all the advantages and disadvantages.

If you liked this video, please click on the like button and subscribe to our channel. If you have any questions, please write us in the comments. I wish you continued success with Bubble and see you soon.