Hello and welcome to the Supercharged livestream. I'm Sorma and I'm Jake and today we're gonna do server side service workers See Paul couldn't make it into the office because the bridge train system So I thought we could have a whole episode entirely devoted to service What are you doing here? Well because because you were late I thought we could do this entire thing all about service workers. No. No, you keep doing this You keep trying to take over can we have one thing around here that is not about you and service workers? Okay, show our hands. Who wants this episode to be about service workers? fine Oh, well, that's that's rid of him then so sorry about my the tardiness on the show. I'm not front tail quick Yeah, so what we doing what we doing? We are actually going to do server side rendering and we're going to do it with you and not with Jake There was a lot of confusion on Twitter Was like a very enjoyable. Whoops. Yeah Anyway, but I didn't make it and that's fine. Um, I'm I'm not doing the coding today. You're doing the coding Yeah, it's a bit of a switch around. I'm gonna be on hand to answer questions and Talk to the folks and I can already see we've got lots of comments coming people already. Hello to everybody in the chat Thank you for joining us. We'd love to have you here So I do you know feel free to keep chatting away and well you can you can make Paul interrupt me So that I do more mistakes My goal for today is is try to do less typos than you do and I'm pretty sure I'm gonna fail I mean, although you do set the bar pretty high. Oh But this is my revenge. I mean, I mean, I'm gonna be very supportive throughout, right? So it's like rendering service at rendering. Okay. What are you doing? What are you doing? Service at running? Yeah, I should probably explain because of this word has been all of those three words two words If it was a hyphen just those words have been thrown around a lot And I feel like there's not a very consistent understanding of what it actually means and so I'm trying to gonna capture it in a few words So I was at rendering is what you want to do if you have a single page app If you think back to the first router that we did we actually used a little Python web server I think you wrote that whatever you requested you would get back the index HTML. So if you requested slash about or just home or slash Contact you would always get the same index HTML Which means in that site there wouldn't be the content that you actually wanted to read So you would have to wait for the JavaScript to spin up To analyze the path that has been requested and to swatch swap out the content in the DOM with the actual content And then we switched it up to the advanced router Which did actually have individual pages for like about contact Miss whatever it was and then and then we pulled those in But that would mean that whenever you change something in the layout that you would have to do the edits in all of these Individual pages, so presumably that's what we're trying to figure out today So what rendering basically still is always deliver the index HTML But already inject the content before serving it to the user So you render the DOM on the server side That is why it's called this way and send it to the user So the content is already there without the JavaScript meeting to run at all Yeah, and then hydration happens where the job spins up and takes care of all the dynamic parts Oh, let's get our hands ready and write some code I'm gonna start With something so we're gonna write note on the back end We're gonna write a note web server that does the server side rendering. So I'm gonna make this a script With copyright headers so that we can run JavaScript just with executing the script I thought for this so I have in the folder here I have an app folder where basically our advanced router code is in the thing that we wrote Two sessions ago, I think it's exactly the same. No, not much I think has been done and for this one I decided that I want to use express express is just a little bit of Convenience about notes native web server so that we have a simple web server and use it by creating an express app and This app object is what we're gonna do all the roots. Have you done an MPM install? Yeah, I have the modules in here with express and all the other things that I plan to be using I'll explain as I go along. Okay, actually using okay, so we want to start with something simple We're just gonna write a web server that is just a straight web server. That's nothing else So what we can do there is we want to say that our app uses middleware that is called static So what this line does is just says to to express just serve this folder the app folder as static content And then we're gonna use notes HTTP server Create server that serves our app and we make it listen on 8080 and you've got this all committed in your head Well node is that is what node excels at right? Very simple code that you can Bravo. I mean well done. It's very good. So let's do This who doesn't love a bit of chmodding chmodding like it's like the plus X that makes it executable, right? I did that line at the top. So it's it's actually a thing this hopefully you can't find module express. Well, that's good It's in there though, right? No, it's not. That's like the only model. I forgot to install So let's let's do some good old npm install because oh that means you have to do the install dance while we wait for it to go Because it's not that big I was only partway through that the install dance Yeah, it does have a very elaborate install dance fine. So we've got a question here Why not use import express from express? Why are you doing the old sort of require rather than anything newer? So the thing is that modules for me are still a little bit iffy. It's just something especially on the npm side It doesn't feel as right. I'm not even sure if node for which is what I'm you already Supports the import syntax. I'm not having so we would need a label in between. I don't know and also Imports are declarative and not imperative and sometimes you do want to have like I did here You do want to have the imperative way, okay? Like grab this thing and then do this thing with exactly so for now I'm just sticking to require until the entire javascript ecosystem starts out how to do modules It's just for me to keep keep me sane. Okay, so what's the start? It's actually working. There's no error at least That's good. So if you go to local host 18 there is okay. Oh, this is actually a little bit cramped Can you do the oh there we go I can feel the tension as you're trying to Don't do I get it right? Okay. Okay, so you've selected them all as well by accident. Yeah, it's good So I want to see the protocol as well. Are you that ruin it? Why don't you just make depth was a bit bigger do? Oh, I could it's be one point one. Yeah, okay. Oh There you go. Just oh, yeah, so We got this and Now what I wanted to do is you wanted to I wanted to port this to HP to because you know This is the future and we should do this but for that we need TLS certificates so because I forgot to download it I will go to Google Chrome Simple HP to server because not only is a simple HP to server, but it will also allow us to generate Certificates, so I'm just going to download the Darwin version Yeah, is that gonna go to you? Yeah, which should be here. There we go. And then we go download simple boom boom and now we have a Certificate which we can use and I'm gonna show you how exactly So we need a so what you just you basically So for anybody who's not seen this before you built a simple a bit like the Python simple server, but it's the it's in built and go and It adds it's an HTTP to server so it has to be running on HTTPS So you got a self-signed certificate that you've made that it makes on the fly for you Yeah, and then you're basically you're treating it wherever you run it from whichever folder you run it from It treat that is the folder that you're serving exactly Okay, so and I just used it for the ability to generate a certificate because using the okay Open SL command line tools is so painful It's the original motivation to write simple a to server to not have to do that Okay, so you're using for right you want the certificates and now you're gonna use them here exactly So what we do can do exactly is that we are going to use Require FS and do FS read file sync We're gonna do synchronous because I'm dirty like that and we're gonna use the key and the cert read file sync search dot PEM and Now what we should be able to do is just to turn over to HTTPS and Add the options parameter to our create server and now it should actually be HTTPS. So let's try that No error, that's good We can close this. Let's add this And we get this which is basically because it's a self-signed certificate Chrome is gonna say You know that it's not actually secured and it is it is secure in terms of encryption, but not authenticity Yes, we actually talking to the right server, but since you're a local host We have the option to say, you know, I know what I'm doing. Let's proceed Yeah, and as you can see we have HTTPS with the right flag because as I said, it's not authentic But it works. So now we're still serving on HTTP one. Yeah, right? Yes, because I just switched to it Yes, now ideally what I would like to do is using a to be to however Express currently doesn't work with the age of your model because the to MPM model is still very much in development What we can use however is the speedy module, huh, which interestingly enough does actually serve a to be to You just don't have the option to push. So it is a valid a to be to server and since you're not going to pushing today You said it's a restock. I can't just It's just gonna work like this Let's say Let's restart it just to make sure. Hmm. This is interesting Options it worked on TLS Let's let's just give a to be to a try just to make I'm not sure if I have it installed actually I Haven't installed apparently. Let's try it. Oh Something very strange is going on. It's already strange Mm-hmm. Why didn't try a different port entirely? Yeah, let's try a different port. Let's try 80 81. Let's restart that Go to here. Oh Interesting that is interesting All right, so the question is why do we not get HTTP to? So we are reading the certificate I Mean, there's not much code, but I could do something wrong No, no, there isn't I'm passing in the options. I'm passing in the app Hey, well, do you know what? I feel better that it's not just me. No, yeah, how's the boat? I expected I expected us to I am also in this right folder, right as far as I can see Yeah, they're speedy everything. I mean at the very least it should be speedy See what I did there. It should be speedy anyway Should be speedy. I'm just gonna skip over this for now. Okay. We'll come back. Yeah So let's stick with hd1 somebody suggesting it might be the caching, but I did I did do a heart refresh Yeah, I saw that. I saw you do that, too.  Oh That's because I still have the options in there Actually, that's let's say with hdbs just to make just to make life Let's start the server again Put the hdbs back in there It's just working. Let's stick with this. Yeah, so we start the browser.  So I'm gonna restart the server.  Okay Let's just keep it gone. So Right now what we're doing this should all be working We can go to our different website at our different subsections and it loads because we're just doing a static server Mm-hmm What we actually want to do though is we want to add special handling whenever an HTML file is requested Because this is where we do our server site rendering. Okay, so what we're gonna use is app.get saying whenever there's a get request for And now we're gonna use regular expressions I'm gonna try to make this understandable. Okay. So what we want to do is what do I do? I don't know because case and sensitive like case and sensitive. So I'm gonna be that person because I know it. Yeah Yeah, because that's you know, it's reading somebody else's regular expressions is it can be very painful Okay, and and this is probably not gonna be pretty also because I'm just talking about this. This is not production code It's not gonna end up being a production ready web server or production ready back end I'm not gonna pay a lot of attention to being to do any like IO optimizations or to do very efficient server site caching All these kind of things. This is mostly to show how to implement server site rendering It's about a technique not about a specific high performance implementation in this regard Yeah, although we're gonna have performance in mind because this is why we're doing this It's a super show. That's what we do. All right So let's think about this. When do we actually want to handle a request? That is either when the path that's being requested ends with a slash or With is the or for recognition If it has a slash Something that is not a slash with a slash at the end Is that right? Do you know so or index HTML, right? Wow, that's already tremendously readable. So So what we're going for here is so you could ask for like slash home Just slash slash home slash or slash home slash index. Okay, so that's what we're trying to capture So if you come up with any of those three, otherwise, we're gonna fall through to the static exactly So all the funds that are there are gonna be served just as as we know And This is why I love mode for because we have Function so what I'm gonna do for now is I'm just gonna check it is actually working and just send back a test string Hi Could have been on brown, but whatever. Okay, fine. Okay, so I'm gonna use super charged Hi Let's reach out the server. I hope no syntax error, which is good. So if we just go here Supercharged high. Okay. If you're gonna go to about Supercharged high if I go to about index HTML I and then presumably if we do like static What do we have for static? We have app. We have static app. J. S. Okay So this should now fall through to okay So that's the static hosting that we had before okay Also, I wanted to show the middleware of the static middle express is really nice because in the response They take care of doing sensible defaults like default cache control default adding an e-tag Doing the last modified. Okay. So let's talk about this very briefly because I know this is this is a bit of a Kind of a hidden gem. I suppose like when you understand about these headers Life can be a lot more straightforward. I have seen people for example Using a service worker and then trying to like cash bust and do all these things because the the headers are fundamentally They're fighting with their headers Right, which sometimes is okay because for example and get up pages You don't have any control over the headers that they use so you might have to resort to these things But usually if you have any control over your back end, which for example on is three hosting you do Fix your headers. Yes, because caching is part of HBG and the entire ecosystem. So good caching headers are worth so much So at least give yourself proper e-tags So that caching works for your clients and you reduce bandwidth that they use on the website So somebody's basically saying here the the e-tags. They've never really understood what the point is okay So why don't we take a moment explain? E-tags are pretty great. Basically what they mean is that When you receive a document from a server it gets an e-tag and that e-tag is a guarantee that it is Will only change if the contents of the files have changed Which is why most server implementations use some kind of checksum like sha one or sha two predicts MD5 whatever you generate these e-tags What the client can then do put it these files into its cache And when the user goes back and requests the same file somewhere in the future It can put an if if non-match header in the request and add the e-tag So the server knows which version the user has available locally and if the server sees hey I have the same version here that the user already has the server respond with a 304 Meaning not modified and you save the user redownloading the entire contents. Okay, and what this is actually kind of it There's also weak e-tags, which is you fire lighted. This is when it begins with a w slash. Does that sound that sounds for a weak e-tag? Okay, which is defined as The e-tag only changes if the semantics of the documents change But they're not necessarily bite equivalent What does that even mean exactly and this file I have never encountered them in the wild But you're saying that Express uses them by default, but it's still does bite different e-tags. I guess so what it means basically is They only have an effect if you're not doing range requests Okay, because they're not bite equivalent necessarily you can't do range requests or use a part of it for a cache But as long as it's the whole document you can use the one you have if the e-tags are equivalent I wouldn't worry about it too much. We're gonna cover our own e-tags later. Ooh, I think how exciting exciting indeed So we are now in control of delivering our own HML files So that's Before you go any further if you've just joined us. We are doing some server-side rendering today We are taking the advanced router that we did a few episodes ago And instead of kind of having a completely static Set up for the HTML files. We're actually building them on the fly in the server Serma has got some JavaScript code up and running, which is just at the moment turning out some HTTPS Basically, and we have somebody remarked that you have managed to create a regular expression that worked the first time around Which is impressive and I would agree I watch that I was like, I mean that's unintelligible I grant you that it really is look at that in a few weeks and that you'll be absolutely terrified But all the same well done. So we basically we've got this situation now where if we have a Requested slash slash section slash as in slash home slash or slash home slash index that HTML We will serve via this chunk of code in the middle and then everything else is going to fall through to our static hosting Exactly because that also they express the the order in which you declare your handlers or the steps is Important because express goes to the through them from top to bottom. Okay. All right So now we have a handler that we have to implement and the reason I did this is because let's look at our index HTML The original one which you might remember or you might not The thing is that between this index HTML the index HTML in slash about the one in slash contact They're all pretty much the same except in the as the SC view elements that we wrote The actual for example on this one home has contents while the other ones are declared as remote because we We are not on the page right now, but everything above and below is the same for all pages So let's split those apart and this is exactly what I'm going to do. So this one is What I'm going to call the header Let's expand this so people can see where I'm actually going Server site rendering app and this is going to be the header header dot partial dot HTML and Let's go to the rest and call this The Come on don't always throw me out of the folder. There we go the footer dot partial dot HTML So now we have split the file in header and footer and the actual index HTML will not contain much more then this and I will add something here, which I will explain later All right, so the actual index HTML which just has the content is relevant for this page It's just one line in this case because it's just one element. I already prepared this for the other sub pages So the about index HTML also has just one line Same for contact just the content for that actual subsection and the rest has been split apart in header in footer And what we're going to do now is we're basically going to assemble the header the actual content and the footer in our handler and I'm going to go to Introduce something new which is we have been using the node file system model to read files but the thing is that Node currently and they said they won't do this anytime soon in the future. They don't use promises and Reading multiple files with a callback based API Makes my head explode and that's why there's a module called modernize or mz, which has wrappers around all these Basic APIs from node and turns them into promised based APIs. So what we can do now basically is we can do promise Okay, so you're doing three requests and one for the header exactly so I'm going to do app Header partial HTML. I'm going to do really depressing. You're not making typos. Oh Fine carry on app and now we're going to need something here Which we're going to talk about in a second which is index HTML the actual content of the section we want to load and We're going to read the app See at a typo. Yeah, I think it's just a pity typo, wasn't it? So we have to sort out what we're actually loading and this is where the regex comes in because I have put parentheses about the thing that will be the section that we want to load and Express being a nice guy. We can actually go and say the item that we want to load is I Think it's this let's let's check this Ah Let's just send back our item So what I did here is I'm true. I think it is params on the request of you get contains the parenthesized parts of a regex. I'm just gonna send it back to see if it actually works So let's restart the server Let's split our screen into where is my chrome? There we go This is a little bit too small So if I go here We shouldn't see much, but if I go here Yeah, we have about Like a lot of contact. We have contact exactly what we want. So we have one question that's come in Is the routing that we have here? Yeah, effectively is It's different to the front-end code that we had only And today we are we gonna cover off? Using the same routing or we completely avoiding that no cool The code that you wrote in the route advance will was a disaster No, that's what you said It's mostly gonna remain untouched. We're gonna do a little bit of treating later. Maybe if we get to it I have an idea that I want to try out But for now, we're just gonna do the delivery part I mean if we get this done it might be interesting to talk about Writing JavaScript works in the front-end in the back-end and maybe even in the service worker Which is the trisomorphic JavaScript, which is a great buzzword that people came up with But that's for the future for now. Let's start rice and that's that must be service side client side and service worker based Routing yes, which you know eventually maybe terrific So we figured out what our item is so we can just put this in this great template expression so I'll just put item here and What we're gonna do next is we now have an array of Files so in case you don't know read file returns buffer objects. We don't want buffers We want strings so what we're gonna do is we're gonna map over all our files and Say to string and say this is you to have it encoded and now we have an array of strings And an array of buffers. Oh easy. It is so easy and what we're gonna do I Don't call me out on any honor. Yes. We have an area of strings. So now we can do response Send files join Like this and because we're good. We're also gonna catch our errors So if any any of these fails because for example, if any of these files don't exist The promise dot all will not resolve but reject and now we can handle that in the catch part of our promise chain and say our response should have a status of 500 for now and send the error to string Okay, so we're actually doing error handling which usually in one off code doesn't happen No, it's pretty cool. So it doesn't in mine as we may have noticed. So let's restart our web server and Let's do curl because we haven't done curl yet. Actually You know what let's do curl we're gonna use dash k dash i so we want to get to see the headers But we're also gonna use dash k that means ignore certificate errors because as remember We're still serving over TLS with a self-signed certificate and curl is gonna reject unless we give it dash k as an option Do some of you know that stuff off by heart as well. I've done so much curl that I actually know these two Way server error That's undefined. Oh, why is it undefined? That's not nice Item items the prom zero because if it's undefined, we're gonna use just an empty string. Okay, the easy fix, right? Let's restart the server do another curl. There we go So we have Reassembled the entire file because you can see the header and the footer However, if you take a closer look you will see that we have five sd views because our header has all the remote views And then we basically reiterate the home view with the actual content Which you know it pro I don't even know if your code handles this so you know don't do it don't do it I want to see it break that's gonna break. Let me open the console for for more fun in in the error department. Oh, thanks pal It's just broken. It's just nice. There's not even error. It's just broken. It just it just yeah Let's look at the code, but it should be yet. So as you can see here, I can I should zoom in zoom in a little bit We have five sd views, which is not what we want. So let's fix that And and one typical thing or one easy way to fix it is to turn our partials Into templates that we can use with a template engine Oh nice and my template engine of choice in this regard is because I know it pretty well is handlebars. Okay Yeah, it's pretty common. So what I'm gonna do is I'm gonna require in handlebars Handlebars require handlebars So go a question here. Yeah, is it normal to end up with rooting in three places or is that a no-no? Um Currently I would say it is pretty normal. I'm assuming that something like trisomorphic at least Isomorphic you can use in the front end and your service worker is gonna become a pretty common practice So this is I think there's a distinction here between just having the rooting all together Yeah, so when you do progressive enhancement, you're gonna build Rooting on the server side like this any way, right? Yeah, just gonna go because they have APIs and content delivery All these kind of things in your app right and then you are probably gonna progressively enhance into some rooting on the client Anyway, and then if you progressively enhance to have a service worker You're gonna have rooting in there something at least you and you might do a pass-through actually just kind of going well You know unless you're building streams on the fly in the service worker, for example, which is don't say that He will come back in the room if I say streams too loudly. That's Jake by the way safe I think so far some proof wall, okay Anyway, okay, so it's probably pretty normal And whether it's actually the same code the isomorphic trisomorphic thing So personally, I'm on a bigger believer in trisomorphic because even though I'm writing note right now That is not the only language you can use on the back end. There's like go Python PHP come on. Yeah, there's a way there's Java There's several pages that is and you can't share JavaScript code with a PHP back end unless you're doing really weird things and technically There's still CGI bin that that is yes, please don't okay, so I interrupted you I just imported required handlebars and now what I'm basically just gonna do is I'm gonna take all my files and For each file, I'm gonna say handlebars Compile this as a template and execute it with a request as the context So that means that inside our header content and footer We have access to everything in the request object, but since we have item. I'm just gonna add Item as a new object to our request so that we have this inside our context So I'm turning all the files into strings compiling them with handlebars executing them and then reassembling the website what we're gonna do now is We are gonna I would like to use handlebars if but the problem is that handlebars if only Checks for truthy or falsely values. It doesn't actually evaluate expressions What I would like to do is if if item is Equal to home Then I would like to skip this but this doesn't this is not actually in this case It would be empty because home is a default But handlebars can do this so that I'm gonna write my own helper, which means if not equal That doesn't exist yet. We're gonna write it. Okay, so let's if not equal So we have one of these for every single section exactly. So we're gonna see if this is for about If you're just joining us Serma and I are doing some server-side rendering today We are taking the advanced router from the previous episodes and we are basically making it rather having a bunch of static files We're now actually putting in some JavaScript to generate these files on the fly And we are in the middle of that process You're currently basically making our templates and making the HTML sort of dynamic so that it can be Built on the fly by the JavaScript that we have Thank you very much. I am actually here for the duration and of course you can join us You can ask your questions and there are some some brilliant remarks already coming in I Fortunately Jake is still shouting service worker every other You can't hear what it's them is. Well, I hear it. I mean I read it and I hear it and that's it's a big problem All the same do fire in your questions and your comments and we'll carry on on this end So you've got handlebars. You're making these dynamics. So now we we just you So we just used if not equal even though it doesn't exist. So let's better make it this so there's a register helper call if not exist and this is where handlebars turns into black magic because it just gives you as many parameters as The helper takes and a magic options element at the end What we're going to do here is we're going to check if a is not equal to be We are gonna Options function this now. This is just something I have to admit. I memorized this because What What this does is the options object contains the function that will generate the string that is in between our moustache braces in the markup code and This is just the context so that we passed an original. So in this case, it's going to be the request object Basically what we're doing is we're only going to render the things in between our if not equals blocks if A does not equal be which is what we wanted to say with if not equal So Fingers crossed if this actually works or not. I'm gonna restart my server. I'm gonna expect syntax errors There aren't any. Oh, yeah, big show Yeah, so let's restart this it's actually big isn't it looks it looks like it's actually correct You concentrate to the context section. We can click again. It is good. Let's look at the code and as you can see we only have Four SC views and the one that is actually live is missing from the remote ones Okay, wow so we achieved our goal of only rendering certain parts depending on what page we are currently on So that means we basically just is she achieved our server-side rendering We are injecting the content that is actually requested before any JavaScript on the client-side runs and yet We're more or less just delivering the same page over and over our header and our footer so what would you do in terms of Say caching this because if you build these pages all the time What would you actually do to say for example not have to rebuild these every for every individual visit? Let's do that. Let's let's build good caching headers. So we're gonna Before we sent the file We just assembled our content so this this content variable holds the actual bytes We are about to send down to the client what we could do is we could use these contents to actually Calculate a hash value of the contents and use that as an e-tag. Yeah, so let's do that luckily Node has crypto. Hey, you know in the last episode I asked you what the the German was for For CSS. Yeah, what would what would be an appropriate? Is there an is there an appropriate kind of German term for server-side rendering? Yeah, so that rendering I guess could be called The visa to go for lagnos fuel, which is exactly what we're doing right now And in case you're German, you know exactly what I just said that's and I've again like always I've got no chance of either Remembering or pronouncing it correctly, but it just sounds so cool Well, I'm still gonna call it server-side rendering. Yeah, I want to have more German Let us know and I'll make sure it happens So we have the contents and what we're going to know is we're going to calculate a hash and the hash is going to be crypto a Create hash maybe actually let's let's lose note and say crypto is require crypto and then crypto Create hash tag completion for the win. Okay, and we're going to use chart 256 because that is decently good do some indentation We're gonna append content It's called update because you can incrementally add data to a hash and have it hash it over time if you just have segments That's why the function was called Update which I find a little bit confusing and then in the end we want to have a digest as a hex value So that basically gives us a string that encodes the hash value with a hex format And what we can do now since we have the hash We can go here and say Respond set that is the call that sets the headers of our response We can just give it a dictionary and In this dictionary we can say for one we want to set the e-tag Which is our hash and because while we're at it. We can also set a proper cache control Public No cash and this is something I wanted to talk about because cash control is such a complex beast I've been trying to wrap my head around it and there's so many facets to this entire thing It has it can do so much that I just memorized basically two things that I'm ever going to use cash control It can do like private caches intermediate property control over everything But most of the time you just want public no cash and it sounds wrong, but it's not So something I used before when I did know what I was doing was Must Revalidate because that sounds right to me, right? So you're saying is that this should go out? It should try and get it from the server again Before you know before any exactly so I want the client to send a request of the server using the Cache checkers like if non-match or if modified since to see it should always revalidate the server if the cached version is still Fresh so up to date. Okay, however Must revalidate doesn't do that because what must be valid actually means is once the resource expires It should be revalidated. So what you would actually have to write it right is max H zero meaning it expires immediately after reception It should always be valid and as it turns out Max H zero and must revalidate There's a short version which is called no cash. So even though it says no So even though it says no cash caching is actually still happening, but with a validation round truth, okay So we've got a question from somebody basically asking Whether the code will be visible somewhere after the session and of course as always we're gonna put it onto our github repository We're gonna link it up in the video description. I guess yeah It's on our Google Chrome or can get up and everything's gonna be in there. Yes always has been with all of the other Yeah, it goes narrow kind of umbrella It's github.com Google Chrome slash UI element UI dash element dash samples. We will link it You can find it Based off previous episodes of it's always in the description for that and this code will go up there Bit of a funny name UI elements samples. This isn't really UI work today, but I hope you'll differently and they evolved So your no cash was basically there to do them the max age zero must revalidate exactly which is down to no cash It's a kind of a shorthand version. Exactly. It's just a shorthand really brilliant. So let's see if I did this, right? I'm gonna kill the server restart it Still no no error, which is Eerie, I don't trust it. Yeah Let's use curl and actually I'm gonna use capital I which means only show me the headers Okay, I don't care about the content right now and Actually, let's start with static fjs, which is a file as we tested before that is delivered by the middleware So we should have the somewhat weird weak e-tag Which we do sure enough we do and now let's request something that is delivered by our own function And we should have a really long e-tag a shout to five six hash Which we do so that we also get your public no cash there as well. Exactly. So that means that Assembling our the header the content and the footer we will Recalculate this hash every time and the user will only Redound it if they don't don't have it cached already. Perfect, which is really nice So now we have caching Ideally probably we would write a little bit more complex code to not Recalculate the hash value every time but these are the kind of things and I say this is a production code This is more about right and you probably you know consider a CDN and other kind of intermediate caches And so forth to make sure that you know things only hit your server when they absolutely have to but for the purposes of today We're showing and this does come up on the chat. Sometimes we aren't always going to jump to a final solution That maybe something a prefabricated one and the reason is not because we don't like them often They do a very very good job, but it's this is our opportunity to kind of show The underpinnings if you like the kind of engine the essentials the the engine inside so that we're it's about their principles More than the code So I think we're both kind of the opinion that if you have to know The basis that certain frameworks are built upon to be able to fix them They don't do what you want for once which usually if you use frameworks You will have run into the problem that something is not doing the same thing You would like it to do maybe you go somewhere and they say you know what we all we do is write Python And you think I don't know I'm used to writing in JavaScript in node What do I do? Well, if you know the kinds of things the kind of headers you should be setting the kind of ways you might be It's more a case of plugging things together rather than anything else. So that's kind of it's what you do versus how you do it There you go, right quote me on this All right, so technically We just got server-side rendering, which is really really cool. So if we go here, they should all be working As it is before and we're actually assembling these pages on the fly however something that Might be a little little weird Let me kind of disable cash Let's just I like cash because I see that we get to be a force which is not modified which is good, right? That's what we want exactly we want it But in this case, I wanted to point out that if we don't have caching enabled that if the site downloads contact It actually downloads the entire site even though again header and footer Are pretty much the same, right? And if you look at the only kind we actually need from contact is this single line So we're actually pretty being pretty wasteful Download when the user switches to another tab so the little bit more context here, I think is that What in the JavaScript code we actually we download the full document? Don't we let's look at the header So yeah, we basically would say the root is This one Oh, no actually when we go to about The sd view requests this website from the server the entire thing and puts it Into the dome pulls out the part it needs and switches out the but it takes the app But it downloads the whole document and then query selects it out only that little bit So you're saying what we should be doing is just just send down that little bit Yeah, okay, since we're going to throw away the rest anyway go go go go on the server side do it do it do it Look at our index HTML Text in our at our well index HTML root, I guess we could do something really sneaky what we could do is We could So add support for a query parameter. Okay, so right now if we do Something like this you will get the entire site Oh We'll get the entire site What would be nice is that if we add something like partial that we only get the bits that are actually relevant for our server side for our client side JavaScript So what I'm going to do is I'm going to check if partial is in the request query dictionary and Now at logic so as you can see here We have a lot of files that are being read but if we have partial We actually only want to read type of We only want to read This file well my copy pasting is off the charts today Still better than mine So we're gonna use let for once we're gonna use Because we're gonna change it if we have partial you're just gonna read one files if we don't We want to read all the files boom Okay, so you don't yes for partial We'll only give you the little bit in the middle if you don't we will give you the header the middle and the bottom Okay, so let's as a promise all files which sometimes might be an area with just one item in there and sometimes with three Somebody is asking. What is the actual benefit of server side rendering? You don't experience mostly and I think I touched on it earlier at the beginning. I guess if we didn't do this and we didn't do Like rendering out all the pages ahead of time and saving them as individual files The user would have to wait for the JavaScript to spin up Mm-hmm, so you had to download all the JavaScript build the page on the client and then inject that HTML And usually in between there's also a request to the server to get the actual data that the user wants to see Or you have to maintain multiple copies of the same index HTML, which is also Which is probably more developer experience But also there's very error prone because the second you you do something wrong Everything can break apart. So yeah, one of the superpowers of the web as well It is really worth pointing out is its ability to stream if you look at a large document If you look at a large document on the web and it's like several megabytes large It can still render after the first few kilobytes have arrived because it has hopefully potentially for some inline styles It's got enough to get something up on screen if you're gated on your JavaScript You have to wait till it's like an entire kind of bulk download is finished before you can get anything on screen And so having something that where the server can immediately respond by going look Here's some HTML and ideally some inline styles or whatever Get that up on screen and when the JavaScript and everything else is ready Then you can progressively enhance into other things. That's good if JavaScript breaks Which is something that can happen. I was just on a vacation in Indonesia where internet is Noticably slower than what we're used to here You really feel difference on website that do care about Delivering the right content on the very first response versus the site that need JavaScript and everything to just get started Basically performance and resilience are at least two performance. We're doing it on supercharged Carry on carry on I will All right, so we have files files and we're gonna do the rest days the same So if it's just one file, we're still gonna turn it into a string We're still gonna compile with handlebars bars, even though nothing is gonna happen there And then we're gonna create a hash Set the headers and set them back. So all the the pipeline stays exactly the same We just added one if to handle partials. So let's see with curl if it's actually doing what I want So I'm gonna reset syntax errors. You got one. Oh, it's not it's worth it outside strict mode Now didn't you say to me earlier? I'm pretty sure that yes I think that's the case apparently apparently you need to put in you Apparently I think in your versions of note. You don't need maybe I was on note five. Yeah, no, no five six four So yeah, I think that let's give this a try again That's a good start. I can live with that. Okay, so now you can do you so let's start Does the old version still work where we get the entire document? Yeah, I does and let's add partial And we just get a single line, which is awesome and also it has a different e-tag because it's a different document Which is good. So let's go Let's actually go into your code and get to patch up your code. This is so exciting We're talking about it's I write flawless code. I Let's look. Is the router the router? I'm not gonna help you now. I'm No, it's the view takes care of actually loading the data for itself because you know, that's actually sensible design All right, so somewhere in here we should have the XML HP request This is the on-load events that There we go. So what you do is you call You just use data which is I think the part of the URL that we've just navigated to and the only thing We have to do really is to append partial I don't trust this So I add a partial that means that now our client-side code should only load the data it needs to refresh the views Let's go back to the browser. Let's go back to home and refresh And because we have the preload headers. We already loaded the different. I mean, I can go here It should still work. So everything looks right and it's good So it's still working and let's take a look at what about actually load it Somebody's asking if you can when you get a moment, can you disable JavaScript and just show the benefit of server-side rendering when this is done? Switch off JavaScript, right? And then it will just show that the links actually work without Well, yeah, yeah, okay. So he I can now click. Let's reload. Let's go back to home. Let's reload I Had console I'm gonna click on about We load it about Partial and that means in response. We only loading a single line of markup instead of the entire document which is yay winning for us So we're gonna save a lot of data. So now let's do that since we this seems to be working fine We disable JavaScript Home refresh Okay, click around about Contact missy. This is there's no animation because we have no job. That does it still work She's still getting to the this is the this is progressive enhancements Enhancement done right because even without JavaScript the site is actually fully functional winning This is really really good. And then we just enable JavaScript again. We reload our website and we get our nice switchy animations So in the end We just wrote a back end in about 70 lines. I want to give this one more try Okay, I just want I'm gonna actually I'm here from speedy on speedy the entire time and we saw HP one, right? Yeah, I have no idea what's going on here I'm gonna blame note for Okay, that seems like a thing if you want to know why this didn't work follow me on Twitter And I will figure this out because this is bugging me Yeah, well, it's the only issue honey had the early doors and you recovered beautifully. I must say Are there any other questions on yeah, how is the chat doing? Yeah, it's doing brilliant. There's been so many great remarks so many So many brilliant chats in here. I've been really enjoying it. I see why you do this. This is this is really rewarding It's really nice people out there in the chat. Yeah So I guess what we really say we've got 70 lines of JavaScript. We're gonna push it up to the GitHub repo So that you can have a look around and we'll probably add maybe a few comments in here I Am gonna get you to move that regular expression out from there. That's yeah I'm gonna clean that one up because it's just that it's just it makes your eyes bleed and nobody knows It's not good. It's really not even the comment doesn't help. All right. Okay Are we done? I think we're done. Wow We got we got so that rendering in in under an hour Perfect. Okay. Well in that case, I guess all that remains is for me to say Thank you to everybody who's joined us on the live stream. Don't forget that you can subscribe. You can Follow us on Twitter. I'm at aro twist and at just Zorama and we will catch you probably in the TLDW till Too long didn't watch your TLDW. It was TLDW. Yeah, I've got it right this time Well done me normally when they record those videos. It takes me a lot of takes to get even the slightest thing, right? It's a bit like my my typing. It's it leaves a lot to be desired. It's it's like I'm not Exciting note. We'll catch you next time. Thanks for watching


