[Music] oh hello and welcome to live code happy hour for this fantastic May 29 2012 and to do some live coding ServiceNow unscripted today so let's introduce the team here start with Brad hey everybody Brad Tilton I'm a developer advocate with the developer program here at ServiceNow I have been doing some sort of ServiceNow admin development work on the platform since 2008 as a customer partner trainer and now employee awesome thanks Brad Chuck hi I'm Chuck Tomas a senior developer evangelist at ServiceNow similar resume - Brad - the partner 2008 employee 2010 lots of fun since then so coming up on my 10 year anniversary in about a week in a week I had to sell my last stock options today because they expire and brand new special guest Ben hi Ben Kennedy I'm a staff software engineer and I have worked on the service snow user interface for the past six years welcome and I'm Andrew bronze also developer advocate service down the platform business unit and I've been on the platform for over five years I had a couple of customers partner and ServiceNow and specialize in integrations large-scale development source control and fun stuff like that super happy to have all of y'all here today and now we'll do the next introductions our special friends the drinks read all right I am going with Dragons milk today I didn't know what I was gonna do till right before and that one that one one out when I looked in the fridge nice those don't last long at my house I am having a core dump our official drink of creator con cleverly disguised with a tea bag thing so people think that it's a faux tea I'm drinking Glenlivet 15 we're heat are you know you got that nice lovely and I am drinking a oatmeal stout Mastiff from rail house brewery and I'm pretty excited about that even though it was the like last interesting beer in my fridge I'm still happy to have it hmm so we are going to pick up where we left off last time so we took a week off last week for the holiday weekend and we were working on a component to retrieve some external data and we had made a scripted REST API to interact with our component so our component that we made communicates with our ServiceNow instance through that scripted REST API and then that's Chris scripted REST API connects to flow designer integration hub to get the data from the external source and bring it back and we had got most everything working and we brought VIN on today who's a more expert at component building than we are to come we've got a couple of more ideas of things that we want to enhance with our component today but really one of the main things is to look at what we did see if there's ways to improve it since we have someone who's more expert at that today and whatever other we were thinking about adding a button what else did we have in mind Brad yeah I think we're adding maybe adding a button saying how we can handle a you know a button click and do something with it which i think is probably our next step and if anybody has any instance right like we do that step I don't believe we deployed it to the inside yeah so we'll get it built and deployed to the instance and on to a landing page at the least that's good so that'll be like our our bow we put on the top at the end is well we'll throw it in UI builder it's cool anything that we want to talk about a share before we drop into the screen share and get rolling I know Ben you've got a workshop for knowledge coming out in the last week of knowledge anything you want to tell them so it's the introduction to the now experience UI framework starting from how did how do you get started with our new UI framework the tech stack that we're using how to install node in NPM and how to build your first component so from there we build a couple more presentational components and load those into UI builder as a bonus exercise which Spri me yeah and that is CCW 2905 and that will be in the last week of knowledge which is you know well even two weeks from now so it's you know we're about 12 days from now is when you can get that workshop saving the best for last hey I'm excited you know I learned a lot from Ben in the making of that workshop so I'm excited for everybody to get their hands on it I'll go ahead and drop in to screen share to do screen share so just while I'm here the same folks that did our intro animation did the this animation that's on the ServiceNow Developer Program unlogged in-page so if you haven't stumbled upon that I I like it I think it's worth a watch so Brad was driving this component earlier and I've picked up today so he had to commit it to source controls so that's one thing I wanted to to note right off the bat is when you're doing component building and you need to collaborate with other co-workers and peers make sure that you're using source control and a repository so that you so so that others can can collaborate with you on this project you cannot get a component back out of a ServiceNow instance so when you build and deploy your component to your ServiceNow instance part of that deliverable especially if you're a partner or something to your customer organization is the repository in which you built that component because just the deployment of the component is not enough because if they need to enhance that they need access to the initial source control for that so I've got our component up and running in a local instance I have so I pulled it down and the commands I did to do that was you know my typical source control so I just cloned that repository locally and then I did an NPM I to install all the dependencies I needed because none of those files and artifacts are stored in your source control so all of that needs to get installed in that local project folder and loaded it up so I'm roughly where we left off last time here in my component let's take a little bit of time and just walk through what we've got here so that one bin can get familiar and anyone who wasn't here first time can get familiar as well so our initial component is located in this this folder sneekly called 1 to 7 blah blah blah location rates and here in our index we have done what what bin suggests we don't do which is put all of our work for our component right here in the the index j s and so we might take that as one of the actions that we do today and then once you take a moment in and tell the folks why we might want to to keep our index j s small and just reference a invoke a different one so when you're developing larger applications and you have a lot of components and a projects when you use index JFS and you have a lot of tabs open in your uh in your editor whether you're using yes code or sublime text it's gonna be hard to differentiate which index.js file you're looking at and if you need to quickly navigate to another file so renaming that to something that's a little bit more meaningful is a little bit easier to to kind of maintain your code base another thing about that too is it's gonna be easier for people that are onboarding to look at that and be like oh this is the component name or this is the styles or the index GS is GS responsible for importing and exporting your your dependencies so that's there's one reason I recommend it it's it is not necessarily a best practice it's a a good way to maintain your code base stuff so this is all depend upon you know what your team decides and how big your code base is and in you know making my life as a developer easy is a thing that I lean towards right efficiency so the only that the two sad files we've got here is our defaults and our Styles but the bulk here is in index and what we did is we're using some now cards so we had already relied on some of the reusable components from our ServiceNow library of components so in the developer site if you go to reference and then now experience components that that's probably cut off a little bit on the side but it's the rightmost thing on the screen to get to this library and we came down here and checked out the card and the the other card ones because they all work together here and we're leveraging the the card on the now card component inside of our component so that's a dependency that we have because we're we're using a different component inside of ours so pretty simple we've got the tag line and the heading and then a second card with the tag line and a heading and down here we have our action handlers so we are doing when our component is bootstrapped so this is a life cycle action doo-doo-doo-doo if we go to our reference here in the now experience UI framework and go down here to lifecycle action handlers will see the different handlers that are available to us if we would like to use them in component bootstrap is dispatched once after element is initially connected in bootstrap so that is when we wanted to go and fetch our data from our rest endpoint was once our component was stood up and we only wanted it once right now we're thinking about adding a button to refresh it so fairly simple dispatch from here and we're gonna consume that down here in the fetch Cova data which is a simple HTTP effect to hit our REST API endpoint and then on success we are going to grab the data we need in and then so that our component can consume it I assume there's also a fail action type yet is we didn't leverage it here but there is no success action type and fail action types are ones that are available to us yes we're trying to absorb and understand a lot of the syntax as quickly as possible yep any questions about what we have done and set up here Ben no I'm wondering if vs code will pick up that additional property with the create a cheapy effect though so after your fetch coded data success strength that defines your payload or your your action put a comma there and then type in a on the next line you just had roughly here yeah you said put a comma and then e is their error action type there it is so okay for that there's also a nice little shortcut that a lot of the methods we use wool envious coated leasts bring up you know some helpers that you can actually see exactly what you know those success in the air action types are I didn't know that that one was there ready and available for us how do I gone to the documentation like all right let me go get the the word I needed cuz you know could have been fail action type or any number of you know developers naming things it's always special so in order to use some of these things maybe we should walk through that just real quick so in order to use these life cycle events we need to appear is we had to import these action types from the ServiceNow UI core in order to do that which you can see here is where we're doing component bootstrap from that and then to leverage the ht8 HTTP effect we had to import that as well from the UI effect HTTP I'm gonna just try not say H bad thing I don't know why it's a struggle I only had three sips of my beer here it's good beer though I'm really enjoying it so that's that's our component as it exists right now so there was a couple of things that we wanted to add and then there's a couple of things that we wanted to maybe explore doing that I think the size of this is fairly consumable I don't know if we need to you know I don't know if I had split it out into action handler as a separate or not in this case since it's fairly compact but I might want to explore you know just using the index J s as the import option and and putting all this in into a component a J s file named the component name but since we're it's a fairly simple component and we're only dealing with one in this right now it hasn't really bubbled to the surface so what about you Brad should we add our button what do you want to do first ready to start don't know I wonder if we should try to deploy to the instant first or we should have a component we could deploy didn't start to render have we we probably haven't added the UI builder so we do have a comment in the chat from from Tommy says that he has had trouble getting the the now card component to render in the instance there is an error in the instance or locally rendered I think in the instance okay well let's we're about to test it out right now yeah so I was looking for this code block so under components I only need this part yeah right about here no is directly under components that's right yep card yep yep yeah that's about right also no so save wait don't you want to give it a label an icon Oh probably that seems random maybe a decent description oh all these words label oh this is our Cove a location probably didn't need dashes in there I don't know what icon I want to use so description occasion rates for today's like teen dicta all right let's go get an icon which is here in guide no reference you have to pass an icon there don't you assign it an icon once it gets into the instance I know I think on the sidebar you can it probably depends on where you put it all right let's uh let's pick an icon what's it doing counting something yeah it's showing us some data use the filter where you got more than fits on the screen how about that works for me that works Phil you feel like font awesome things safe and looks like maybe it went too fast anyway well uh well deploy to the instance now see a line bill deploy deploy I think deploys right ah attempting to deploy I like it well it's my instance we did this against that's where we did it I thought it was a different way maybe it'll work when instance brawl comes to buy yeah yeah we one of the one of the age-old problems we have is where did I do that working again oh yeah instance wise which I know I got it on get so I'll just pull it down to another instance yeah I'll just pull it down to another it's fine I have some really great apps in here so should be great all right let's see Oh No Oh bail command let's pull this out how did we fail with previous instance because of the scope name why can't Chris ting so you can't just take any old wood you'll component pop it on any old instance huh that is not making me happy or whatever well that's uh oh that is not fun to undo how do we do it really explicitly tell people not to do all the things I'm glad to dear well you should be able just to adjust you know the component so in your component definition here if you perform prefix that with X - s + C - um not the scope name just the because it look like it was complaining about the component name not the scope name okay so up under components line three yeah the component tag name okay so maybe we can get away with this maybe if anyone knows how to hack this you're the best qualified out of all of us i mean i i've got i've renamed these myself but we'll see we want two digits out no keep the digits in there and then the other thing we'll want to do is in your index jsut want to change that also to match not here the that's fine in your yeah the index just the actual name of your car yeah the name of the component oh yeah here SNC yeah yeah this is how you learn how all these things relate together let's see is it deployable or deplorable Oh scope name is invalid Telus it wasn't as explicit this time so it looks like only the first four lines of your terminal is visible on the stream F way so the air we're getting it's 400 bad request scope things valid please try a different scope name alright so we'll also adjust the scopes name and now we have to make it shorter it doesn't need to be an underscore 18 characters only folks I put in a Twitter joke but it's still too soon Wow yeah 19 all right thank you you're the best did you just look at that and count Rain Man I wish I could see that but whenever you select text like that in the bottom right I was looking for it cuz I know it's on here somewhere and I just couldn't there it is 18 selected so I selected it to find that but I there's so much stuff down there at the bottom Anton didn't jump out fast enough and I was like ah it's fine I'll just my learning for today I'm done a little cool counter down well let's give that handy-dandy yeah so like when we're doing our newsletter and we have limits on the things I'm always pasting stuff into sublime to get the account hmm that was the ke now let's see if it works all right location right late rates has deployed so we'll open up this scope and see that yes there's some application files yay and important for us here and part of this might be cut off um there's four down here and we we wanted if for example you've forgotten to put in the code that we pasted in today for the UI builder part it won't add two of these entries specifically the Builder component part and one of the other ones which i think is there I don't know which I think it's the MEC book you like source code will stay for sure and builder component won't be there for sure but I of the other two I think it's the Mac proponent definition so I think that's like UI builder users so these two would would not be here if we didn't do that so let us go to a landing page landing page and open up one of these so we can get to UI builder and we're on go into agent workspace nope agent workspace get our little UI builder up and what host was the the API info coming from it's coming from github so I your scripted REST API was calling something for the Kelvin numbers though right github Oh github has Co bit numbers yes so a bunch of the data repositories are actually using source control in github as they like their public-facing website for the data interesting I think the UI builder maybe may not work on this instance now that I am thinking about it well let's deploy to a different instance demo ruined yeah how do you switch what instance you're gonna deploy it to so let's uh let's validate that I have a working instance of UI builder is that an Orlando instance it is I didn't go to a different one good good check though I just wanted to check it won't be for long you're gonna do a nightly build I am good luck with that yeah it's about that time of year right I got my waiting waiting pants on so I could prepare our skills real fast it is that time all right so we have UI builder here so I'm going to open up terminal and get off to the side so you don't have to worry about privacy shrubberies and get into my so what while you're doing that we have a question about in one of the components this was from tommy and the chat earlier and one of the sample components he saw a create graph QL effect and we don't have any documentation on that so then do you know anything about like is that something customers can leverage is that internal only like what is what's going on with that so curly that's internal there there are discussions currently on maybe having graphic you'll be more available in the next couple of releases but that's something that we use internally with graph QL to you know getting fetched either for things like workspaces so again it is early an internal API um the goal I think is maybe to have some availability for graph QL for customers but that's still under discussion all right awesome thanks so I'm going to you probably can't see this at the bottom of my window here but I'm gonna type now CLI log in or log out - all and then I'm gonna log into just this instance that we're gonna connect to and now I'm going to re-execute my command and it's gonna hang yell at me for scope hopefully that's my expectation as he yells at me here scope yeah I'm expecting an error I am that's not something yeah this this instance has the best scope ever right it does this and this needs to start with Brad --red oh we gotta take one more clear drop we do we have to take one more character off pretty soon we're not gonna have anything left here save that now what I'm curious as to is this checked the scope name when we created this thing because we had a connector to your instance and check the scope then and it did not throw us a an error then that's true yeah only when we try to deploy it deployed it so that's interesting that's that's how I'm gonna say that all right so that looks like that deployed successfully so hopefully over here we got a brand new every every list should have updated and be sorted by it by default interest I know every so we've got four so my expectation is I have bread there but that's not what I was looking for know what's above like I mean I have to refresh UI builder entirely and hopefully we'll have and component right here called kovat location and we drop it in into this container ping is it fetching the data it's connecting to Brad's instance because that API here but it doesn't know what Brad's instance is because it's if it was a that API call was a you know relative relative so in order to fix that we would need to make sure that to see relative that's totally what the error is I mean as definitely what the error is there was a problem loading this component you don't have it yes that should fail in a different way right so maybe it is having let's save it and then check the we got anything in the system log will check the will load this landing page directly outside of UI builder pretty brave and see workspaces yeah is it I think it's a module under the workspace at yeah right if you just go to the workspace home all workspaces all worked three agent workspace that's readers were so okay shouldn't give us that landing page should give this that landing page cuz it's the landing page associated yeah that looks roughly right now let's go Meniere's yeah let's go check our we've got a tectonic air nice so that's how that's not super helpful okay well there's yeah so there's two things which is the clearly the API is definitely gonna fail but I expect it to like render something the cards without the data so Andrew let's let's dive a little bit into the page and see if it actually rendered and they're just no data in there absolutely have tools again give us a little space if you select the elements tab and your dev tools okay and then yep you you have the selector already it's gonna look for covin we don't seem to have a cove it in there hmm I don't see between those two select the click counter the click counter yep so we won't look at the assembly oh I don't know what a click counter is 0 is the left is that other component right yeah oh I did I selected the click counter um that is what I selected so each of these are going to be um what components that use this shadow Dom so if you look for those shadow roots that should be representative of some component so here is shadow roof and that is the big one is it can also be a little misleading because we're using slots and the solid content can live outside of the regular HTML structure of your of your document so it can sometimes make debugging just a little tricky well if we expand that shadow root what's that it's a slot okay and then there's this wrapper so as a component there it's a new band name slot rapper I'm gonna check out the slower one or this one was definitely that one so we're looking for one above it this is the closest shadow root above that one yeah if you type application in when you're searching cuz what the name of our um component is encoded right it's it was X Brad it was two three seven something yeah yeah we said what six but location X 7 - yeah this this is the name haha there it is my guess is there's no content a big empty orange bar okay well let's fix the API part that yeah I'll just go grab your API is it is the API open um no authentication I can I can fake the the scripted REST API in fact I think we did some it may or may not already be faked so we did a little hand waving because we did the connection to a github and then they changed it and yeah given a test data we did it on the Wednesday show that we did in a word that was fun I tried to do it on Friday and it didn't work so I I think I support this and then I also need to export this guy and then over here this is not what I thought we'd spend any time on as much not that we ever spend the things on the time you know the things I think we will cuz that's not that's not how it goes nope choose the parent one first you don't have to I don't have to but I'm polite I want the thing to exist before it references it it's the way I roll to rest and get whatever's closest and I don't know what we called that come on okay so now what I want to do is here in feeis code I actually want to do now see live develop and wait preach build because this is gonna verify whether or not we're getting the data from mandalorian correct or not before I even try and go to UI builder and see if it's happy I'm gonna verify that I can actually get the API locally do you know I cannot L to load o go into our network the network tab see if we location hmm disappointing me I don't think we did anything that should have made this angry ID happy so I think I know what what happens I'm going to vs code sure and there should be an example directory go into the example directory and the Almagest my guess is the component names are different they are so you're importing the right file but you're essentially registering an element on the page that doesn't exist is there yeah and it's just not gonna render anything you stuck out through an error um keep your import the same cuz you haven't yet and change the folder name so when I when I've done this I go through I went through it changed everything all of when I had to do it right I need to change it here and here for sure and that should be better aha sweet we got things and stuff and that's an area I expected sweet well there's that I expect that could have I mean that's probably why I didn't work in the incense right one of the reasons because that's just right then yeah that's just just for your local um so when you're spitting up your note server to run your component locally it's it still needs some example file to use to load your bundle into into your note server what happens in the instance is it's actually compiling and bundling your component and then the instance will point to that static assets have them load in your component on the page yeah alright so now over here the API should be fine and we deployed that right we did did you read a play too no one felt like we did I thought we did on do you have to force it yeah yes you do so after you've so that's clear that I didn't deploy it again because I didn't force it so after you've already deployed a component to give an instance it's gonna you know yell at you if you try again but thankfully there's you know - - Force use the Force Andrew sudo make me a sammich that's getting better and James has asked in the chat do we have a fail action setup which we don't we do not because we never fail we're living dangerously build successfully so I'm gonna jump this guy yes and then I'm gonna save that then I'm gonna reload this whole thing so I don't know how sensitive UI builder is with the new version and I'm just gonna put it in a different spot - we're gonna give it a container and a container friend next to it we're gonna put it in this first container maybe the loading time is making me nervous yeah that's an unreasonable loading time for are you gonna turn red cursors so over here if I give this guy a full reload we should get our new containers and now that the API is working hey hey hey what nice the air on the other screen failed successfully I love it I did not think that was gonna work take a drink UI builder didn't like it but who cares it rendered where we wanted it which was an agent workspace we're landing you get that's what we get so we've only got about 10 more minutes of Ben's time we've deployed it to the instance in a tickly way more time than we thought it we learned a couple of things and that might be useful in a couple things that aren't super useful what what do we want to leverage the last few minutes with maybe Ben why don't you tell us what the best you severe your 10 minutes is whatever questions you guys have I am ooh that's good ooh hey YouTube yeah let's do that versus me trying to let's let's drop into just video of I am a change that's change I can get behind right there so my first question is those life cycle actions are there any of them that I should really focus in on when I'm when I'm building this like what do you want us to know about life cycle actions when I'm building action handlers in my components more often than not the component bootstraps is what a lot of from from my history kind of developing with seismic that's the one that I see more often than none because whenever that's first bootstraps to the page and your code load since initially loaded you want to do some action right you want to fetch some data you'll want to initialize other components conditionally maybe um the other ones there when your properties change that can have kind of a profound effect on your application and it's an easy way you know to kind of track what's changing throughout your application and maybe make conditional statements on under this this properties changed or maybe render this so those those two are the ones I see use quite a bit I mean we're used to when you're talking about properties I think it might be worthwhile to talk about you know the the directional flow of properties and dispatching oh that is a very good point um the UI framework is based on something called a flux architecture and it kind of boils down to basically properties in and actions up actions will bubble up to your parent opponents but you can stop that process you can actually say don't bubble up any further I just want this component deal with it but it's always properties in and actions out and that creates a unidirectional flow of your data through your components so it makes it really easy to debug to time-travel to figure out what's going on in your application so that's that's always a mantra when I'm teaching people is props in actions out and you can kind of track your entire application States do that so when I'm dealing with and you might not know the answer to this because I don't know how much work space work you did so if I wanted to add something to say the strip the what do they call that and read it the ribbon the ribbon in workspace are there how do I know what property or what actions other of those components are dispatching that I might consume in my component so there are a couple of different ways um I think we do have internally we use dev tools I'm not sure if they're available externally yet today or not but we do have internal utilities that we use and there are some scripts that I've created that the way that we can have attached the action handlers to components is through the use of symbols and to those symbols you can kind of track through all those so you can get clever and kind of differentiate through this component was like alright with this script I want to target this component what is gonna be dispatched out of that and then as you make changes where it bootstraps on the page you can actually see in the console those things being dispatched the problem with that is you know what internal or external so it's always gonna be subject to change so within regards to the ribbon if there's nothing documented I would be careful about actually subscribing or using those actions because they are likely not documented because they may change and that's kind of the one thing that's a good point like so I can maybe figure out what is being dispatched but I may not want to rely those or there's a risk assumed when doing anything against an undocumented thing for service now right is it a live on for 15 years and everybody's happy and everything's fine or it may die tomorrow you that's that's part of the absence of the contract means there isn't a contract and therefore it can change without any notice and you're on your own yeah it's hard to know cool how about you Chuck I'm still absorbing okay Brad because I can ask more but I know Brad's got some no go ahead I'm trying to get some questions from the chat here awesome he's handling the chat so you know we we dispatched those actions and properties in is there a level in which you think that we should separate out like when should I decide to make my components separate dependencies like it's its own NPM like at what level I've got an idea of what I would do but I'd like to hear what your thoughts are there that is an excellent question it all depends upon what you're trying to accomplish we we will have some components that will slowly be released over time that we'll do with things like inputs and dropdowns and type of heads but a type of head for example is a really complex component as you type you'll need to think about accessibility as you're typing you'll have a little comes up and will likely contain a list of results you want to to kind of give to your user a lot of that is smaller separate components that probably aren't super reusable outside of the context of this primary type head but some of it might be so it's it's all about what you're trying to accomplish with your component and for me it's all about API as well if I see my API is becoming really complex I'll try and step back and say it doesn't make sense for something else to be a separate presentational component so its sole responsibility is just displaying data versus is it makes sense to be integrated and have all these components kind of comprise this this monolith component that is probably maybe easier for users to consume so it's that's a tricky question because I've seen in the past where I made a good call and it was like alright this is great and then I made a bad call where it was like this is too granular and I have to import all these things and so it's it's always a balance of a functionality and if it makes sense for the project as with a lot of programming exercises right you can say the same thing in a lot of places is and what is too small and what is too big and wanted how many parameters are you passing and and sometimes you learn later and go this needs to be broken out exactly your decision at that time given your information may have been a good one yeah and that's okay because we can only make the best decisions we can make at the time given the information we have and then future me hopefully has better information but he definitely has up-to-date information because he he's future me and he might go oh well this this you know in the context of the rest of the ServiceNow space you know this script in this business rule oh I actually can use this in other places this should be a script include because it's I can I can make this reusable and therefore it should be it's its own separate entity and I just call it here and have that dependency but but having dependencies also increases overhead right like so there's always trade-offs with these decisions so I don't I don't know that we have great guidance on that yet even internally because it's it's a trickier problem and we're still learning where those boundaries are and when it makes sense but if I know for sure it should be a reusable part that I'm built because I needed it yeah go ahead and put it to the side because it's its own thing and just because I needed it doesn't mean that it's reusable by other people question from the chat I did have a question from the chat and it is kind of kind of specific James that's why James if I place a deployed component inside of a slot within another deployed component can I dispatch to that container component since it's technically an ancestor which it's a little you I want understand the question correctly because there is very important like order of operations here so is the component if it's a slot then that's something I would actually have to test because with in regards to slots of since that can't actually affect the Dom layout and how them bubbling works with the Dom that me actually changed the functionality so for that I don't know I would actually have to test that all right awesome any other questions for it we had we saw a few errors Tommy asked what is one of the tectonic errors that we saw I mean I'm not sure which era that was cuz oh I do it's live code we we run into a few errors yeah we had a few errors on the screen but I do recall seeing the tectonic error my instance on the landing page when the API was not working yeah it's a resource to believe like a resource error from from what I remember yeah I can't I can't remember what it was we fixed the error so it's gone so let's see what else do I have hmm we talked about this but I think I want to get your take on it because we made a decision for how we designed ours so we had that external API and github in this case was our external API and we made the decision our component would call a scripted REST API that would then call the external API so that so that we could potentially change out how that was getting served to our component without affecting rebuilding that component is that how you would go about that it's 100 cent how I would design that um the the only change I would maybe make to your component cuz if it's working beautifully is I always like having some top level component take care of data and then that Pipestone you know the data into my other components and then just because you have something to deal with side effects it's easier for people like this fetches the data and then this is kind of the presentation layer so after doing in your workshop that I would have separated this one out that way as well which is and if we didn't mention it enough earlier Ben's workshop was gonna talk about this a little bit in depth the presentational component versus the data component and that's a CCW 2905 if you're watching this anytime soon that will be something that you can get from the knowledge workshop area it'll be on-demand and so you'll get to it from the the knowledge landing site and get your instances from the now learning site and and that was I love that separation and it's sort of similar to the separation we're doing with the REST API the scripted REST API and the instance is I want this thing to just focus solely on providing this data for me and so the data sat at the component and the scripted REST API those things are separate than all my other functionalities and they only do their one thing which is talk to each other and and then you know there that that handshake component part and it keeps them nice and focused and able to to just do one thing because when you only do one thing it's really you know you should be good at that cool well we are at time any last things you want to share bad no no I really appreciate you guys having me on it's been a lot of fun I mean oh I can't thank you enough for coming on and joining us today I was really just a pleasure to have you here so we get to now rate our our special friends back in the same order starting with Brad and so this is on a five-point scale with quarter increments yeah so I had the dragon's milk barely go back and see if you rated it the same way this time I am thinking about that I waiting for that for me and I believe I'm gonna go four point five I don't know if that's what I gave it before but that's what I would have pegged you to say that because that's it that's a curious beer what does it take to get to a five Brad it's got a really knock it out of the park see that's dragons different that's that's like one of the very few fives I've ever given fantastic how about you check core dump my core dump t5 I've been drinking these homeless consistently since we introduced him I love these things their way to race and how's your Glenlivet well more than 15 is four five smoke pretty smooth pretty tasty so our the Mastiff is going to get we deployed it to the instance and at work which was our condition of victory today so it's it's getting the bump it's four to five gets that little quarter victory bump again thank you so much Ben and next week is the fifth week of knowledge there's more there's so much on-demand content if you haven't gone to check it out go go get some of that excellent content I know it doesn't feel like it's as urgent because you know it's on demand but as with any task just chip away at it do a little bit every day to grow your skills as developer and while those are available because they will only be available for a limited time we don't have a firm closed date on those but while it's still available chip away grow grow your skills as a developer just a little bit every day knock out 15 minutes of any one of these things that's in the on-demand section every day like make a goal 15 minutes every day like learn a little bit from the knowledge content so thank you audience that I love the the chat I didn't get to read it today but Brad was on that I saw a bunch of stuff scrolling by Brad and Chuck always a pleasure to hang out with you and been such a pleasure sir you're fantastic and I love the background there it looks so great it how often you have to replace the things everything's all neat and in its spot actually more often than I thought I was going to like pasta sounds good it was like not alright well thank you everybody have a great weekend you too thanks guys