Automate like a boss using Make

hello everyone this is Ashish from fin Suite in this video we are going to check out a very powerful alternative to zapier which is make and previously they were known as integromat we are going to create a few automations with webflow and we are also going to see some of the very basics of the mate so without further delay let's dive right into the video [Music] yeah first let's start with the basic comparison I'm not going to dive deeper into the comparison like you might be thinking why make is a better platform so here is the make a dashboard and just to show you what platform looks like so here is a make which is make.com and the basic differences here uh with cpf there are many differences and uh we have a article by make itself where they are comparing zapier and make so you can also read that article but I'm going to tell you the you know the main points I think that are really good about make itself so the very first point I think here make is much better than zapier is the visual Builder so make itself is having a visual Builder to build automations so right now on the screen if you can see uh we have the scenario which is all scenarios so just like in jpr it is called zaps the automations here it is called scenarios so I can simply click on new create new scenario and from here I can start creating the automation so the first plus point that may gets here compared to zapier is the visual Builder here you can see I can just click on this module this is called a module each applications this circular thing you are seeing is the module when I click on it I can simply add my apps here for example where flow and then I have all the API endpoints which is available in webflow so for example I can watch for form submissions uh e-commerce orders everything basically that is possible with referral e-commerce sorry workflow API and if I click on watch events so this is the module itself and now you can see when I when I want to automate this this thing I will simply click on plus and I will add another thing for example a table so for example uh once a form is submitted in webflow I want it to go to a table so you can see that I am actually visually building the automation so that is uh first plus point of the make which I like a lot so here you can see I have the Automation and you can move the things around so sometimes you have paths and routers so it's also very like visually look you know it looks very nice and for you it's very easy to manage it so for example I can add a router here so in zapier they are called paths here it is router and you you know here you can create unlimited routers there is no limit to that so for example I can click on router and I can add multiple routes and you can see that I can visually see the automation itself so again I think one of the biggest plus point of using make here is this visual Builder here I think the second plus point that makes get over the appear is the error handling part uh make provides through which with a lot of advanced error handlers so I can simply for example click on here and if I click on ADD error endless you can see there are multiple error Handler types here ignore commit resume rollback uh you can read more about this other renders but some of them are like some of the most popular one that I personally use is ignore which basically if there is error and you want to ignore the error for some reason you can ignore it and the commit is Amit is the error Handler where you know if there is error it will not stop the automation but it will mark this as a success here we have break break is also one of my favorites where you know when there is error you can actually set interval times so for example I can click on click and I can set number of attempts it will try and in interval of time like 15 minutes so after 15 minutes it will retry the automation there are many tools which takes sometimes you kind of generate the required result for example I am using uh AI image generator right so once I make a API call you for example let's say uh Dali right it's taking maybe 10 seconds to generate it and before 10 seconds I made a request to get the image and for some reason it's not generated so I can make another request maybe in like one minute after one minute again right so in those cases we can use this particular error render there are other things other other error handlers as well and with combinations of filters and all you can make it super Advanced uh yeah by the way there are filters as well so in between all the automations you can simply click on this add filters and everything so yeah that is the basic of this thing uh the plus Point here now I also think the user experience itself is better I feel that zipper user experience it is a bit laggy or choppy I would say you know you are clicking things things are jumping a lot uh you know when you are navigating throughout the dashboard in zapier so I think that is also a plus Point here you get a much smoother experience when using make uh yup and the fourth point that I have here is the native endpoints that you get here so just for example I created a webflow module here so let's simply go back and I can discard the changes I will simply create a new scenario to show it to you so let's take an example of let's take example of notion this time so notion I can type here in motion and you can see that I have a bunch of options here from their own API documentation so this is one of the plus points when using make the native endpoints that you get here all the options that you are seeing here for database page content this is much better compared to zapier you get a lot of native options plus when you know you have a application that is not supported in make you can always make a HTTP request and basically you can use any application that supports API and if they have their own API system right so you can use the HTTP module to connect with it and use it for example I recently used it for slack and slack is having their own API and and make supports slack natively as well so you can use that and also you can make HTTP request for specific API calls which is not natively supported sometimes yeah so this is slack and yeah all the popular platforms are supported sometimes when you don't have the platform you can always make HTTP request the plus point that CPR gets here is that it supports larger number of applications like all the new startups all the new tools that you will find on internet will first prioritize zapier as their partner or automation partner but make make is I think much better I generally what I generally do is I use their API documentation and create a make custom HTTP request in those cases because the experience overall is much better in make yeah I think uh the one the last point that I would say here is about going to be about pricing pricing is much better in make it's much more affordable and it's based on operations again it's called tasks on zapier here it's called operations so overall it's much better the operation counting system they have in make is also much better compared to zapier so yeah so these are the plus points pricing is also amazing here so if I for example let's see if I go to organization discount Discord the changes let's go to organizations subscription and here you can see the plants uh it's cheaper than jpr you can see yeah uh and uh one more plus point I would think I will add here are the inbuilt tools that you find that you get with make so for example I'm creating a new scenario here so you get a lot of tools here right here you have iterator array aggregator so you can find detailed descriptions of this but these tools are really powerful let's say we have a webflow Ecom order and inside that we have 10 orders placed in one go right so what this particular option will allow us to do this one which is iterator it will split up all the orders and create 10 items inside your table so just just for an example this is just an example use case but you get a lot of inbuilt tools that you can use you get tools for uh you know formatting your text setting variables getting variables there is an increment function which we are going to use in this video in this session today then we have text related tools as well so there is a lot of inbuilt functionality right here let's now Dive Right into and create a scenario so I will start from scratch again here so the first scenario that we are going to create is going to be the very basic one where we have a form inside webflow and we are going to send that submission to air table there we go I have created a base called make demo there you go let's rename this table form submissions we are going to delete all the unnecessary fields and create a new skill let's call it email and one for the message so text let's create an long text field there we go massage create field so now we have the three fields that is in the form I have just cloned a simple template here nothing uh you know crazy going on so let's publish this thing just in case [Music] this so let's create our first scenario so simply I will click on create a new scenario and by the way all the connections that you will that we are going to make are going to appearing appear here so web books connections connections is by the way applications you can see the a table and webflow account and stripe account all the things are connected right here so yeah that is that so let's go to scenario and from here I'm going to create a new scenario just like this let's name it form submission there we go and I will click on Plus in the first module from here I can select webflow I am going to use webflow's web hook right now to create this automation let's click on watch events we are going to watch events for the form submission and all and I will click on create a web hook once I do that I can see I have connected my webflow account you can click on ADD and basically authorize your webflow account itself and I can select the site itself and then I can also select the trigger type so you can see that I get I get a lot of trigger types here I think it's more than what we get in jpr by default so we are going to go with spawn submission and let's call it contact form submission by the way we should always always name webhook to very specific what we are using that web for so this is for contact form submission there you go and I will save it there we go the Bible is created here what you can do you can simply click right right click on it and you will see some bunch of options which is for troubleshooting and basically testing your scenario so here I can what I can do is I can click on run this module only which will run this particular module not the one after it's and before it and I can also click run once which will run the whole scenario once so right now you can see that it's uh sorry it's loading which means that it is watching for events it is waiting for the webflow forms to be submitted so I can go to the live website and let's open that contact page there we go so I will simply type here oh test at the relationship.com then test message there you go Summit webbook not found okay I think I have made a small mistake here I think I have this method so let's remove this and make this by default you know how default webflow form looks like so by default we don't have any action URL and the method is set to get so this will send the form submissions to workflow server now it is published let's see again now I will try to make the submission now there we go straight to retriguity.com test submit this thing it is submitted form is submitted and here you can see it is arrived it has arrived so you can see that this name which means the form name itself you can see the site ID is also here and then here we have the data itself I also think this usual representation is much better than CPR sorry I I like I just love make a lot so yeah so here you can see the form name and the data itself and now I can use the data and transfer it to somewhere else let's go to a table and let's add Airtel in there is off now here I can select a create a record just like this then same goes here as well I need to connect my a table account which I have already connected to save some time then I can select the base which is make demo and then I can select the table which is form submission here I can basically map the fields right away so here you can see the data is coming uh in this small dialog box and I can see the data name is here so I simply have to click on name that's it then I will click on email select email click on message and select message you can see that it is saying field so this might be happening because we have not named our message field so let's go back to webflow and see see you can see that the name of the matches field is called field so let's just simply rename it and now this issue will be fixed now in order to have this thing refreshed here I need to test it test the run again because right now you know it's the make is not updated with the latest field name so let's simply go back and publish the website research the website and we will make a test submission again so in order to do that again I will simply click on run this module only again it's getting for the event so let's just submit anything for now here there we go test and submit there you go it was arrived and now let's go to airtegral and I need to refresh it let's see let's see the data that we have okay there we go now you can see that message is here so now it should work fine if it don't work we can simply okay it should work fine let's see select the base select the table and name email message as simple as that and then I will click on OK to save it there we go so now the automation is created and in order to test it again I can simply click on first I need to save it if you want to save it otherwise you just want to test what you have just built don't save it just click on run once okay so save progresses you have to click on this save icon right here so run once and now let's reset the page and see how it arrives test sum up so here is our automation so simply we can just go to our a table and you can see that our submission has arrived now let's let's go further and do new things here so this is all good and I can simply now save the progress and I can also turn on the automation turn on the scenario so now every time I make a submission it will work fine so let's just try again now I am not doing any test runs here I'm just simply going to submit it so let's do that that's it test at the rate headseed.com foreign has been made nice let's go to a table and you can see the submission has arrived uh yeah so that was the basic setup we have we are going to make a few more automations so yeah let's let's dive right into it so so the next automation that we have is going to be using API uh and endpoint URL we are going to use action URL here uh in the form itself instead of using the flow form submissions So currently what we were doing is we are using webflow form submissions so there is a limit to the webflow form submissions right I think you get around to 2500 or uh yeah 2500 or maybe 10 000 limits I'm not sure about the latest limit but there is a limit to webflow form submissions so what you can do is you can use you can either use the attributes form submit which we discussed in the last session with me you can use that or we can uh make fetch a fetch API calls if you want something in in response you know if you want to go super Advanced you can also go make like custom JavaScript fetch API request or you can use Ajax method uh for jQuery adjust method for form submissions or you can simply use form submit by from attribute Solutions yeah so in this video uh we are going to use the Ajax method there is a reason for that because we also want to listen for responses it attributes from submit you are also making a one-way submissions but in this video I want to show a really nice use case of using make that's why we are going to use ajax form submissions so here I have a very basic code which I generated using chat GPT this is submitting making submissions using Ajax method it's a jQuery form submission method so the basic setup is basically I am basically defining this is my form if you see the code I am defining this using attributes so I will simply copy this attribute and add it to my form let's add it to the form this is the form element itself so I just need to add the attribute I'm not adding any value in here this is just for the selector and then let's see rest of the code I am also defining uh the the submit button like this is my submit button I'm also designing the uh defining action URL I am taking this from right here so we don't have to Define anything in the code to make it easy we are just going to use webflow itself then I'm also having method here I also defined the success uh button a success wrapper itself so the success element so once the form is submitted it will show the webflow's native success message and then we also have the error that's it and then we are formatting some of the data to make it compatible and then here we have the submission itself you don't have to understand all the code now but it's super simple we are basically hiding and showing elements once the form is submitted we are also listening for responses which we are going to come to in make now okay so one of the powers of make that I really like is so now because we are uh I'm going to come to that so now we are going to shift from webflow form submissions to custom form submissions custom you know HTML form submissions for that we will delete the first module and we are going to use webhooks now so there is a module in uh make which is called webbooks and this is their native uh module okay just like in zapier we have WebEx here it's I think it's much better webwork is much better so you get option for custom mail hook uh web hook and then web hook response this is something we are going to use and I love using it so I will click on custom web hook here and I'm going to click on create a new webhook once I create a new web hook I am going to name it contact form submission so this method will also allow us to skip all the webflow form limits and basically we are going to directly submit our forms to a table the flow form submit or maybe submission yeah this is much better and then I will simply click on Save once I do that it will generate a endpoint URL for me or the web URI for me I can simply copy this URL and add it to the action URL of my page let's close this thing for now and I will simply add this right here there we go in action I will set the method to post once I do that I can click on publish the website let's see it is published and so we are going to again run this module only because we don't want to send the data to a table yet we have to configure the data right and if I click on it now you can see that the fields have been blacked out because the field doesn't exist anymore so let's simply remove these things and click on OK now I will simply click on run this module only okay there is some error let's see oh I have not selected anywhere book now it should be fine there we go okay now it is listening for the data let's go to the website fresh it just to make sure now I'm going to make a submission once I submit this you can see that it looks like the flow has submitted the data but no we are using a custom web hook here so here we go we have the data arrived and you can see it it has come in a bundle so we have the name email because I left see I left it so it's empty and then we have message so same goes here as well now we need to Simply link it so I will open the a table module and I will link all the seals there you go there you go message message message message hit okay and click save now uh because I have saved the automation it is already on it should be working right away I'm using your name on query submit and the data should come here there we go it's working perfectly nice or perfectly fine now let's go a step ahead and use something that is also a power of make here which is using Web book responses so what we can do with the make is we can also send back responses to the website when once we make the call we can send a response back and display the data on our live website based on the response so I will again click on webbook uh module and I will click on web response so what this will allow us to do is this will allow us to send something back to the website and then we can use that back in the live website for the custom for the user for example their name their ID or something right so I am going to make a custom message here uh let's let's create one message thank you thank you and the name so it will say thank you and then a comma let's say your ID is your ID is enabled to forward their uh a table ID so for example this is not this might not be the exact use case but you can consider this thing for an example so you can see you can see that I am sending a web web response the status is 200 there are multiple values for the status for different type of uh you know status like error for error there is a different number uh and there is a list which which I will also attach uh you know in the notion document you will share or in the recorded session you can find definite quotes I will make sure to attach it so here is the body itself and I will simply click on OK your ID is there we go and in the code I am going to Simply unblock a line which I have commented right here so there we go so what this particular line does it it sets the text of the success message to the response message that we get from make okay I will simply say for Save and I will go and copy the website as simple as that let's also save this scenario just in case it is already in fine now let's refresh the page now let's make a submission so Gloria Moon best message here you go submitted so there we go you can see that it says thank you Victoria your ID is this number there you go and if I go here uh you can see that it's not appearing right here because the scenario is live let's save the changes and go back and we can go to history to see all the runs and we can even see it visually that that is part is I mean also amazing so here on the right side you can see history or you can simply click on history that is also fine you can see that duration is less than a second so it was super quick and uh I can click on details right here and now I can visually see it what really happened if there was an error it will also show me visually so you can really you know find where error happened and it will also describe the error if there is any error but this works all fine everything is in green so everything is good and here you can see that the body was thank you Victoria your ID is this number so yeah this is what Web book response is used for you can use it for a lot of things for example you have different routers so you can have one response in one router a second response a second router uh yeah multiple possibilities again so that was the first automation you can add error Handler that would send the error message as a webbook response as well for example let's let's see let's why not let's see example here so I will simply go to the diagram again I will click on diagram and there we go let's add a docker okay there you go I think I can connect it I messed it up you can click on this Auto align button so you can basically see it how things are uh so one router is like this and let's add another router for another response by the way you when you mess things up simply click on this Auto align button it's a magic button simply click on it and things will be aligned for you I am going to add two routers here one will be the basic response let's check if the email field is submitted or not so another response right here success aims you okay name email she has this missing just a random response here now let's see we are going to use filters for this so in response I am going to check set up a filter I will call if email is present there we go let's add a condition so this email is exist if email exists then it will go to this route there we go let's add another filter email is absent condition if email is not present does not exist and uh you have a lot of conditions to use yeah it's awful okay hit okay a status is 200 which means success and in the code we have we are also checking uh the 200 status here so yeah 200 I think it's for okay not success yeah there is a list of the codes nice so we have two responses the status is 200 and then body is thank you email list field is missing now now let's save it and this time what we will do we will not fill the email field and then we will see the response test against look we are going to not put your email okay there we go thank you test inventory is missing so it worked perfectly fine now let's save the changes and see the history again just to make sure everything is good and there we go so it goes to this path and you can see here it says one which means it was able to fulfill the condition and here it sent this response so yeah this is the use case for I think uh the filters and also sending different types of response based on what is selected on the website okay guys let's move to the another automation so I was thinking to show automation of using stripe and it's again a very nice platform yeah so the idea was that I we recently did this automation for one of our client so they had a product inside a stripe so this is the product I have just created it I have created a CMS basically there I have added digital product and I called it virtual pro and what they wanted their requirement was that they want to show a live counter like you are the 100th person in the queue purchasing this product or you are the 50th person you know they wanted a live counter in there so make supports a feature that will allow us to do this so you can see that I have basically a embed inside which I have added a text block of incentive block I simply created it in the flow and then copied the HTML from it and I have connected this field to the live counterfeit of CMS then uh uh yeah this is how it looks the main setup and then we have the this is by the way collection list so you can see the structure here collection list inside this web collection item inside that we have all the things that we need uh because it was only one product I have not really linked all the things to the CMS right now it's all static I only I'm only using webflow CMS because of the reason I can access the flow CMS API using make and update values there so that is the only reason why I'm using CMS here uh I could have also used some JavaScript to fetch maybe some metadata from stripe and do it but I think for webflow developers this would be a more I think slightly that's why I'm using airflow CMS right here yeah so this is the button itself so let's let's simply go here and go to products by the way this is right now I am in test mode instead this is the product that I have created and I'm going to create a payment link so if you are not familiar with this type payment link they are super powerful you can create products and then payment links out of it which is a single link you can use it share it with everyone you know basically like Shopify buy buttons they are simply buy buttons of your product so this is the product itself uh we are not going to add anything let's keep it plain and click on create link so that link should be created there we go I can copy the link and now I will simply go to my website and I will add this link to the pre-order button itself there we go I can select open in new tab it doesn't matter yeah let's do that let's publish it to the live website there you go and open it connect click on three order it should take me to the stripe checkout page there we go as simple as that this is what strike payment links does so as soon as we open the strike payment link a checkout session is created in the you know background so what we can do we are going to use a stripe WebEx to detect events so once a checkout is computed we are going to detect uh the checkout computed using devoc and then we are going to increase the number by one inside webflow CMS that is what we are going to do here uh yeah so let's simply we will keep it at it as it is for now let's go to uh our make account right here I will simply save it and go back by the way one more thing I just forgot to mention it I'm going to mention it right now you might be thinking that so in this method you can see that I have added this URL to one form only but when using webflow webflow's native form submission web form submissions you can there is you know no way directly to select the form where the submission is coming from so what you can basically do is add a filter where you can set up a filter where you can set up you know if the form name is let's say contact then go ahead and process the automation so that would be the way to kind of differentiate between different form submissions and their automations yeah just a small pointer here so let's continue again I will simply click save changes and create a new one create a new scenario let's call it strike checkout counter and then I am going to again use the web hook methods let me tell you the reason I'm not going to uh you know I can actually use watch events directly from a stripe there we go but uh I'm I'm not going to connect my stripe account right now here instead what I'm going to do is I'm going to click on developers and I am going to go Web Box this option for webworks yeah and strike so we can use that and I will click on ADD and end quite so simply let's select again webwork options you can web use webworks or all different platforms custom webbook and then create a new web let's call this stripe checkout completely completed yeah then save it and then I will simply copy the address copy the web URL link let's go to stripe at the endpoint URL and then I can select the events which I want you know in order to trigger this the book so I can simply select checkout check out session computed so this is the one that we want to use check out session dot computed add events and then click on ADD points nice so the endpoint is created it says waiting for events which means it is waiting for us to go ahead and make you know a checkout session so let's simply do this at the rate gmail.com and you can use this card you know it's our dummy card that strike provides us to use so let's do this there we go uh I don't know why there is accuracy yes let's see okay there you go and the test payment has been made now let's go back to dashboard in stripe and refresh the page we must be able to see our computed checkout session right here in the developers dashboard okay there we go yeah so we can see uh event right here which is checkout.session dot completed exactly what we were looking for and uh if I go to make I need to click on OK and then run this module only so in order to I can so that I can catch it uh by the way because you can see that I didn't turn it on before what I can do in stripe I don't really have to make the payment again and again this type provides as a really nice option which is recent so we can simply resend the same data again and again so I will click on recent and uh here we go the data has arrived let's click on it and we can see all bunch of data so it comes with a lot of things uh yeah so that was that and now we want to have a increment function which will increase the value by one every time so let's do this we are going to use uh this tools we go to tools and we will select increment function we will link it right here and then uh there we go that is a reset value is set to never so it's never going to reset it's going to remember the value and then we can also set the value to reset after a cycle or after a whole scenario Run Okay so yeah we can do that for Cycles uh you might be wondering the definition of cycle and scenario run I think uh I will also share a documentation about this but to understand you know a scenario itself can consist of multiple Cycles in it yeah and yeah basically yeah that is the shortest way I could explain it yeah but we don't have to dive into that right now what we want is we want to save the numbers so every time there is a automation made here you want to save the number and increment it so that you know in webflow it shows the live digit itself let's set it to never and I will check again and I will click on the flow because now we want to update the live item inside as well let's go here and click on update an item okay you might be wondering where is the live option so you will get we'll get to that there is option inside it and my webflow is connected right here I can simply select my site by the way you also get the option for map so you can have the you can map the site ID itself if you don't want to use the names and all and make make it make make it easy for you you can select the name such a weird name and I can simply here root not found let's refresh there we go selection connection is digital products this is my collection and then I also want to make this item live so I will simply select live item itself is I can also map the item but in this case let's simply select one because we don't really want to we don't really have multiple items in there live counter this is the fun interesting part so we are going to use this number right here so by using this number this will this is going to increment it right and every time there is automation you might be thinking if I want to start the number from maybe 100 101 or 102 right so in that case what you can do you can add a math function here so here in make you get options for math functions so I hope let's say it works let's say a 100 I have 100 here then I will click on plus which is addition and then I can select here this thing uh the result which is coming from the increment function let's see if it works and then the name we are not going to change the name so let's keep it Pro it is by the way mandatory to have a name which I I don't like a lot you know it is also mandatory in JK not something you would make so yeah just put them in we don't we're not going to uh change the slug and all archived is set to note after set to no and then click on OK by the way I can simply click on run this module only and now you can see that I can do a test run very easy I can simply uh type a number here I don't really have to run the whole scenario again and again so simply let's type a number called one here and wait for the data and you can see that it was ran successfully and the live counter output is set to 1 0 1 which is what we wanted exactly so let's refresh our page okay there we go it's one zero one nice let's go to the live website again update item so save it this is all good and then turn on the scenario I will run I don't have to clear control once and I can simply go the refresh the page and make a test transaction again the order let's go here we go yes you have to read com add my millionaire card there you go now okay I did not do anything you can see it running live uh when you are you know basically watching the diagram there we go test payment has been made Let's refresh it get it off voila okay so that is it for this video guys I hope you enjoyed the video and you found it useful I personally love make I hope I was able to also convince you to start living make you should definitely start using it if you have not tried it yet you are definitely going to enjoy it and maybe make a switch from zapier no it was appeared but I just love make we are going to drop a link in the description you can find the link in the description and drop any suggestions for the videos and also any suggestions for the automations so till then harshita are signing off bye [Music] oh

Channel: Finsweet

Views: 7,887

Keywords: make, automation, webautomation, airtable, nocode

Id: tZK_7OTU1k8

Length: 42min 29sec (2549 seconds)

Published: Fri Jun 16 2023