Hi everyone, Joe for jasmiescasebreaks.com, coming at you with 2020, 2021, Penini, Donaris, basketball. Hobby pack break number 24. We're giving away nine opulent spots at the end of this single little pack break. So obviously we're baking the price of the nine opulent spots inside this pack, along with the cost of the pack, dividing it by 30. Here's the group break right here. At the end, we'll re-randomize everybody's names in the top nine. We'll get a spot in the opulent sprake, which is coming up in a separate video. Big thanks to Jose, Christopher, Terry, and Don. And there's all the teams right there. Let's roll it. Let's randomize it one and a six, seven times. So we do the pack break first, different dice roll for the giveaway. So for names and teams, seven times, one, two, three, four, five, six, and seventh and final time. Seven times for the teams. And seventh and final time. Clippers down to the Mavericks. Wow. They just finished their game against each other. All the road teams have won the games, which is crazy. So the Clippers were in Dallas, and they won. So I guess that means Dallas will beat the Clippers in LA on Saturday or Sunday. Sunday. Travel day on Saturday and the games on Sunday. Here's the first half of the list right here. Here's the second half of the list right there. Let's sort by column B. Let's print and rip. And there's the opulence case back there. That'll be in a separate video, in a different video. Devin Vassel to 349. John Collins to 199. Devin Vassel will go to Don. John Collins also for Don. There's PG-13, Marvel's card right here in crunch time, Anthony Davis. Danny Avigia, Kongu, Grant Riller, CJ Elby, Nico Manion, and Xavier Tillman are your rookies back there. We need Anthony Davis in crunch time. Maybe next year, Anthony. There's PG-13, Marvel's. He's still in the mix. John Collins, Hawks are still in the mix, and Devin Vassel, one of the up-and-coming youngsters for this first. All right. Let's flip back to this list right here. Let's grab everyone's names. There's some new dice. There's a new list. And the top nine names after six are in that opulence break. One, two, three, four, five, and sixth, and final time. After six, it's going to be the top nine after six. So from 10 on down, 10 on down, sad times. But from nine on up, happy times. Done.  And all done. But Jose, you snuck in. There you go. So congrats to you. Thank you to Chris and Terry for giving it a shot. I appreciate it. We'll get them next time. I'm Joe. I'll see you in the next video for Opulence.


