Creating an Airtable & Slack support app with Autocode cofounder Jacob Lee | AATT #24

[Music] what [Music] [Applause] [Music] probably because of me there we go hey can you hear me now yes all right welcome to automate all the things you sound great uh we should we've got paul we've got colleen in the chat welcome uh jacob you are the first guest to automate all the things this is the first time i'm doing it with someone else so i am as stressed as you are uh we've got penny in the chat welcome penny uh so so yeah i'm excited this is this is this is new to me this is new to you as well this is new to everyone so i i will i will let you introduce yourself and then we're going to have a quick chat and i'll introduce kind of today's uh today's topic so jacob tell tell the folks who you are in and a little bit about auto code absolutely um yeah thanks so much for having me on automate all the things aaron really really excited to be here um so i'm jacob i'm the co-founder of auto code uh we're an api development platform with a built-in online code editor and built-in api autocomplete and we're great for integrating third-party ecosystems as you'll see on the screen and we'll be walking through an example with airtable slack and autocode of course awesome so i kind of think of autocode as airtable scripting you know kind of editor but for every application out there so i've been having a lot of fun you know kind of writing code in airtable scripting and what's great about it is i don't have to like worry about data i don't have to worry about authentication i just write the code that like does the thing that's important to me and then i don't kind of worry exactly about the rest is is that like a good example like autocode is that bought for slack airtable and stripe is is that a good way to to think of auto code yeah that's definitely one when you think about it um and i think one thing that makes this unique is the fact that you do have all the kind of infinite possibility and infinite control over what your integration is doing um because you have this code in front of you and you can modify it um we support things like npm packages uh we actually started as a a very very developer focused uh company so we built kind of the developer platform and that layer of things and kind of moved towards you know making it simpler for the builders and makers out there um so yeah i think uh that's definitely fair assessment aaron yeah awesome so i know that a lot of the folks tuning in are not developers i am not a developer i i mainly kind of guess my way through this um so do you i'm curious like when you think about this who is this tool for right is it for folks kind of you know using other noco tools and thinking of okay i want more power you know how do you think about the or is it developers trying to also not do all that parts around authentication so how do you think about who autocode is for yeah absolutely i think the developer side is definitely a key part of it um so people who you know aren't afraid of jumping into code and like building really complex applications uh we do also with our ap auto complete though um get this like really good sweet spot of uh people who are on like between developer and maker i would say maybe they aren't afraid to like jump in and write maybe an if statement um or you know write a for loop and they understand what that concept is um and we also for you know that kind of cohort have a this concept of apps which are ready-made solutions that you can just plug in a airtable base or your slack workspace get started absolutely work it uh working right away um that you can then go and make uh maybe small modifications to later uh so for the makers out there you know that's a really powerful tool as well yeah so for focus joining yeah sweet spot for us is uh maybe like a more technical maker but yes all right well let me know in the chat how technical so paul definitely not technical i imagine we were talking about developers at that point uh um you know i consider myself like 10 percent technical and that i can read the api documentation i can kind of understand it but i think auto code you know having played around with it before is just that little bit later on plus so what i can do is kind of read the documentation not necessarily understand everything about it but at least those core parts and a list at least build you know part of an application and just for folks joining we're actually going to be rebuilding something that jacob has already built so if you type in you know uh exclamation point base there's a link to both the base that we're building and uh to um you know everything that we're gonna do today so this is actually gonna be kind of behind the scenes but uh um you can go ahead and just take that and build it as an application and then build on top of it and there's a bunch of other examples so what i thought would be really interesting is see we know what the end point is and we'll start there on the stream we'll rebuild it from scratch just to give you an idea of what we can do uh and then i'll let everyone kind of go wild and build things and then come back and tell us you know and show off what they've built um so yeah i'm really excited yeah jacob i definitely like to stress again that the autocomplete really um uh one of our uh the person who introduced us actually uh he got him named noko jack um his name is actually just jack but on twitter he's no code jack so shout outs to him but uh just about being you know our favorite no coder he's been able to jump in and um start building with it just based on the autocomplete and um yeah you know been kind of a cool experience watching him go through so definitely don't be intimidated by the fact that you have this code uh the autocomplete's your friend and um yeah it gives you that kind of flexibility there yeah first name no code last name jack you know who knew his parents knew from day one yeah sounds like that he was gonna be uh i was a sounds like a dragon or something um all right okay cool um so yeah so let's jump in so i think paul there's a question around you know what can autocode be used for and i think as we go along you'll kind of get an idea so my understanding of auto code just right off the bat is that there are some like deep integrations with popular applications like slack airtable stripe but nothing stops you from just using api period and having fun with it and we'll kind of talk about that throughout uh so with that let me jump into so i'm gonna share my screen so you can see things one second here nope i do not yep we you should see my screen there you go now folks should be able to see you i really gotta get better at this streaming thing so i can set this up without this little transition sketchy part there we go all right all right so i want to start with just talking about what the use case is today so we're gonna put ourselves in the shoes of a support team that manages tickets um you know out of air table and so these tickets come to us in slack uh someone hey victoria good to see you uh sorry victoria came in victoria gets a shout out everyone gets old yeah victoria's actually a huge fan of yours she had used standard library a couple years back so she probably has very specific questions excited to hear them awesome awesome yeah well welcome back victoria um i think uh i think we may have met in the channel maybe um uh well i saw i was actually on your stream last week and i um yeah i saw you guys go through kind of a uh rather complex um [Music] uh what was it it was um you were shifting like you know weekly to monthly to yearly yeah compliance um record just something like that i got quite quite in depth that's cool oh oh yeah we got we sometimes code jack love it we i think autocad code changed his name yeah he went from no code to sometimes code which is awesome all right that's amazing yeah um jack we actually just uh we were just talking about you a minute ago about uh the one who kind of put this all together so thank you for that yeah yeah welcome to stream um so if if we can't answer questions jack's gonna be able to do it so jax just just just bug jack for any questions all right so this use case we've got tickets it's gonna be very simple so you know whenever someone comes into our our slack channel and says like hi i need help what the team does today is like we we you know copy paste this and put it into our queue and we're kind of like okay this comes from aaron he says he needs help it's currently unresolved and then we kind of migrate through here and then handle tickets one by one so the origination point the starting point for all of our tickets is always slack it's a specific slack channel right and what we'd like is just a way to just automate that first step so whenever someone sends a message in slack we create a ticket in air table and then as a bonus whenever we change the status of a ticket right to say that we're working on it we're going to go back to that slack and update in the thread to say like hey like your ticket is now in progress or resolved and i think it's like the starting point for folks who are wondering like what would i use this for it's really just a starting point for whenever you want to kind of play around with slack right so maybe you want to create something more complex and uh you know managing tickets managing inventory managing whatever within slack but more broadly what we want to show off is auto code and its flexibility um does that make sense jacob anything you want to add to the kind of workflow that we're building before we jump into auto code i think that was a great start yeah cool okay so airtable like should be prelatively step forward for folks who have joined the stream before um let's go into auto code so i'm here uh jacob in my what feels like like my my home screen where do we stay yeah this is your uh main management dashboard for sure um so yeah the flow here would be you uh log in and then hit new app project in the top right corner there and that'll open a uh kind of wizard where you can name your project um so yeah whatever you'd like to name it uh i don't have uh hyphens on my keyboard i still haven't fixed that so it's just gonna be att slack butt there we go yeah i saw you showed off last you want to show it off now the kind of air table version of no people have seen my keyboard cube i've seen my keyboard let's go into okay so save and continue sure so anyway we've got this uh wizard yep save continue just like that and uh that'll say it with a new autocode project and uh it'll give you kind of like a selection of events that you know maybe might be a good starting point but because we're going to be um for the first part of the app building something that responds to a slack message channels event um in other words when a message uh from a specific slack channel comes in we're gonna hit something else down there choosing another event after starting wonderful okay so there we go cool what do i look at what it what so the first thing we're going to want to do is yes this is the uh kind of main autocode editor this is where all the uh all the good things happen um in the left part of the screen you have a kind of overview of what your project's uh files look like so um a few things just like kind of meta fields uh like information about um like to us what your package is um and then you have your code editor in the middle which is going to be basically where the code goes uh but if you look up top right above the code editor um editor excuse me you'll see a click to select event um that'll trigger this end point so click that and we actually have a uh you know selection of triggers here uh including slack so um you can look through the list uh you can also start typing slick just black or yeah yeah just going to click on it and you're going to go to uh message.channels okay so you can also just start typing message and you'll see it so i see here so i just want to maybe so essentially you know when i when i think of writing code in the past there was no concept of like a piece of code that gets run based on something happening elsewhere that you manage for me right so essentially what we're kind of doing here is essentially saying okay what is going to trigger this piece of code and can we package it in a way that i don't need to worry about it so right now our first step is to say when a message enters our support channel we want to do something so this end point this trigger is just saying that is what we want to happen and for folks who are like oh intimidated by the code um is that right now we're just autocode is going to write all that code for us so when i write channels it says like okay well here's everything that you need to do right kind of run code when a new message enters is that kind of right am i saying that right jacob yes exactly yep um and autocode actually handles all the uh validation events as well so you know that um your endpoint can only be triggered from slack and only by the specific event from slack so we handle all the you know kind of things you need set up there as well so um and yeah as i mentioned we auto generate good so i'm just wondering before we continue any other kind of popular slack triggers who for folks who maybe aren't as familiar with the slack api that you would recommend except channels yeah for sure the big one um that i probably use most often is command um so if you ever use slack you might be familiar with the cons with slash command and that can be used to um yeah trigger like a workflow when um for example someone types like slash uh so for the uh phrases i'll get it to a bit later uh you have to type cmd and then some command name and that'll trigger like some uh an endpoint much like this whatever you write and um yeah it's really nice for um uh like administration tasks and uh stripe for example or um you can do things like open dialogues in slack for more um to gather more information um yeah more complex workflows as well so command's a big one and uh yeah another popular one uh member join channel uh will fire when someone joins the channel self explanatory but can be nice for like kind of welcome tasks um yeah those are probably two of the bigger ones okay okay so right now this is saying that like every all the code that i put between here is gonna run when there's a message to a channel so where do we kind of go from here what like i don't know what code what i want to do is respond to this user in thread to say like hey got your message thumbs up so how do i what like yeah absolutely how do i go do that sure um so don't be uh the the stuff in the gray is actually just pre-generated uh we call them enrichments and what those do um actually one thing yeah let's uh let's start with the payload so hit the edit test event payload in the top uh of your editor there uh edit testament yep to the right so this payload is what actually what slack will actually send to you and you might notice that it's a bunch of um kind of like like you know intimidating looking strings you have like c000 it's just um internal slack ids which aren't terribly useful for maybe crafting messages in response to an event so if you exit now um by the way you can modify this if you want to test with specific values but um that's a little bit more advanced um this enrichments uh this results a slightly channel await the conversation's info uh is just retrieving some additional information that we'll use uh in just a moment about the incoming message and the channel that the message came in yeah does that make sense yeah cool um so anyway the first thing oh good no yeah i'm just curious like what is so how do i actually like write the code that i need to um yeah for sure respond to the uh respond to the message that uh someone posted so uh what you're gonna do is just start typing a weight and 108 means yeah await lib dot and you'll see our autocomplete popup and this autocomplete has apis from a number of different sources um and we're interested in slack because we're going to want to uh respond to the slack message with another uh slack reply so you can get slack and uh we're going to uh send a message so you can just type uh send or i think yeah or just go through the list but if you type message or yeah send i think it should uh yep it'll pop up there send a message for me brought to a channel uh and if you click that or press the enter key you'll see a a little form popup and this is uh maybe kind of what you've seen in some other uh context but um it contains basically the api documentation um put right in front of you so it's perfectly accessible you can see exactly what parameters the api takes and um yeah like what uh whether it's a string or like an array and we can do all the configuration from this uh editor here cool um that's kind of the magic of uh yeah the autocomplete and um how you know you can uh how do you make generating code and um how valuable that can be so so if i'm understanding this right i'm gonna start writing things here and then it's gonna like actually create the call that i would have to hack together and it's gonna like display it here so if i start writing exactly channel which is support right like this right that's always going to be the channel so support body of the message sure uh we're on it and this is gonna be the message that you send yep exactly yep exactly and um one additional thing uh because we're making this message in reply to the original message we're going to um this gets a little bit specific into slack but we're going to specify the thread timestamp and that's thread ts right below blocks there um autocode has yep if you type a dollar sign and a curly brace um it's a little bit javascripty but um that opens up the uh variable insert here uh so you can actually just type ts there and it'll kind of go through that yep search the dropdown and we want the message timestamp so yep that first one and um yeah that's actually it for okay so i just want to reiterate this so there's actually an explanation underneath that says you know provide them the timestamp of the message so we can find which message we need to reply in thread to so i think this is actually one of the points of auto code that like this is something that me personally reading the documentation i would probably glaze over or miss and not truly understand and so what i did there is you know hashtag curly brackets is just a way of saying put the value from this other variable into this kind of variable right here so it's going to go ahead and take the timestamp from the message and input it and i think that's actually one of the things that makes auto code really cool is that it manages that for you however you need you need to know at least that part so these are one of the stumbling blocks uh so you know we've solved for that if we didn't have this it would just respond in the channel so here it's actually going to go find the right message yep and um i'll show you what that looks like without the timestamp for testing um because uh so autocode has this uh has a front-end kind of testing loop um that's pretty useful as well um we uh you may have noticed in the uh test event payload that we opened earlier there are a lot of things like c000 and those are internal slack ids but they're not really they're just uh essentially like mocked out data or test data that you can kind of test your application logic with before you deploy and that really speeds up the iteration process um and show you what that looks like let's close this and yeah you can save and um we're going to comment out that uh just put two uh yeah like a like slash slash in front of thread ts um the reason i'm commenting out is because um we're using test data but you know there's no like we're replying to a message so there's no message to reply to um in the test data so uh we can try hitting run and just see what happens and this will kind of like simulate a run from actual like the actual slack workspace for installing the app into and we're going to run into a quick problem pretty quickly because we haven't linked our slack workspace yet so you'll yeah if uh if you're a sharp-eyed person you may have noticed the bouncing red yep red button and we'll click that and uh autocode has a uh like linking and um identity management wizard as well and that's part of the nice um developer experience builder experience that we provide here um and it'll say you need the slack account please link your resource and in this case resource is going to be um aaron's automatic slack um you can choose that he's already linked it hit link new it'll go through an off flow with your current slack workspace and uh or like you can select slack workspace and like that and install the autocode app there um so but aaron's already done that uh we had a yeah so i'm gonna avoid i've hit run again i've shown my api key a little too often on the stream so i try now to avoid that at all costs so let's run that test again cool and uh you'll notice the console.log statements are appearing in the um in the result window there as well so there we go um that's kind of uh yeah boom nice little piece for debugging as well oh you can't see the bottom of the um so let me know folks if you can see the bottom now i just moved i changed my stream a little bit we're doing things live there we go you should be able to see it now let me know if that's the case thanks keith thanks for letting me know um so as you can see yeah whoops thank you keith uh all right let me make that just a tiny bit so you can see that um oh sorry there we go okay so we should be good now let me know keith if that looks good okay i appreciate it okay cool um yeah so it worked we actually saw the message i mean that's awesome just that i think we could end the stream here and i'd be already very excited so anything we go from here is like a win um so where do we go from here wonderful so what happened here was um we actually made an api call uh actually all three of those api calls to slacks api um and uh used like essentially test data and um made a real api call to this hashtag to send a message to the hashtag support channel um right we want to send the message to reply though so we're going to uncomment the thread ts that i uh that we previously commented so just removing the two slashes there um we'll do that and yes next um yeah why don't we uh let's let's try saving this using the save endpoint button and that'll uh yeah save uh save our code and we'll deploy it and we can try sending actually writing a message in our slack channel and seeing the result there so you give a few seconds go through a little so i know that uh just for a moment here was i know uh jacob's video is lagging can you guys hear him okay i want to make sure that the audio is good so let me know in the chat if you can hear it but video is fine don't worry about it i don't mind the video as much as i would worry uh folks can hear you so don't worry about it okay cool good good good good good okay wonderful so um yeah let's let's go back to our slack workspace and actually see philosophy in action uh if i'm as it were so you can type anything there um hi i need help yep i have a problem perfect and uh yep we should see and whoa when you hear a little reply pop up automatically yep and it'll say we're on it and now your customers have you can boast a um five second response time first response time and your customers will be happy and uh yeah well yeah yeah this is uh um i i think you know i don't know i get really excited because the idea of like everything that this opens up right so you know you could imagine like tagging someone or just doing a lot of like cool things from just this part right just working within slack and actually i think you know threading is something that i've never seen available without writing code right so i've never seen uh you know these kind of low code applications allow you to thread specific conversations um i imagine in part because it's reliant on that like um you know a specific time stamp which they can't necessarily manage so for me this is really exciting um so i'm i'm like really excited to kind of build on top and build a workflow on top of it with starting from um slack so i think the next step is okay well we actually need to send this message to our our airtable base to say that like okay we we've had this new message and i imagine that's like right kind of here right so like we just continue it's sequential is that right um you could do it that way i think um the better way to be actually to send the message to airtable first or sorry send the uh support tick the air table first um then confirm afterwards that the uh you know um uh the issue was tracked uh because then you know for some reason some api call failed um you know you wouldn't say we're on it when really it's not being tracked um so i would actually do right above that um wait a bit okay that makes sense so yeah exactly exactly so we've gone through um kind of what air slack called look like and air table is actually very similar um so you start typing air table you can hit enter or hit or click it either one will work and we're going to insert a record into the base so you can just start typing insert or yeah just go through the list either way um so it just it just went to it so um these are things i understand so i think yeah jacob i'd love to give it a try i'd love to like give it a try and you can tell me what i'm doing wrong would that make sense because i'm like i feel like absolutely yes okay okay so base id i already have a linked air table i think i do boom okay and then so let's link this one that's good finish linking table id i want oh so this is at the the base level right so i need i actually need that is not the same basically sorry yeah that's fine that's fine we're learning now we have to oh yeah we can actually yeah i think you can um you don't have to show your yeah it won't show your key that's right yeah i was afraid you'd have to show your um your table uh your table lap key yeah oh i think you might want to um i'm not sure that's the right base aaron oh i said okay i picked the wrong base whoops okay let's do it one more time so you'll want a new resource yeah there you go yes and so this is okay this is my personal account a level account level so this is the one i want yeah right yep that's right so i i think you put your api k uh key in earlier and we just reused that link to cool to your account to like pick you can pick the base here um i'm not sure what you've named it but uh it looks like live stream live stream 25 i'm looking at your top bar there we go cool yep that's that should be the one um all right we're picking this one let's try that table conversations that's the one we have right here boom okay and so then the key okay so let's kind of look at this so i want let me go to all tickets these are things i understand all right so username that's a single singles yeah single line text username and the value is gonna come from step one right so to do that i do it's kind of like similar to what we do in you know zapier or whatever but we're just kind of doing uh dollar sign open squiggly bracket result dot slack and i want the user is it name there's name here remember no it's user yeah that's right um user dot name okay boom that'll do it boom okay what's next can't stop me now the text okay so we want text and then squiggly bracket slack dot message i guess no oh you know actually one thing that's really nice is you can just start typing um uh text instead of slack dot um there and uh it should actually yeah with the curly bracket yep yeah and it'll uh we do some kind of intelligent um auto completion there boom okay next status that one's gonna be always unresolved yep is that i'm just gonna make sure i'm running that right this is the only part of the stream where i can i can do something it's back to you okay that seems right oh no you're doing it you're doing great any we did want to so i know i'm hiding some fields and this is like metadata so user id channel channel id slack message do we want to go ahead and add those as well just because i know that they're going to be useful in the future yes that's right um we're going to need to uh add two more fields here i think um one of them is going to be again because we are replying to these uh messages with a thread we need to actually store the initial messages um time stamp so that's going to be called uh um yeah i think you've got it there as slack message yeah slack message yes which is short for timestamp and then i want boom boom ts ts or mts perfect boom um just yes for that that's within the message itself um and then yeah i think you've uh uh you may need to capitalize the t and um oh you're good formatted over there yeah good catch boom next uh do we need all three of these um so i think we'll be okay um actually with just uh you know these are in um the complete app we have we saw all this information because we do some nice formatting of uh the reply messages and things like that but i think for just to streamline this along we only need really one more thing for the next part of the demo um and that's going to be the uh bot replied at field um so to give you zoom out to 10 000 feet for a moment um the next part of the uh app after we've done the um uh this initial setup with the uh replying to a message with like an immediate um message um we're going to be like basically checking for uh status changes with an error table so if someone goes in to that kanban view and uh takes it from resolved uh sorry unresolved to in progress um our bot is actually going to send an update to the thread and um basically hey someone's like shifted your issue to in progress instead of just um you know unresolved so to do that we do some things with and uh yeah we do things with uh kind of airtables formula features and computer computed fields um but the basic idea here is we're going to just put in um do the uh some um like a date here that's a little bit in the future and um it might be a little bit mysterious as to why but um for now but we'll i promise you'll make sense in a moment um so we'll put the dollar sign curly bracket okay and uh so we've used this historically to um you know do kind of variable interpretation but you can actually put direct uh directly put javascript in here as well um so we're gonna put new date create new date and as an argument we're gonna do something a little bit interesting and do um parentheses um within the parenthesis we're going to create a new date from another new date yeah oh new date again new data my god yeah and with that second new day we're going to do get time uh sorry dot get time yup just like that and that's a function so um parenthesis there and we're going to add uh 10 000 to that for 10 seconds and you can see on the right hand of erin's screen the javascript that's getting generated cool so another parenthesis on top of that close the first one off and then yeah the uh ending um curly brace there cool so what we're gonna store here is essentially um like a time 10 seconds in the future and that's going to help our air table computed field logic in just a moment so yeah and that's actually those are the five fields we need and if we hit finish configuring um we'll be able to uh try it out so i just wanna i just wanna call out this is why uh uh this is like the scary part of writing code right because like i don't under like i do understand it now that you've explained it to me before the stream uh but terrifying for new developers so victoria gets this uh uh because she's you know she's great so i know that it's okay i think this is what i just want to kind of say this is what's great about like folks building applications where as a proper developer this is something that may feel obvious to folks for us less and that's why kind of referring to an existing app is uh uh uh um like you know there's there's much less surface area for me to make errors in and i'm okay with figuring this out versus figuring out everything about authentication uh and things like that so but you know for still if you're not a developer this feels you know maybe a little bit intimidating but again like luckily we have like built out applications we can start from for sure i kind of like to think of it like um you know there's a very you know easy you know i think you found the first uh four steps here pretty relatively straightforward so i kind of think it was like kind of a shallow end and then like uh you know that's pretty easy to get into even if you don't know how to code um but then you know it can if you want to um it can get pretty much as deep it's it's just code right so it can get pretty much as deep as you want um there are no limits on like kind of the complexity of that or like the um level of detail and uh like kind of what you can do with the uh endpoints like this um yeah so i think uh you get kind of the again creator you get the kind of easy shallow end and then like you can go as deep as you want or just stay in the shallow end and you can have all that uh flexibility uh but now we've done this yeah if you run um this shouldn't yeah jump with the gun love it oh invalid thread tx so that's okay that's just the um that's the slack call because again as i mentioned earlier um when you run a test event there's no event there's no message to respond to right if you check our airtable base we should see a record there if yep oh yeah right here live longer it got through the first couple yeah yep that's just like some sample text uh with an example user this is directly from the uh the enrichment data that we have early on oh cool so does that mean so we uh if we deploy and test this out it's going to reply in thread yep that's exactly right cool um yeah so we can try that and uh we'll also see that oh yeah you'd have to hit save first i'm sorry oh it's like it's like 1990 again yeah [Laughter] i'm messing with you there we go there we go well i think it's something yeah it's a fair point so um while this is compiling i i'd love to know like in the chat when's the last time like my like i remember my parents would still like save google docs right i haven't saved anything in forever but uh okay let's test this out yes cool okay i don't know if that's who's with an apostrophe or sc oh okay that would be we knew that word but um that's okay that's okay there we go and um yeah we've got this nice little um record here if you go to the kanban view it'll be pretty clear how how nice that can be right here that's awesome okay let's actually adjust this a little bit let's get like status created at i think that's cool okay all right so now we're doing two things uh um where a new message comes in we send it to airtable we create that i think that in and of itself is super powerful i'll be honest just because like i imagine all the flexibility and all the cool things you can do from there but then we respond in thread to say like hey we're on it and i think as a final step here uh because this is already kind of giving me and i hope folks in the chat folks joining that like it's you you want to kind of explore what's possible in this api now you want to kind of think of what are all those things we could do uh in air table slack together or whatever all the other apis that we now have access to but i think as a next step here what we want to do is like okay well let's say i want to move and say okay i need help getting zoom this is now moved to resolved we want to go back to slack find that message and say that you know hey we've updated the status of this exactly um yeah that's uh kind of the next part of the uh next part of the like the the other end of the um uh the feedback loop i guess um is like kind of giving updates when something changes um so we're actually good with this handler and we're going to create another endpoint um so what you would do is you go um yeah you can left-click or sorry right-click um in the sidebar or there's a plus button at the top as well that'll also work and you can hit new api endpoint um anywhere just functions new api endpoint yeah there we go yep okay just like that um we default to just responding to a generic like http request but we're also going to want to change this to a different event um and the way we've uh autocode actually comes built in with a scheduler um and if you're not familiar with the scheduler it's essentially a it'll it'll trigger a endpoint that responds to the event with like say every minute we've different intervals every minute every hour every um yeah once a day once a week um and once a month then they have different uh the options for that so you can do like every you know month on the on the second wednesday or something um yeah yeah we're gonna do once a minute because we want to uh we're essentially like pulling the air table base uh for changes and that's kind of where the um if you remember that like bit of date logic that i added um that we added rather um uh that yeah that's adjusted anyway yeah let me yeah let me walk through here so essentially this is the one thing i feel i feel you know uh kind of not smart enough but knowledgeable enough to talk about is that essentially what we kind of inputted is bought replied at right so this is saying you know we received this message and then we replied at this time and then we have this status changed at which is a last modified time on the status so let's say i would move this into in progress we'll see that that updates and is now greater than bot replied at so we know that you know since the last time we've replied to that user uh we now have changed the status so we know that we need to go back to the user and say that uh we want to uh um you know we we need to tell them that uh that's the case so we can even create kind of a yes no need status to change reply customize field type that says if status is greater than reply.go no um and um that way we know these are the five records we need to tell the user find the thread tell the user that you know their status has changed so all we actually need to do is find all records that have this greater than this or that this is equal to yes which is the same thing and find the thread and say hey uh this is now in progress or unresolved or whatever um so this is actually like kind of if you're used to air table scripting it's kind of like a select records async that maybe is tied to a view so we can create a kind of needs reply view and we're just filtering down to where uh status change reply you know contains yes so very similar but we're gonna do that writing within autocode was that a good explanation jacob yeah absolutely and actually um i know it's a bit off script but that view is actually a great idea you can actually pass vue ids into autocode um the query endpoints we're going to use um so maybe we can yeah maybe it's uh we can just go with the initial example but um sure that's that would be another option so if you pass in the view id it would just um it should just return everything that's specifically in that view in the order the view contains so you can do things like complex sorting or um yeah like uh restrictions like that cool so anyway yes we're going to first get a list of the airtable records that we haven't upd uh that have changed uh their status and that we haven't um notified the user about yet so that's gonna be uh yeah uh select yeah you'd go through but um so we want to find find records by formula um i think select our records by querying a base would be um the better one they have that again select uh select okay excuse me okay cool uh because we're going to select them yep and then that'll that'll have the same um i think you could use the find one but this just has like it matches the kind of formula we've been using with the other ones and we already uh it will auto populate the base id to the default one that we've linked which is kind of nice and we have the table and um yeah you're going to try the uh yeah you want to try the view or do you want to uh well it's yeah no let's try let's just do we have a record i think it's much easier to go with the record so we just need when needed change reply is equal to yes is that a caps yes yes yeah boom i can see the view there we go um wonderful so that will yeah um but that's actually that's yeah that'll return everything where uh you know the change reply is yes and um yeah we're good if uh if you hit finish configuring there yeah so i do want to address uh uh colleen mentioned in the chat why are you using time in this formula what about last modified by field um so i just want to address that really quickly so um this bot replied at is the last time in the timeline that we've let the user know of their status so what i mean by that is uh when you come in the first time you leave a message we say we're on it so imagine that's like 5 p.m right and then i go into air table at 5 10 i update the status to say in progress what that says it's going to say okay it's going to update the status change at to 510 and the bot reply that will stay at five because that's the last time we reply to them and this is gonna say okay well we haven't replied to them since we've changed the status and therefore go ahead and we should do this what we're going to go ahead and do is when we run this process we're actually going to go ahead and update this to say okay we've now replied and this will be greater than this right here so this is going to go back to no so it's just kind of like a work around to let us know which like timing understanding the timing of conversations in slack and then making sure that that is reflected in air table exactly yes cool um cool so we do need to do something with the uh results of that query so um for those of you who maybe know a little bit about code we're gonna use what's called a variable um so we can set that to the response of that api call we just made i think this is the first time we yeah i don't think we used one in any of the last ones um wait uh yeah yeah yes exactly we're gonna want to do some operations on the result of this api call cool um cool and uh um yeah the basically what we want to do next uh for every single one of those records uh where we do need to make a status change according to a computed field we're going to like send a message slack so we're going to yeah exactly for loop um and that auto completed nicely um but instead of the the 10 uh you know that's just like kind of an example we're going to oh you can just go just modify the 10 directly though no no i just want to i want to show how cool this is so i know it's a little low on your screen but every time i write four i have to like let me let me give it a new give me a new line here just to so folks see this let me move this up four so when that happens here every time i write a for loop in javascript i go to mdm and i'm like how do you write a for loop because i always forget and i always end up with the same place so here what i'm writing is four and then just writing tab auto completes the rest and then it jumps me to 10 because it know that's the part i need to change and i know that it's going to be conversations dot is it going to be no dot all right i miss wrote it oh yeah i think you misspelled conversations there yeah dot conversations dot rows there are just rows that gives me the number right uh it's not length actually oh yes um yeah say that again uh dot length not length rare okay i knew that i felt confident there but then i didn't go to it no worries um yeah maybe i'll let you uh yeah we can try and see what happens here okay um so we're we're gonna want to send a uh reply to each one of these basically yes okay so we actually need to go to slack let me kind of think of this so we need to go to slack we need to find like send the message find the timestamp and let them know that we've updated their status is that right exactly yep so here let's see what you remember slack dot is it send a message right right yep there we go okay channel is gonna be i'm actually pretty worried here but i i believe we can do this let me please in the chat let me know if i'm making mistakes okay body of the message is going to be your status is now so like that and then i could go from oh i need to put sorry before i do this i need to put the value of the record i'm currently looking at into a variable so i can pull it up here right i have an array here and if i look i'll just give an example if i console log that array console log conversations this is going to console longer 10 times but whatever it will yeah but that's fine that's fine oh i misspelled it sorry about it i believe you've misspelled conversation yeah there you go no worries okay so it's giving me an array whoa it's giving me an array like table converse and then rows so we have row one with that information row two right and so essentially what i want is i want the first row i i want row i so this is actually we're gonna call this conversation equal to conversations uh row i is that right um conversation do i need to put a conversation yeah let conversations yeah and uh conversations about rose not uh i think it might well yeah let putting let in front of this better um i think it technically might work if you don't but um this is better anyway so you've got your conversation now and um for each one of those we're going to make a slack api call all right channel back back here we want support is that it yeah support text is going to be your status is now boom and i want conversation conversation dot uh how do i pull up the air table so can i just put the name of the field dot status uh i think uh if you are from if you remember from the logs it was uh it had a fields uh field within the row conversation.fields and then you have your um capital s but yeah i think that'll actually work as well okay to match the uh yeah it's case sensitive there okay and then we also need to since we're pinging the slack we need to put thread ts which is you know which thread so it's got to find this thread right here which is this timestamp which we have in air table as slack message ts let me let me paste like this so we need to go into uh thread ts so again boom conversation conversation dot fields dot and how does it accept spaces like this um unfortunately javascript you have to um they don't they don't let you do that you'll have to uh use what's called a it's just another way of referencing it but um you can use a square bracket there in front of fields uh remove the dot as well uh move the dot in front of the field yep there you go and then put it in a yeah you put in the slack message yes in quotes and that'll work okay so it's like it's treating it as an array and just saying find this element in that okay i understand that kind of oh uh try single quotes all right single quotes single quotes are better i think we're yep single quick quotes yeah boom does that make sense yep there you go are we confident i i think you're a master now honestly i should be learning from you the student has become the teacher oh boy so jack says you need to define conversation rather than com.row in the builder um you could uh jack you could use um you could use conversations.rose.conversations.ros bracket eye and it'd be pretty yeah be pretty similar there um oh okay we don't guarantee like actually as a variable right you don't have to but i think i actually like your way of doing it i think that's very uh it reads a bit nicer right and it's a bit easier to understand when you look at it um so yeah i would say neither way is wrong um aaron your way is like very readable so see jack this is what happened like if you're if you're the streamer that you know jacob has to give me the props to my version is better but i'm sure it'll it'll help with the same thing that's what matters um home court advantage yeah exactly um okay so i think this should work so we know it's gonna error on whoops let me let me go back here it's going to error on a few of these in that there's no slack message but we know it's going it should work on this one right so zooms yes okay save endpoint do are we good to go do you feel comfort should i save endpoint and deploy um i see a few things that might go wrong but we can go ahead and try running it um i think you'll uh you can hit run test event even and it'll um okay you'll see what happens uh we don't even have to go and wait for the uh scheduler to invoke um yeah so let's see what's wrong oh that's good okay uh whoa in this case no actually it's not good but uh you'll see what do you mean oh it worked i'm actually surprised that worked i'm also surprised so ah wow well okay so um yeah uh it um you were missing in a weight in front of that uh lip call uh which means that the um well yeah we can check the stream here and um yeah we're missing another step where we update the um status change reply field right after all this yeah so i think that's one thing um you're missing a weight in front of the yeah where am i missing a weight uh uh right in front of those lib.slack.channels calls um below conversation okay boom yeah done uh so i think uh i'm not sure we've talked into this but oh god no no yeah i i'm i'm shocked thank you like i'm shocked that it worked i uh now so the thing is if we run it again so if i run another test event it's going to send the slack message again right and that's because we're not um actually no this time because we're actually waiting uh we're actually waiting for the um for each individual slack response now um and what that means is that um i guess it depends on the order that air tables are turning them in it seems like air tables are turning the um the valve one first uh but yeah basically uh because some of the slack uh thread tts um fields are invalid it's not going to basically uh you know the api is not gonna know which message to respond to um so i guess our two options there we can either delete those um these records or just change the status change reply yeah just the first okay yep and actually the uh the number one one as well um but that that has reply set to no so i think we're okay there okay yeah it should be just okay that was like uh that was test data yeah yeah um but anyway so now if we run it it should play nicely and um yeah it'll reply again because we we never updated that status yeah boom comes here it replies so it's replied each time no error and we get a nice yeah um okay so so i think that kind of speaks to the next step which is updating this last the robot last replied at right updating this in air table so actually i think this is another thing i think i can do now i feel i feel somewhat confident i can do this but i'm not sure but let's try it yeah okay man here we go oh god what is i i would have never thought that one day in the stream would be me attempting to write code it's like automate all the things attempt succeeding code okay await lib air table and i want to update do i know the record id i do it's in conversation so i can loop on conversation okay so i want to loop on conversation again wait i'm i'm kind of rethinking this uh you could actually i can do it here um i can just do it here i'm already looping on conversation yeah so you you absolutely could that's right yeah huh you this this is not planted by the way this is like me learning how to do this while we're doing it so uh lib dot airtable dot update update by record id okay now the table is conversations the id is coming from okay conversations dot fields dot id right yeah i have that in the field i want to update um does that not work why would uh you uh you've got uh well uh yeah we can we can try it let's see what happens okay yeah that means it's not gonna work the training wheels are off now so uh but this i'm gonna need your wheels have come off this side because i know it's bought replied ad but it's that weird date thing or could i just put new date um yeah you can just put a new date this time i think yeah uh and i gotta put do i gotta put this stuff you do yes just like this um and then uh space after the new there oh right right okay okay so this is gonna create a new date the timestamp of like when it runs it's going to put it into bot reply that there's you're not confident on this for some reason but let's see what happens yeah let's see what have you fun okay oh okay uh could not find what you were looking for and that's uh yeah that's that's you're very close though uh so wait let me let me just let me just think uh yeah let me just actually console.log conversations oh it's conversation not conversations is that yeah that's that's one thing then and um that's one thing okay it's good to know yeah there are other things apparently folks okay oh so the query what is this um uh the the query um so if you look at the difference between um maybe your first slack api call on this one maybe you can uh it is the id field you're right in that um something's amiss there uh but look at how you're using conversation dot fields um oh i missed the ah damn oh i'm ashamed yeah as well by the way actually uh you can so the that uh the dollar sign curly braces um well you don't have to use that outside of the um param editor that we just had you can that's fine um yeah cool well so let's try that then yeah let's see what happens i'm embarrassed but but this is oh no still we're still not there okay so we're almost there we're almost there let's let's try logging conversation within this loop um just right above this api call conversation there we go oh it's gotta be like dot id the id okay i'll figure this out well yeah this will show us the structure um so you can actually see that the uh of the record is outside the object oh no no um oh i see over here yeah there's a the actual record idea is outside of the um yeah uh yeah so you just uh yeah this is actually great because you got to see kind of how debugging can work and like lock statements etc cetera so now if we try it if we will we can see the log again but that's fine and uh yeah we're golden so let's boom boom right love it okay so let's let's do the full loop here this is the deploy oh all right save endpoint yeah 1990s i'm gonna if only we were back in the 90s we're not we're not uh if we were in the 90s i would have to manually write all this authentic i don't think way past the 90s but like there's so many things that makes this 20 20. boom okay we've compiled so so okay let's do this whole loop here hey i'm having an issue with zoom again okay so this should reply to say that we're on it boom yep i go into slack hey i'm having an issue let me go into our kanban this is it right here let me move it up let's say okay i'm moving this to in progress now we might have to wait a minute right so uh that's right yeah i think we uh i was looking at the clock when you're doing this and um i think it just turned to um 412 on my my clock at least so uh hopefully it might be the full 60 seconds um okay but we can watch slack and uh yeah we'll see yeah so you know how's your got any good plans for the weekend you know jacob we would you know writing comments i'm actually just moving into a new apartment so i've been um no i'm um yeah i'm gonna be doing a little ikea run um you know pick up some nice uh swedish furniture or something and um yeah it's uh it's actually my girlfriend's birthday too so um have a little surprise plan for that um like i guess i think it's not here but we're uh we're going whale watching should be fun oh um yeah should be actually going to be a great weekend i'm excited so i actually went whale watching uh not too long ago and we saw a bunch of whales i'll send you a video it's pretty cool it's actually really impressive i hope you see whales and i hope your girlfriend doesn't watch i i hope so too i think oh uh i told her about it maybe i shouldn't have made sure anyways um well enough no let's let's fill anything else um i think i see something in your slack channel boom what could that be and then boom yeah all right so yeah um now we have a fully functional little uh customer support um wait time uh like you know you always hear people wanting the first response as quickly as possible so um it should definitely help yeah so i'm i'm like i'm really excited about this because it gives me a lot of ideas we got the confetti so that's fun it worked um you know in terms of you know i i i'm i really think this is cool for internal workflows um you know let's say you're a shipping company or maybe not a shipping company but like a small e-commerce and something happens with shipping and you want to handle that issue in slack uh but kind of update somewhere else um you know i i personally am really excited about the different things that this opens up i'm thinking like stripe api i've always wanted to send invoices automatically from air table on a you know not on a schedule but like at the right moment and i know you have a deep integration with stripe so hopefully this is the beginning of a lot of folks having fun on auto code um so let me know in the chat if if this was fun we wanted to bring a little more code this week um you know jacob i'd love for you to drop in the chat where folks can reach you how can they learn more around auto code do you have a slide absolutely so for sure um we have a a great community channel um hello to anyone who's uh visiting us from there or watching from there um i also want to mention though before i uh kind of drop some of that info um we have a pretty robust listing of uh available like kind of starter projects so this entire um project uh let me backtrack me a little bit um autocode we have these uh whole app directory um you can like just go look at them you can even install them right away get them running this project is also available as an app so it could be a great place to get started with uh if you're not super you know like if you look for inspiration or you want to just like kind of see what's out there so i've left a link there um this specific app i think uh aaron you put it under one of the commands but i'll post it again yeah that's going to be uh i'm linking to it now autocode.com oh perfect perfect thank you just dropped it in the chat um slight conversation tracker you can actually yeah it's a little bit the code's a little bit different um aaron actually went uh everyone aaron went completely all script for the last one and managed to figure it out um we definitely uh i i was like oh no like what am i going to do you guys shocked me but i'm glad you got through it but anyway the code's virtually the same and you can actually uh like i said install this link your database link your slack workspace and just have the code to play around with afterwards um yeah sorry i'm available on twitter at hakuboo same as my username and community channel uh for autocode i'm there all the time as well uh you can go to autocode.com and then community tab slack invite uh and yes paul haar we have um um yeah we have the uh we have webflow uh form submission events and the uh e-commerce events and um like they're uh um yeah uh i believe their whole api as well um yeah they're all api yes yes doing a few a little while since i've worked on it but um so you can do anything with web flow uh we have an example uh app with um sending webflow form submissions uh with files to like box and um some other nice things like that uh yeah yeah and uh we're yeah you can see it on screen there as well um so yeah hopefully that gets some inspiration um tons of stuff for the air table too we love air table air tables uh yeah we used internally as well for a lot of processes so um tons of stuff there uh slack of course stripe um and if you go to uh actually yeah uh if you don't search anything there you can see the entire list and yeah hopefully that can be a nice way to start um i believe cotter is coming on a few weeks to the stream yeah as well cool all right so uh jacob you know huge huge thanks we pulled uh zoom dropped on us but uh uh you know we we i think we had you as a still for most of it but the audio was clear so really appreciate you working through that huge thanks to everyone who joined make sure you click the follow button that way you get notified i'm going to be adding some live uh live coding as well maybe some of that will be in auto code some of that will be in air table probably air table for a little bit more until i feel comfortable and if you have ideas of what you want to automate uh always reach out to myself aaron core a-r-o-n-k-o-r on twitter uh um so any any uh uh yeah ideas you have i'm always looking for uh things to stream so yeah so click that follow button you'll get an email every time i go live that's enough youtuber for today uh and yeah jacob thanks again for joining i hope to do this again really i would love to do more auto code stuff absolutely yeah and um thank you so much for having me on um it was a lot of fun all right bye everyone have a good one see y'all soon yep

Channel: Automate All the Things

Views: 808

Rating: 5 out of 5

Keywords: twitch, games

Id: 352jmwumxeQ

Length: 74min 52sec (4492 seconds)

Published: Thu Oct 29 2020