In this Bubble tutorial, you will learn everything you need to know to get started with working with workflows in Bubble. This is my workflow beginners guide for Bubble.io. But before we get started, if you found this on YouTube, please give us a like and subscribe.

Introduction to Workflows

So, workflows. They're a key part of your Bubble app and let's get something simple. And then also I'm going to just hint at the next step after that. So I've added two elements to my page and I'm in a brand new app. And this is going to be as if I'm adding a contact. So I'm going to be creating new data, a new entry in my Bubble database. And the first thing I need to do is go into data and create a new data type. This is like a... each data type is like a separate sheet in Excel. It's a separate database, but you can establish relationships between them. And that can be one way to think about it if that helps. So I'll create a data type called contact and then I'm going to add in a field called name. And I'm going to make this text. And that's all I need to work with the form that I've got on the page. So now I can click on my button and I can say add workflow. And this automatically adds in a workflow for when button create new is clicked, which is just what I need it to do. And so I can click on here and I'm going to go to data, create a new thing, and that is adding in an action into my workflow to create something new in the database. And so I can create a new contact. So no code. It's quite easy, really. I then add in a field and there's the field that I created. And because the field is of text, it's expecting a text input. And so by clicking on here, I get a load of options, but I'm just going to go straight down to contact first name because that's an input. And then I'll say we'll save its value. Now, what do you do if you can't find what you're trying to link to from the design tab? There can be a number of reasons for that. One can be if you've done a lot of copy and pasting, because the reason that the element's name is input contact first name is because I've updated the placeholder here. If I change this to name, Bubble's going to update the placeholder, which means it also gets updated here. However, if I manually rename it, say like version two, and then I change this back to enter your name, because I've manually renamed the place, the elements within Bubble by updating the placeholder, it doesn't overwrite. It's now stuck with this name, and then that's the name that I'd have to find when I'm trying to match up data in a workflow. And then I'm going to add in another one. I'll say reset inputs, and let's preview that. So I'll say, Nick, create a new thing. I only have two actions in there, so I didn't even notice the loading bar. I'm going to assume that that has worked because if I close it and now I go into data, my contact Nick has been created. Now I'm going to show you one other thing that we can do with workflows, which is going to be that we can refer to previous steps, and this is particularly useful if you create something, and then you need to establish it as a relationship to other things. So, for example, let's do this by going back into data, and I'm going to create a new data type, and I'll call it company. And I'm going to say that a contact has got a company, and so I'm going to add in a field, I'll say company, and then this will be of type not text, but type company. And I'll add in another input. I'm using fixed layout here so that it's quick, but if you're doing anything that you're going to share with anyone, please, please, please use rows and columns and check out our tutorials. Basically our design beginner series to understand how to do that if you're unsure. But this will be enter company name. So my workflow now needs to be a little bit more complicated because I want to create both a contact and a company, and then save the company back into the contact. So I think I'll illustrate a couple of different ways to do this. First of all, just working with what I've got here, I would say we need to do the same thing, which is create a new thing, company. Now company doesn't have any fields that I've created, so I will put in a name field for company. And then find my enter company input and set its value. And then this is what I'm trying to highlight is that I can say make changes to a thing, and I can say make changes to the contact, the result of step one. This is just so helpful to get your head around this that you can refer to what is being worked with in previous steps. This would also be the same if you made an API call, and we've got loads of videos and API calls. For example, working with OpenAI, getting AI text generation into your app, you make the API call, that's like our step one, and then we would refer back to that step one to get data out of the reply that we get sent from that API call. But for now, I just want to work with the same contact that's created in step one. And then I can say company equals result of step two. Let's try that out. So this time, I'll say Ellie, and company is say Google, create new. And if I go into data, app data, we now have got Ellie added in, and the company is showing the unique ID. And I'm going to show you a real quick tip just because it's staring me right in the face. I'm going to go primary fields and say contact is name and company is also name. And that just means that when I'm viewing data in this database view as the app editor, instead of showing the unique ID, it's actually going to show that field I selected. So company name, Google being shown there. And then, of course, company contains Google. OK, so one last thing I'm going to show you, which is that since workload units came into effect, we want to especially, I mean, we always have, we want to especially build our apps in a lean development style. And so we can actually reduce the number of steps in this workflow. And we can do that by creating the company first. Then we don't need to make changes to a thing. And we can say contacts company equals result of step one. Now that works in this particular situation, but it's going to be down to you to work out what order you need to put things in your workflow in order to have the data when you need it. You also should be aware that, in fact, I'm going to undo that because this will perfectly illustrate it. Go back, back, back. You should be aware that Bubble doesn't necessarily run workflows in a linear left to right fashion. Bubble will self optimize. And one way, an issue that can cause is that you could try to be working with data at a later step in the workflow that hasn't actually arrived or is ready to work with in a previous step. The way around that is that if you use this result of step one, Bubble knows that it can't run step three before step one. That's particularly if you're working with APIs where you have to wait for the third party service to send the data back. But it's one way that you can control the order of operation in workflows. So if you found this video useful, please like and subscribe. That helps out on YouTube. And if you are at the beginning of your Bubble journey, there is nothing better than you can do, then head to our website, planetnocode.com and join our No-Code App Builder developer community. Become a member and get access to hundreds of our Bubble tutorial videos just like this one. .