Thank you, everyone. Always wonderful to start with an applause. So that's always great. Yeah, well, anime taught me about communities, development, and tech careers. Very excited for this session, and amazing to see so many people, particularly on Friday. So really great to see so many people. So here is the Venn diagram. I think it's kind of easy to understand. But yeah, if you are an anime and communities fan and you both know both, then very much welcome. You are right there on this sweet spot. You are doing great. Thank you so much for attending. This session is for you very much, I think. If you know communities, but you don't know anime at all, then you will likely learn a lot about anime. So welcome and enjoy. If you know anime but you're new to communities, then you will definitely learn about communities. So that's really great as well. Welcome to you as well. And if you don't know either one, so if you know nothing about communities and you know nothing about anime, then you might be a tad bit confused throughout the whole session. But maybe you will learn something as well. So it's all right as well. But that's the kind of audience here, hopefully. So who am I? I'm Annie. I am a senior product marketing manager at Kamunda, as just mentioned. It's a end-to-end process orchestration and automation company, very developer friendly. But yeah, I'm also a CNCF ambassador, as well as an Azure MVP. And I am a Kubernetes and CNCF meetup co-organizer for Finland for almost five years now, as well as I coach early-stage startups. And then I also co-host a cloud gossip podcast you can find from there. So this is the usual slide that I do in conferences every time. But now I do want to obviously add that yes, I'm a huge fan of anime as well as manga and all of the kind of things that come with that. And maybe as a kind of mark there, I stopped counting how many animas, like how many different animas I've watched at the 150 mark. So after that, I was like, okay, it doesn't matter anymore. Let's just keep watching and it's all good. So I can definitely say that I have clearly over 10,000 hours that's the expert amount, I guess. And so it's all nice. Yeah. So what is this session? It's maybe a bit of a special or order session in KubeCon for sure. But we are in the 101 track. So this will be kind of basics of communities. We'll be portion of the session taking you through what's those kind of things. And then it's also relaxed, fun take on things. So it's not, this is not a very super serious session, not at all to be honest. So that's the kind of expectation management here. And as a maybe a mini morning, there's gonna be gifs. So there's gonna be a lot of flashing maybe sometimes, but none of it will be full screen. So no worries at all. It will be hopefully tasteful. Yeah. Then the agenda for today introduction going on strong right now, really nice. And then we're gonna move to battle illustrated anime fans guide to Kubernetes. And the spirit of the hippies, very well illustrated guide to Kubernetes essentially. And then we are moving to Kubernetes components in anime fashion. And then we have 10 lessons learned from anime with one bonus lesson in the end as well. So that's the agenda for today. And now done with introduction. We're doing well perfectly. And then we're gonna move to battle illustrated anime fans guide to Kubernetes. So if you are a aspiring anime hero, the main character and so forth, you are all alone in the world or maybe not alone. You're surrounded, but alone.  You probably need a lot of learning. You need a lot of leveling up. You're just getting started. It's a scary world around you.  There might be a lot of people in the anime world who are like this. For example, Naruto started off as a very misunderstood character in his own place. There was a lot of things around him, but definitely he did not feel at home or at ease at his own place. There are other examples. For example, Sena from Eye Shield 21, bullied in his own school, trying to find his place in the world and kind of surrounded by a lot of things, but not truly at ease either. There are other examples, obviously, as well. There's Shinzi from Neon Genesis Evangelion, as well or plenty of others who might have had big turbulences in their life. They are going through a lot of different things, a lot of things surrounding them, but they still don't feel quite where they should be. So, what does this all? What does this story mean in the Kubernetes context then? If you're wondering, well, this is actually quite close to how, for example, an application would feel like if it was not in a container. So, it would be in an environment. It would be feeling a bit kind of surrounded by a lot of things, attract and so forth, and it would need a place to call its own. For example, it would be a PHP app that might include web server, readable, file system, PHP engine itself, so it has an environment and so forth, but it's not at ease in its own environment, such as the main characters here are as well. So, how do we fix this? How do we get to the next place?  So, really, these are a chance of a lifetime, really great things that will improve your standing a lot. So, this is what a container would be for you if you would be in the Kubernetes world and not in the animal world itself. So, container provides an isolated context where the app and together with this environment can actually run in peace. And isolated containers often need to be, though, managed and connected to the outside world, so there's a bunch of challenges come in from there, so it is not yet the perfect location yet for our main character or our application. So, then, we got to find something else. We have got to connect to a bigger world, connect to other things, connect to a team and so forth. So, as you're eventually practicing your skills, you're moving forward, you're learning more different shinobi skills, you're learning about paleo-thingy mecha, you are going forward in the catching footballs, getting stronger, faster and so forth.  So, it is, Kubernetes is then a project led by CNCF, KubeCon, very much, probably a lot of you have, all of you have heard about Kubernetes by this point of the week for sure. So, it is a way to focus on building a robust platform for running thousands of containers in production. So, it is the next step in your journey and this is the new home that you will start to build for yourself while you are in your main character, anime hero journey. Then, next up, you learn more skills and you need to name them, so obviously you're gonna start having a skill, then you call it out, you might yell bankai or any of one of these things to kind of label things for sure as well. Another part of it would be that in your anime journey, you would also find a role within that team that you have found for yourself, so such as Sakura here, and part of team Kakahashi would have become, starting to become a medic, find their own role and give a label to it and so forth. So, this is obviously in the Kubernetes world, it's labels. So, Kubernetes uses labels as name tags to identify things and it can carry these based on these labels and they are labels are open-ended and you can use them to identify roles and stability and a lot of important attributes as well. So, as in anime world, with the naming of Mooms, Mooms naming of different team characters to have a role in Kubernetes, labels are very important as well.  And in a Kubernetes world, pot represents the runnable unit of work that you usually have. It usually has a single container inside of pot but there are cases where you might have more inside the same pot as well. So, pots are the smallest deployable units in computing and you can create and manage in Kubernetes. So, as is this little Shinobi unit here, it is a small unit that can be deployed out there, go for it, conquer the world. But there are other things obviously as well but before we get to that, we can go and discuss about, okay, so what kind of moves will you learn? What kind of moves are important for a Shinobi to learn and while they are learning about, well, obviously cloning techniques. You need to start cloning yourself very effectively to learn how to battle all of the important villains and foes that you need to take on, which is then obviously in the Kubernetes world, let replica sets. So, replica sets provide clone, you can clone yourself and you can demand any number of times on demand, which is essentially what Naruto does as well. Very interesting in my opinion. So, replica sets provide logic for scaling the pot up and down and it can be used for rolling deploys as well. And its purpose is to maintain a stable set of replica pots running at any given time. And as such, it's often used to guarantee the availability of a specified number of identical pots, as you can see in the image Naruto is doing as well. So, all throughout this journey you have now learned a lot. You have some skills, you know how to clone yourself. It's looking quite nice. You have your small team. It's all working really well. Well, what about the bigger picture? You need to connect to a lot of other things as well. So, then you need services, which would be the grander village, other teams around you. You really need to kind of, you know, identify yourself and to be able to identify other teams in your vicinity so that you can switch and information and know more about it. Which then in the Kubernetes world would be services. So, which services you can discover others and they can discover you. So, it really goes to the Kubernetes network model. So, every pod gets its own IP address as well. And this means that you do not need to explicitly create links between pods and you almost never need to deal with mapping container ports to host ports as well. So, you become part of the bigger world. So, you have now, you have a team. You're working with a team. You're connected to the bigger world as well. You know, cloning skills. It's all looking very fine for you. Then, what do you do when you start to have a lot of different things? You're getting more gear. You're getting more information. Then, you need storage. And therefore, you need volumes to store everything that you have. So, all the gear that you get, all of the other things that you encounter along your journey. Because when you become a hero, you obviously get a lot more weapons, skills, and so forth, as you can see here. So, in the Kubernetes world, this would be volume. So, containers can access and store information, application and the volume. And from the application perspective, the volume appears as part of the local file system. And volumes can be packed by a lot of different storage backends as well.  You have your skills. You have your team. You have your grander picture. Then, you will need to maybe, things start to be a bit hectic. You feel a bit lost again. Even though that you have all of these great things around you, then you obviously need namespaces to have a bit more privacy and peace in your find. You maybe start meditating. You maybe start figuring out, okay, what's my place in the world? And so forth, to continue a dialy battle and even more effectively. So, namespaces in communities function as a grouping mechanism inside communities and replicas its volumes and everything can be easily calibrated together with the namespace. So, when you have a lot of different egos in an anime team that would be clashing towards you, such as Naruto and Sasuke, for example, would be with these kind of mechanisms, you can help this and not be battling internally constantly. For example, in the animal world and in the communities world, obviously, namespaces help with that as well. So, after all of this, now your badly illustrated anime guidance guide to communities is over and you are ready to rock and roll and become the Shinobi that you have always meant to be, as you can see here as well. Yeah, then, now that we're done with the badly illustrated anime fans guide to communities, we can move to communities components, quick guide to them. So, here is a architecture image here and as you can see here, the communities cluster consists of set of worker machines called nodes and they have contrainerized applications inside of them and then you have the worker nodes that host the pots that are the components of the application workload. So, now the control plane is a lot leaner and not as bulky in a way, but then at the same time, the nodes to the most of the work but the control plane is the one that controls all of the others. So, then in the animal world, it would look something like this. You have Kakahashi controlling the team, telling the little nodes, aka Naruto Sasuke and Sakura, telling them what to do and what to do in the next step as well. So, this is one example of how this would look like in the world and there's a bonus there as well. There's a Hokka key in there in the cloud API provider point because then it's giving even higher level of instructions from there. So, this is one part of it, but if you put it into another part, we would get death notes and we have the mastermind, L, controlling all the different Japanese task force members and I think this example is particularly fitting because L itself is a very much mastermind behind everything, telling all the others to do a lot of the kind of more bulky, heavy listing for sure. Now, this analogy doesn't maybe work for all cases because I think for the straw hats, you can technically say that Luffy is in control because he is the captain, but is he really? Most of the time, probably not. So, it doesn't always hold up, that's for sure. Yeah, but those are the communities components in Anywhere World handled briefly there. So, then we get to 10 lessons learned from Anime. Lesson number one, importance of a team. So, as always, from one piece to Naruto, we've talked about the team a lot here today. There is from Naruto to one piece to the engine is Evangelion. There's always a really overarching team, the team that makes what makes you succeed and it's what will kind of get you to the next level, particularly one piece, for example, the sum of the people alone is not as strong as them together, working towards a common goal. And as a really important lesson there, everyone has a role to play within the team and it's really good that everyone has a specified role as well. And the same really apply to Kubernetes and tech world in general, if you're in an engineering team, for example, it makes sense to have your own role, but also everyone should be playing together really nicely and complimenting each other and working together to build really great applications and infrastructure. So, what's the next level from this basic team? Obviously, if you can, you could combine yourself into a one major thing that you're kind of really becoming together and taking it to the next level, becoming essentially one big mecha where you're combining everything together. Now, what would be the communities world or technology world equivalent of this? Well, it would likely be this. So, if you have this long list of things that recorders need from you, this would definitely be something that would be the combining mecha of the communities and tech world for sure. Hard to find if it was, if someone had all of these skills as a full stack developer, pretty much a unicorn for sure. Yeah. Then, next up, we have, there's always going to be characters and people around you with mysterious characters with dark past. And Sasuke here is a great example of that. He's a bit emo, maybe a bit mysterious, maybe mopes in a corner a bit, never smiled, a bit cold hearted and doesn't really say that much, but has a lot to leverage from his past as well because all of those hardship has taught them a lot and now they can kind of leverage that, but they are a bit moody and they are kind of a bit their own thing. There's probably a lot of different people in development teams with this kind of nature or depends on personalities as well, but I think one great example of people with a lot of dark mysterious past and a lot to give at the same time would be, for example, mainframe coders. They probably are back there in the room telling stories, but yeah, it's a great position to be in it. Yeah. So then, lesson three, self-development. So with any anime fights, you always have, well, even a fight or multiple fights, if you're trying to beat a big villain, you'll end up, inevitably, you need to get new skills, you need to scale up, you need to get a lot of new skills fast. Essentially, you need to go quite often to literal or metaphorical cave and just level up as fast as you can and come out of there and get moving. And really, these kind of things are really great and lead to a lot of great triumphant moments in anime, for example, but I think also there's a lot of great examples in Bleach or in Dragon Ball and so forth. And this obviously applies really well to tech careers in general and Kubernetes world as well. So, what would be the Kubernetes or technology world equivalent of going to a cave and really skilling yourself up and coming out?  Another thing would be, for example, if you get a Lean Foundation or ZNCF Foundation certification, so then you're again going somewhere, training yourself and emerging as a new person with new skills, and particularly in anime world, usually when you come out of that cave, you come out with fancy new weapons, badges, outfits. So, what would be better than having a certification badge in your LinkedIn profile, for example? It's essentially the same thing as Bunkai or any of these fancy acts, yeah. Then, next up we have, you need to take time to relax. And this image here is a bit too giving it away because there's the very infamous beach episode, always that comes up at some point. So, it's, I think, a great lesson to learn to take time for yourself, have holiday, have breaks, because it's the world conquering anime heroes of unparalleled scale and skills. They need to take a time off, go to the beach, play some volleyball, do some errands. Then you definitely need to as well. So, it's always good to remember. And I think another great comparison here would be a feature freeze. So, you have to pay back technical debt and then you can't advance the plot line, aka develop new features during that time. So, it's all connected there. Then, after you have taken that vacation, you're taking the holiday, you're ready to get back to work, either as an anime hero or as a developer, then you always need to remember to be prepared to get ready to take action and obviously monitor your surrounding as well, which then might lead you to jumping out of your school window to take action immediately when the monsters get near your high school or in the other area that you have. And obviously, in the tech world, this would particularly be on the importance of monitoring as well as having visibility into your cluster, for example. And most importantly, in the terms of this image, is reacting to that action as well.  Then, next up, we have the importance of decimation. This is a bit connected to the labels part as well in the anime world because I think what would be better documentation? You know, what's the priorities for documentation? You need to tell your team members what you're doing and you need to provide a historical context of what you're doing. Well, what would be better than yelling every single move that you do out loud? Everyone knows exactly what you're doing. There's no questions about what's happening and why. It's maybe a bit of a weird thing that the villains don't realize this, but luckily there's no villains in the engineering team rooms and so forth. So, yelling your moves out loud is only beneficial for everyone. So, importance of documentation is really highlighted in anime world for sure. And I think in the development world and the communities world, we are no stranger to enduring in long fights and neither is any Dragon Ball Z character either. So, you really need to brace yourself for longer fights and have the marathon endurance to really continue working together as well as fighting all of the villains or creating your clusters and so forth. And actually, I think interestingly, replica sets really apply here as well because you might need to have new people coming into the fights as well occasionally. So, you need to switch people between fights as well if they are very long. Yeah, and after you have now, you have everything working really nicely and you have attended the KubeCon and you're like, okay, there's a lot of things that I can take home and then you start piling up more and more and more different CNCF projects into your environment then you might accidentally become the monster that you despise if you end up having way too much complexity. It becomes hard to manage. You become overcome with everything, for example, if you end up with multiple service meshes running and it all becomes just a tad bit too much as far as confusion and complexity goes. So, all of the times when a lot of characters were sure from Dragon Ball Z to Bleach to Naruto have been taken over by their dark side, this is something that we should divide. There's obviously, luckily, you can add more complexity by adding more projects that help you with that size, such as Mechery and so forth, yeah. Then, next up we have the fundamental, I think, principle of cloud native as well as fundamental principle of communities that's very well-present in classical animas as well, which is ridiculous power scaling because you have these scenes where it's over 9,000, it's getting crazy, so for sure, I think we've all had our moments of these when we are thinking about our infinite scaling and all of the tropes that come with that, yeah. Then, we have one lesson left and one bonus lesson left and the next one is, I think, very important at least to me personally, which is always have a snack at hand. I get very hangry and I think all the anime characters are very hangry as well or very, very weak if they don't eat, so remember to eat, remember to keep your energy up, drink water and so forth and I think this is another great lesson that one can take away from the anime world as well, to life as well as to development and Kubernetes and all of that both. But there's one bonus lesson left, which is the most important one out of them all, which I think is a very much an overarching theme across all of these anime series, which is believe in yourself, so if you can do it, go ahead, brace yourself, get stronger, get faster and really kind of live up to your potential and expectations.  But if you yell out a bit too hard, your hair gets frayed, it's all going a bit badly after that, no worries because you will just end up being the most powerful person in the whole universe, so it's all right even if it goes a bit too far. You might go bald, but that's all right, that's the sign of your true power and your conquering of the world of power, for sure. Yeah, thank you everyone, this was the session. If you have any questions, just handle it, I'm gonna pass Michael yours. Any questions? I think it's great. Yeah, yeah, yeah, it's all completely clear. Okay, thanks for attending. Oh yeah. What's your favorite anime then? That's the most difficult question, for sure. Well, for me, I started with Dragon Ball and Dragon Ball Z, so that's kind of like super close to my heart, but then I think I really like Bleach when going further, but from other genders, I really like Nana and other things as well, but I think one of my favorites is Darker Than Black as well, which is a bit less well known, but there's a lot, there's too many. One piece is a classic as well. Yeah. All right, thanks for attending and have a good rest of the day. Thank you, Annie. Thank you.


