Softr 101: The Ultimate Beginner’s Guide to No-Code Apps
If you are brand new to Softr, never opened a software before, you ar going to love this video. Because I am going to be breaking down for you Softr 101, that is to say we will be going into detail on how as a beginner you can approach Softr and build your first no code app. So if learning more about putting together your first no code app in Softr is of interest to you, stick around and let's get into it. Welcome back to the channel, if you are new here, my name is Gareth and this is Gap Consulting. It's our mission here to help you unlock the full potential of no code tools and Softr is one of those no code tools that we have been using for years and making a ton of videos about because, honestly, it is one of the best ways, if not THE best way, to build your first no code application. Now, in this video, as I said, I am going to be showcasing
kind of a beginner's approach. This is Softr 101, if you've never seen it before and you know you want to build your first no code app, this is the place to start. But before I get into the heart of things, I want to invite you to follow along with me, go ahead and follow the instructions on your screen you see right here to take advantage of a soft or promo code, promo code. If you are not already a paying softer user, you can get your first month for free, and this is over a hundred dollar US value, so definitely sign up with that promo code. It also gives some love back to the channel but, more importantly, gives you a free month of softer so that you can check out all the features I'm going to show you here now. Let's jump on into my screen. But, surprisingly,
we're not going to start in softer and that's because we first need to understand what Softr is and it's not usually the place that I start building my no code app because the data has to live somewhere. Where is your data? Well, in our case, I'm going to be using Air table as the backend softer originally was built as that frontend application for air table, and so I still think they're air table. Integration is one of the best. If not the best integrations that they offer. So I'm going to be building my back end in air table. And by the way, I'm using a template that we offer for free here at gap consulting. If you want to grab this template, you can also grab it for free at gap consulting dot IO slash templates, but let me quickly explain what this template is doing. So we're in the back end in the database elements of this. And if we are sharing our access to someone external from our organization, things get really costly with air table. And that's because let's imagine that we had like some freelance editors. I have a table,
right? Here are editors and they get assigned content and then it's their job to go through and edit this content great. Here's the issue. These editors are going to cost me seats in air table. So you can imagine that if I were to deploy a front end interface in air table that looks maybe something like this, well, this could get pretty costly, right? This particular editor, you know, we could share this, but each editor would incur my air table per seat license, which doesn't make a lot of sense. If we're sharing external applications when we build internal applications, air table is still one of my go to choices. But when we're launching something forward facing and we're sharing it with hundreds, maybe even a thousand or more users, then it definitely makes sense for us to not incur a license fee for each user who's going to be signing up for the app. This is where softer comes into play and one of the areas where it really shines because softer can use the back end database that we build in air table, this stuff with all the different tables that we build here, we can access based on their email address. So we can basically say, Hey, we're going to send out links to everybody based on these example email addresses. Every time
somebody logs onto the platform, they're going to be logging into our personal web application that we put on any site we want to. to do is get the rights to a domain. We can then build our own application and publish it on our domain inside of softer. I'm going to show you exactly how to do this, but we always have to first start here on the back end. So here we are,
we've got really two key tables with a third that we're going to drill into, but the two key tables are contents, for our example, and social media posts. So you can imagine that we're publishing different content, or we have different marketing campaigns, and then we have our social media posts that link to the different content. So we want to be able to say, Hey, we put together, let's say a blog or a vlog or an article. And we're going to share that on different social media posts, and that's what this other one is here. Now the third component here, and this is critical for every application you build in softer. The third component is your users table. So for our example, I'm imagining of course that our users are these external editors. We are going to want to share
access with them and this is a necessary ingredient for every softer app. If you are of course bringing users into the application, you can build a public facing application where people do not have to log in with softer. But you're only going to be really scratching the surface of what it can do if you want to dive into the guts of it and really get a full blown application. You
want unique user experiences. And as a bonus, you can add a role to this as well. This is a, a simple hack. If you are new to this, maybe what you would start with is wanting to cultivate the experience for your different users. So I could create a role. Let's say I've got managers and I have editors here. So this is going to help me differentiate between the two and I can label
some people as managers and some as editors and now inside of my software app, when I build it, they are going to have different experiences and I'll show you exactly how to cultivate the different user groups. But let's head over into softer now and get to work. The first thing it's going to ask when we're building a new application is how do we want to get started? Are we starting from scratch are we starting from a template and by the way, softer has nearly a hundred templates, or are we going to start with ai actually like ai a lot as a first place to start here and we can say exactly what we're doing. So we might say, um, Hey, we're making an internal tool and you see that it gives us a sample prompt. I'm going to highlight this, and get rid of it. And I really want to be thoughtful about what I tell the AI. And one of the issues I have right now is that
I only get 200 characters if I'm building an app through a prompt with softer. I really hope that they open this up because I would love to share more information and therefore have a better application built for me, but at a high level I need to tell software what this is. I'm going to say, this is an app for editors to create content elements. My tables in air table our editors, let's flip back into air two books. I've already forgotten what are my other ones called? I've got contents and social media posts. So let's go with that contents and social media posts. All right.
Now let's also tell software and you'll already notice I'm more than halfway through my allotted count of characters, but let's also tell it I have two user groups in a, my editors table, and I'll call them managers and editors. And that's about as much as we're going to be able to fit in here. So let's go ahead and preview our app. Now what software is going to do is the AI component is going to, to build out at least the starting pages for our application. And at first, our application is going to be hosted on a softer website, a softer URL. But if we want to in the future,
we can redirect this to a different URL. So let's take it one step at a time. So it's created kind of the backend for us here. We can go through different themes in terms of the overall look and feel. I'm going to go with a modern theme here and choose, let's go with the light blue accent color.
And we're going to create our app. So again, it's building this in the background. Of course, we can have full customization over what it's going to create right now. This is simply a launching point. And if it's your first time ever building an application you know, having a launching point is going to be very helpful. One thing I would strongly recommend though, is being thoughtful about that prompt. As you saw, when I generated my prompt, I was specific to tell it what tables I had in my database and also what different groups I had for my users. I want to
see if the AI was smart enough to actually bring that into the application. I tend to not to like a darker background on my apps, but we're going to roll with it for now. So I want to direct your attention to a couple of places in software as you're building out your own apps. You know this is the building component. This is the back end where you get to build it. And when you go into
preview mode, what it's going to do is open up an example instance of your application. And you can just kind of browse the app. You can check out the different devices. So if you're on a desktop, this is what it looks like on a tablet. And this is the mobile device do note, of course that it's optimized for mobile devices and you can scan this to your device and a just like actually try to check it out from your mobile device. You can also go through up here and preview it as different user types. So we have different users kind of just programmatically added to our application from the beginning. And if we have these different people, we can go in and experience from their
perspective. You'll notice that right now we've got an individual contributor and manager types here. So we already have two different roles in our application. So this is the place where we are going to be able to preview our app. And it's always advisable that you preview the newest or the latest version of your app before you publish anything to make sure that all your filters are working appropriately etc. All right, let's go back now into the actual application itself and one place that we must know about on the left-hand side is the pages to the apps. So
these are all the different pages that the AI has created for us. We've got a contents page and we can drill into each one of these pages and see what is going to be shown on the application. Now we haven't actually synced our application to the backend data yet. We're going to have to get
to that in a minute, but right now it's just using sample information. So you can see it's got some content that it's displaying, there's a button that people can click to edit this. And if we select this block on the right-hand side of our screen, it's going to say, hey, you know, there's really uh, no data here yet. Do you want to copy the generated data and create an instance somewhere or do you want to use your actual data to super power this application? And of course, in our case, we already have that backend. So I'm going to say use my data instead. It's going to
verify, you sure you don't want to copy out the template data. Yes, I'm sure. And we're going to want to synch it up to a data source. So here you can see, we've already synced multiple different software applications to air table in the past. In this case, we're going to need to add a new
data source. It's really actually simple to do this. As I mentioned, air table was one of the first and best integrations from software, but do notice that you can bring application data from a lot of different online software. So notion SmartSuite, Monday, HubSpot, Google sheets. I mean, it's really almost endless at this point, anywhere that you're storing data. You can put an app together in softer and make it bring in that data that you already have in a different part of your business. So here, I'm going to choose air table. I just say, continue. It's going to open up in a new window. This is really simple. I just have to make sure I sync it properly to this. And I think that we call this the content production and social media template. Again, full access to
this template. If you sign up at gap consulting dot IO slash templates, but here we are. I've synced it up and I simply grant access. It's really not hard at all. And now of course I need to map not just the database and air table, but more specifically the actual tables and different data points. So here I am on the contents page, right? So obviously over here on the right, I'll select the base that I just gave access to. And then I have to select the proper table.
And of course I have three tables in this case, this is content. So I can map it to my content. What you're going to see happen right here is the actual content that we have living in our database in air table is what's showing up here. Now that is really powerful stuff. Not only is it able to show up here, but we're able to grant our users, different permissions. As you see, we've got an edit button here. So we can add an action to this particular content and say something like,
Hey, you can edit this information. We can conditionally show this button and say, maybe only managers get permission to edit content. So we can add buttons just like this, make them conditionally visible, thereby giving only certain people permission to take actions inside of our application, but understand that people who are accessing the application can create new records. They can edit existing records. They can delete, I mean, these are called crud permissions,
right? This stands for create, read, update and delete. This is full blown data access. So just because somebody is accessing our software app, they are not limited in any way. They can still take all actions to create new records, read everything that we want them to update. Only the things we want them to and ultimately delete the records that we no longer need. So we can grant those permissions at a very granular level based on roles, based on user types, et cetera. All of these pages are editable, as I was mentioning, we can create new pages and we can add as many blocks as we'd like to a page. And furthermore, we can limit to the data that
shows up on the block back on the source side of things. You'll see that we have not only labeled the source and the base and the table, we can also limit it to a specific view in air table. And then we can also set up conditional filters. Maybe for example, we only want to show content that is not been published yet. So things that are in a particular status or around a specific date, we have full control over these filters to only bring in the elements that we want to on the different components of our app. Very, very powerful stuff. And honestly probably not being
taken advantage of to its full capacity by most of of the clients that we've worked with. Now we also have the theme here, this is where we can go and easily change the look and feel of the app. You'll see the accent color here. If we decide we want to change that up to a green, it's pretty simple to do, and just like that after a quick save our app has a new look and feel. So I love the fact that we can quickly and easily update the look of something. Also we have our data source back here, so this is where we've synced into this app. You'll also see all the other data sources that
we've created at one point in time, most of them for examples on YouTube if I'm being honest. All right, now for the last really, really important part of the software app building experience. We've got the users, this is critical because right now it's not actually synced to a data source and it has to be synced in order for us to actually have a functioning app. So we will sync it with the data source. And of course it knows that we already built that connection to Airtable and it asks, if this is where our base is and it sure is, but we have to find that editors table.
This is the critical component of syncing up users inside of softer. Now we can choose to sync all of the records there, or we might only want to bring in some of the records. Like maybe we want to activate or de-activate people with a checkbox and air table, we can then set up rules and say only certain people get access to the app, but for us we'll say all. And of course at a minimum we need an email address and in our app we had the email address field back in Airtable. Just as a quick reminder, it just looked like this. It was not an actual email field. It was a text field,
but it still works just the same for softest purposes. So we can also bring in the name and use an avatar. So if you've included a file in air table, your users can actually bring in profile pictures as well. And then you get some softer managed fields, like what time was this user created date and time? And when was the last time we saw them active in the application, but at a minimum we need that email address. And that is going to create the different users in our experience. Now, if you recall the AI, as we built this tried to create two different users, but it wasn't quite what we wanted. So now it's time for us to dive into user groups. Of course,
we should also probably delete the other pieces of information that we have that softer created as part of the default of the app. So we'll select them here and we can delete them. And we have to of course do a little safeguarding here, delete for users forever. And just like that, they are gone, but you'll notice our user groups. We don't have people actually assigned to two user groups and we can do this manually, but it's not my favorite instead. I'd like to go into user groups and set up some rules. So we've got conditions here, an individual contributor and a manager we're already built. We can add custom groups as needed. And if we go into edit this,
you'll see that we've got role is manager here, interesting. And what is the rule here? Role is individual contributor. Well, if we actually flip into air table, remember we built a role field and air table knows that this role field exists because it's now synced with our editors table. Well, if we want to fix these user roles, well, we need to fix the language because the AI wasn't quite smart enough to know exactly how we labeled these roles. So managers,
I'm just copying this actually, and I'm going to go into the manager's rule here again right here. And you'll notice that this says manager singular. The way we, we created it was managers plural. I don't actually need to have copied it because I see it from the dropdown now. So I can click save and now managers are set up appropriately. Lastly, I can go into edit here and I'll say editors. So these are my two different roles. This is just one way that you can create roles. Sometimes we have conditions like did this user purchase X, Y, Z. And if they did, they see something and if they
don't, then they're not included in that group. You can get very granular with these permissions, but at a high level, if you're building your first application, it's quite simple to just set up a role and you can just make it a single select field, which basically means back and air table. You can only have one option picked here at a time. Notice that I only have one manager and that is Alice. So if I want to see this information reflected now, back into softer, while I have to publish the changes I made to my users, so back in softer, I published my app and this is just taking into account the new changes that we just put out there. I don't actually want
to invite users right to the app because this is just a demo. So no, let's not do that. But if I go back to my user's table, now you'll see that the user groups are loading. And so it's bringing in this information and it's naming these different users or assigning them to groups based on what it found in air table. So Alice here, Alice Johnson is the only manager in everyone else is in the
user group that we called individual contributor, which back in air table is marked with the field type editors, right? Or the single selected dropdown type of editors. So this is how we build different permissions for different users and softer. And now of course for the grand finale, if we go back to our pages, we can assign not only buttons to certain user groups, but we can also conditionally hide elements in our application. This whole block right here, for example, we might say, we don't want the editors to see this. We can go into visibility here and change who can actually see this. We can say only a logged in user who is a manager can see
this block. This is just an example, but this is exactly how you can cultivate the different user groups inside of your application. Once you're ready to go, you can publish this thing. But before we get to that, if you want to assign it to your own specific domain, you can update your custom domain right here. You can go through the steps you know, if you purchased your domain through Namecheap or GoDaddy. There are certain steps you have to follow to get software, to be able to publish there. But we have successfully published many applications to specific domains.
It's very simple to do. All you need is of course to own that domain and have permission to update what's happening there, so you can purchase that and then publish your application. Honestly, I'm pretty much whatever available URL is out there. So I know we went really fast in this
video. There's a ton to cover here in Softr but I hope this gave you the basic building blocks so that you can come together and build your first no code application. As you go about building these things, understand that they take time. You're not going to get it all right. The first time, it's a big learning curve. And if I'm being completely transparent, I'm learning new things every day myself. And I've been doing this actively for 40 or more hours a week for the last five or six years. So there's definitely a learning curve here and things continue to
improve within this industry. There's always new things. So stay with it. Don't get discouraged if your first application isn't exactly what you envisioned. If you do find yourself needing a little bit of help, we've got a team standing by that you can check out on our website and in fact in our very own Softr application. So go ahead and swing by our website and you can grab access to that. If it's of interest. Of course, if you got value from this, a thumbs up and a subscription to the channel would be amazing, but most importantly, keep on building.
2025-03-25 02:59