The virtualization app plays as virtualization really has forced these conversations in the data center that weren't happening before, right?  But now with virtualization, they're forced to not only talk to each other, like I need a virtual machine and I don't know where it's running and can you please tell me what's going on. But they're also forced to talk to their neighbors, the people who are sharing those resources with them. And this is the reason why there is so much demand for an app for virtualization is because the data that will help you get visibility into what's happening with my virtual machine, who's taking all the resources on the server is really hard to get at and Splunk can get at that data and visualize it in a way that's not been possible before. So Matt, tell us a little bit about your role at Discovery and what you're doing and then maybe kind of let's explore the challenges that we were facing around what Lena's been talking about around big data in your infrastructure. So I'm in the Global Operations Center at Discovery. So my primary role is operations and what we're using Splunk for is primarily operations but also we're using it for a lot of compliance data. And we've been doing that for some time and we found Splunk very effective in that role. So we've heard some stories about how Splunk customers kind of started off downloading the free application kind of expanding from there. How did you kind of come to work with Splunk?  Well, you know, the neat thing about Splunk is it's really a game changer in technology.  And you know, there are some other smaller solutions but Splunk, the engine itself is really where the power comes in and the ability just to feed it that text data and get at it any way that you want to is what really makes it powerful. And then, you know, since they've expanded it and started building these apps on top of it, that just makes it even more so useful for us. Very cool. Good, that's good. What kind of compliance data, again, is from the layman sitting outside, I'm thinking Shark Week, I'm thinking Dirty Jobs, I'm thinking all kinds of fun stuff. What kind of compliance stuff do you have to be concerned about and why do you need something to really keep on top of that? Right, so, you know, we adhere to ITIL standards and we've got a lot of SOX compliance data, a lot of it's security data and things like that where we've got to make sure, you know, people aren't accessing machines that shouldn't be, people have certain roles there and, you know, they can't get into certain systems and that all just needs to be tracked and accounted for and Splunk makes it really easy to grab that data in there from all of our disparate systems around, generate custom reports and push it up to the top where everybody's looking for. And was there any, is it just a better tool to do something you haven't been able to do before or have you had any kind of aha moments where, you know, you've really seen something that you weren't expecting or to get down another path or, you know, kind of demonstrated the other value in that data that maybe nobody knew was there before? Well, you know, it is another app but it's the best app for what its purpose is in addition to that. I mean, we have definitely had a lot of aha moments in terms of what I'm doing with it and in terms of operations. I do a lot of automation and Splunk is perfect for that because I can not only pull the data in, I can report on it, it's got all the amazing dashboards but in addition to that, I can complete the workflow and I can have it automatically create tickets in our ticketing system and really bring our entire IT group together in terms of being able to facilitate the beginning to end process with Splunk. Can you contrast that to what you were doing previously? I mean, was that a very manual process? Or were you just not able to do a lot of it at all? Yeah, a lot of custom programming. I mean, certainly a lot of it I wasn't able to do and, you know, we were struggling to do with various systems and doing things manually and stuff like that. So, you know, that's why I say Splunk was certainly a game changer and the fact that we're able to go in there and just, you know, do it completely differently now in a better way. Cool. So, you know, we're here at the show and there's one of the themes really is around the community here and kind of customers learning from customers. So just would love to get your impressions of the community that's being built up around Splunk. I mean, in the big data world overall, we're seeing community play a very important role whether it's the Hadoop community or other big data technologies but certainly here at Splunk, they're very focused on kind of building up a community and helping, allowing customers to help each other. So what are your thoughts on that and what is your take? You mentioned kind of the vibe here but as you've come to interact with some of your fellow Splunk users, what kind of information have you learned and what role does the community play and how are you going to be using Splunk? Well, you know, they have a Splunk community on their website, obviously. And I've just noticed in general, I mean, the people here, they're really helpful. Everybody is here to basically share their experiences with Splunk and give people other ideas of what they're doing and how they're doing things a little bit differently. And the neat thing about Splunk being as generalized as it is, is that everybody kind of can do things in a different way with it. And so coming together like this allows us to share that. And I've noticed that, you know, there's a lot of really neat things that people are doing and there's a lot of things that we can learn from sharing with other people here.  You've got road maps. You've got new features and functionality that you want to roll out. But at the same time, you've got this active community that's building apps and you want to encourage that. You know, how are you managing and how much is that community of kind of app development part of your process and part of your roadmap? So they're a very active part of our process and roadmap. In fact, later on today, we have sessions on, you know, tell us what you want to build and tell us what you want us to build. That's sort of dialogue with our customers. But even in the absence of that, if you just walk around the show floor over here, you'll see a number of partners who've already sort of taken matters into their own hands and say and have identified market needs. People need XYZ with Splunk. And they've gone ahead and developed those apps already and they're showcasing some of the apps here. It's been a fantastic eye-opener for us to see how much, how active our community has been, not just in terms of customers, but in terms of partners building their businesses on Splunk. And then does that kind of push your needle when you're prioritizing more towards kind of platform-y type of stuff for enablement versus more kind of solution feature functionality? Absolutely, absolutely. It does, it sort of helps us, you know, focus on the things that are really hairy and we can't expect partners to deliver and focus on making enabling technologies available for partners to take advantage of best practices, the right kind of APIs and SDKs, the right kind of hooks basically into Splunk. And a lot of these have been delivered already so and that's why you're seeing so many new solutions here at the Solutions Exchange. It's really been a consistent theme as we've had these interviews with people from Splunk that everybody likes going after these big hairy problems. So I think we may have your new title now. It may be the Queen of the Big Hairy Problem. Maybe not, I don't know, that might not work. I don't want to make that one. We wait every day, but it is great that you guys continue to focus on these really big challenges and the enthusiasm around attacking big challenges seems to keep everybody pretty excited and then we've got folks that are using it and doing stuff they couldn't do before and or extending the application for these very special purposes. Yeah, could we dig in a little bit more on the Splunk storm? So you've now deployed, make it available in the cloud basically, as I understand it, for developers who are building applications from scratch either on Amazon and Google's Compute Engine or other cloud environments. What kind of led you to that conclusion that you needed to really get out into that cloud environment? So what we identified pretty early on at least a year or more ago was that there is this big transformational shift going on in the industry with people moving to the cloud. And other than the hype associated with cloud, there are actually people who are using tremendous amounts of cloud services. They're just not in the formal, like purchasing processes that exist in most big organizations. These are typically development or engineering organizations that are part of bigger organizations or even much smaller organizations who are just looking at the cloud as a great way to go off and bring the applications to market, right? It's, they don't have to wait for infrastructure anymore. They don't have to wait for some guy and purchasing to approve their PO anymore. They can just go off, get the service, use as much as they want, pay for only what they've used and sort of deliver applications in a very agile fashion. And for these kind of people, to ask them to download a piece of software and install it and manage it and maintain it is a hard thing. They typically don't even have data centers. They run almost exclusively in the cloud. And so we wanted two things. One is we wanted to make the whole thing easy for them. We wanted to make it available as a service, meaning someone can just go log in, send their data, start using it without having to download, install, maintain software, scale it really easily. So when they want to index additional amounts of data, just move a slider and you get more capacity provision to you. And the third thing is that we wanted to make it, you know, fit in with their model of purchasing. So it is, Splunkstorm has a different pricing model. It is paid monthly. You subscribe to a plan and you pay on a monthly basis and that fits in really nicely with this notion of disposable infrastructure that a lot of our Splunkstorm customers have. And do you anticipate Splunkstorm customers at some point, you know, maybe as they start their projects in the cloud but bring those back in the house at some point and how will Splunk help support them in that transition? We absolutely anticipate that a lot of these smaller companies will grow to be bigger companies. A lot of the smaller projects will grow to be bigger projects because if anything, the cloud is meant for scale and people are going to do this, you know, large scale stuff in the cloud. We're also noticing that once you get to a particular scale in the cloud, then it becomes more cost effective for people to just bring it in house. And the idea behind Splunkstorm is if you're in the cloud, you can get the facility of Splunk, the flexibility, the fabulous search language available to you in the cloud. If you want to bring it in house, Splunk Enterprise is there to support you as well. Yeah. What's your deployment, Matt? We've got our own physical deployment. Physical deployment. Yeah. We've got a lot of systems around the globe and pretty much every region. And so we just found that that works out best for us to have the servers at our facilities. So looking ahead, you know, obviously Splunk is growing, they're working on new apps all the time. What is kind of on your roadmap and maybe all companies have to grow and keep expanding. What would you like to see Splunk maybe expand into different areas or their particular use cases you're interested in? What's kind of on your roadmap, your challenges that you're hoping to tackle with Splunk's help?  And so that's where I'm hoping that they have the majority of the growth. Apps like the VMware app are extremely helpful for us and allowing us to get to that data that we really have a hard time getting to. And so the more that Splunk rules out apps like that, the more useful Splunk will be to us. But you know, we're also developing a lot of custom apps and things like that as well because we've got our own applications that we need to facilitate. So, you know, we're going to continue to go down the operations road and see, you know, how far we can get as far as like getting all the data in there and being able to automate as much as possible. Okay, great. All right guys, well I think we're just about out of time. Thank you so much for joining us in theCUBE. We really appreciate it. Love getting the insights of a practitioner and Lina as well, release some really interesting insights about the product direction at Splunk. So thank you so much. Absolutely, and so you're watching theCUBE. This is SiliconANGLE's premier TV broadcast. We go to events like .com 2012 here in Las Vegas and bring you the top tech trends and execs and customers to share their knowledge with you. So we will be right back with some more guests. We've got a full day of coverage ahead, so please stay with us.


Hi there! I'm happy that by the end of this story, I could proudly and confidently be myself. Nose, tail, scales and all! Thanks for reading with us!


Yeah, I think so. Superb. I was like, I got teeth back here. You're ready? Okay. You're done already? You're ready? Oh! I just copied Nate. No! I couldn't have done it. I couldn't have done it. Alright guys. Alright. Morning. Let's take a distance. Yeah. Come. How you doing? How you doing? How you doing? Good morning guys. See you again. Good morning. See you again. Good morning. See you again.