.Net Foundation .Net Community Standups, 15 Oct 2019

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: ASP.NET Community Standup - Oct. 15th, 2019 - .NET Community Standup Site with James Montemagno

Description

Join members from the ASP.NET teams for our community standup covering great community contributions for ASP.NET, ASP.NET Core, and more.

Community Links: https://www.theurlist.com/aspnet-standup-2019-10-15

A

Because you say: hey how you doing I'm.

B

Good, how are you very.

A

Good, so this is like this cosmic unification thing: we got going on cuz you've been doing these stand-ups on Thursdays I've been doing these on Tuesdays, and now it's like crossover. It's like some sort of if I knew the whole comic series thing better. This would be like DC Marvel or something right that it.

B

Is a crossover event? That's right! That's what it is. Certainly.

A

As yeah very cool yeah, so this is fun, because this is we're getting a little meta. This week, we're gonna talk about how we built the new asp net. Sorry dot net community stand up page together, which was pretty neat so.

B

Yeah I mean I'm psyched to be here, I mean I, usually do so. If you are new to the community Santos, we stream on Tuesdays and Thursdays and John and I have worked together for a long long time. Obviously, at Microsoft, but we've been collaborating on the.net community stand up we're almost out, like our one-year mark like in January. We switched from just the asp.net one on Thursday to Tuesday and Thursday, so we have xamarin, we have Windows desktop, we have languages and runtime we have Visual Studio.

B

So we have all the different teams on the.net team there's more teams, but we always want to bring more people on so all the different sort of workloads which are super fun. And now we stream on Tuesdays and Thursdays, go through great Community Links community contributions and, of course, show off new features and of course you and Damien I mean I. Don't know we'll talk about it when we get to it, but have this beautiful website and I said we need a beautiful website.

B

So, let's make this happen than we did so I don't want to jump the gun, though John. So you know we.

A

Should let's, let's start with these community links, cuz I got 14 and 15 community links beautiful.

B

All right, well I'm, gonna, swap over to your team's ready. Here we go whoosh all.

A

Right quite exciting there just a sec- oh here, I'm, okay, here we go so. First of all, we have the dotnet Kampf local events going on. So these go through there's a it goes through end of October there's a few running over into early November. So if you've got a local event near you, they're all around the world definitely recommend going to them. I got some really cool pictures from an event in Lagos Nigeria this this past weekend, so just really exciting to see them.

A

We also have these event in a box content here, so this is over in github, and this includes slides from the event, and it also includes the keynote demo code so for people that are running their own local events. They can, you know they can watch the videos, they can grab the slides and they can actually do the the demos that were done during dotnet calm. So.

B

Cool I forgot that we I was working with Glenn on this I totally forgot that we actually did publish the code so now, I know where it actually lives and I didn't know, because we were working out of like Glenn's github account in general. So and that thing has like the musci ml net, the blazer, the the worker service, the IOT projects LinkedIn and the xamarin app is linked in there, like all the things are in there. All.

A

Their desktop, which.

B

Is super lean? You can run it all locally. Yep cool.

A

Yeah, so you could watch along during the keynote and you could actually with this code. You could, you know, be running through it yourself, so we've been making a big effort to do this over the past few years. There's this dotnet presentations repo or it's an at work. Actually it's got several repos, so you'll see here, here's all the dotnet Kampf content.

A

We updated the slides like the day of dotnet Kampf as the presenter, because you know people are tweaking their slides right until the last minute so right when they walked off the stage we you know like, would not let Lee they couldn't leave the room until they gave us their size that we got all their slides. We also, this is cool.

A

We've had updates for the different workshops, so Blaser updated with dotnet core three, all the new blazer bits and then asp net core app workshop, Scott hunter and Kevin pilch we're presenting this at DC Sydney, and so this is updated through dotnet s, peanut core 3 as well. Oh nice.

B

A

So so you know if you're learning the new stuff, this is a great place to go and.

B

I'll also be there's a put a bunch of xamarin presentations on there too, and I'll be adding as a mer and workshop pretty soon so I have it all finished, I'm presenting it at ignite, so I'm cleaning up a lot of stuff, so it'll be all up there, which is super duper nice, so very cool, very cool. All the tips yeah.

A

What we try you mentioned before, how, like you know when you were working with Glenn and there was different repos spread all over the place and the different presenters all had their own things, and then the next presenter would need to do it and they'd fork the repo, and it was really hard to say. Where is the latest thing of this? You know like? Oh, do I go look at David Fowler's or do it. You know where do I find this stuff, and so that was the idea here.

A

We have one standard common place where we throw up all the presentations nice.

B

A

And it's it's all. You know standard open source licenses, so you can grab it and then change it around. If you see a slide you'd like and you want to use that one slide or you want to use a workshop, but change it around for your own needs. That's kind of the idea, so alright enough with the advertisements on to the next. So this is a cool thing. I saw float across. This is from the instant ASP folks. This is an open source, so T a user community and support platform.

A

So if you think it's got aspects of a lot of different things, it's got discussion. It's got Doc's, it's got articles, questions like a Stack, Overflow kind of article or a question-and-answer sort of thing. So, if you're running you know, this would be great for a product site that, where you want to you know, have general support. They have a live running demo here. So this is all open source you can go in and you know grab the grab this and and be up and running pretty quick.

A

They have different modules available, so you know just pretty slick and then it's from an instant ASP and they offer a hosted version as well. So if you want to yeah so if you want to run with managed hosting it's available, if you just want to grab the open source project, grab it and go to work so I I thought this was a really cool project.

A

Take a look all right, so we are now into the API and API and management, and that kind of section of my links so first from from Jason he's, got a section on a simple API for auth registration and user management, and so this is pretty cool. This is using api's and now that there's pretty good support for for things like jot tokens and different things for authentication this. This whole API system allows for pretty good, like user administration. So he's he's had some different versions of this in the past.

A

This is updated for asp net core 3. So this whole tutorial walks you through building testing with tools like postman, creating users, authenticating and then now you that you've got this. You know with support for authentication, there's support for different front ends, so you've got angular, react and view.

A

So you know just a nice in-depth tutorial all the source code available. So really really like to see this kind of in-depth. You know walkthrough and all the you know it's a kind of complete solution there, all right. So speaking of you, know kind of getting some nice things wrapped up. Vincent has this API boilerplate.

A

So this is a project. Template for building is peanut core api's with.net core 3, so here's a walkthrough on code project and explaining you know what's there, so this is kind of a lot of things all wrapped together, including dotnet core 3 asp net core. It's also got pre-configured dapper autumn after an auto wrapper and then some also swashbuckle, fluent validation and sarah log, as well as some kind of prescriptive architecture. So support for things like there are there's a standard. You know folder for for services for helpers.

A

You know different kind of organizations, everything's kind of in its place. So if you want something, that's kind of already configured for you already kind of got some some opinions and you know kind of like, for instance, here's your domains folder, you know and here's your DTO folder helpers folder. So if you don't want to think- and you kind of want to start with something with already some opinions and and you don't want to spend your day same, where do I want to put my dt o--'s and stuff?

A

This looks like a pretty pretty nice set up that.

B

Is if you want, like all of the things right, like I, think yeah when I, when I did the new asp.net core templates, they're kind of nice, because they're just very minimal kind of similar like blank app and they do a few things like here's, a very simple Web API? But if you need all of the things you're like. Oh, these are the things that I use.

B

It would be I, guess kind of nice to be like okay, here's all of it kind of configured and maybe I use some of it. Maybe I don't, but at least I could take a look at some interesting architecture. I guess yeah.

A

And you know I kind of go back and forth on that sometimes I like something that sometimes I like when I'm. First doing something I like to start with a prescriptive approach, so I want to have a lot of stuff pre-configured for me and then once I get used to it, then I form my own opinions and then I want to start with the hey I want to build up from scratch. You know so I I think that this there's there's different cases for both I agree with you on that.

A

Here's also, though so, there's the repo and then they've also got a nice extension to bring in the project template. So you know a nice kind of all, packaged together, pretty well.

A

Okay, mariko writing here on automated UI tests with selenium what I was my take away from this is this was significantly simpler than when I've looked at selenium in the past. I feel like the cases where I need selenium, are a lot rarer. Now that there's kind of support for things like the the way that you can test you know, so my words are not working well today. I hope you can understand what I'm trying to say, but the the the way that uh so.

B

You want to test the UI okay, so so we want to test the user interface of our asp.net core MVC application, yep.

A

Sorry I'm also looking at chat before I.

B

Got the job? Don't worry, I got ya. Okay,.

A

Okay, people are saying, audio seems garbled, so I don't know. If I'm you.

B

Do sound a little bit muddied I will say that or I guess: I should go to the YouTube one too. huh All right.

A

Sorry so I'm on a different mic today and I can switch mics if needed. That is not difficult. I.

B

Need to show John the the good good of better microphones yep you need to have like you know when I stream is like. This is a ridiculous microphone like in my face. That's the go-to, so.

A

I do have the good microphone, but it's I'm on a different monitor and so I'm swiveling, my head and I'm, not talking directly into the monitor, which is confusing so I. Let me switch my Mike's just for this part at least standby. There.

B

You go we're waiting standing by and then we'll come over here and I'll. Do this and I'll be like? Oh, oh, there.

A

Should be like some elevator hold, we.

B

A

To have that this.

B

Little dancing.

A

Switching over here, wonderful, wonderful, okay! So now.

B

We're back to classic John. Here we go I'm ready. This is.

A

A classic yes, okay, so you're testing your UI and asp net, or has added in a lot of stuff where you can do your testing and it basically like runs the site. It makes it a lot easier to interact with, but if you actually want to do the browser-based interaction you want to test out, you know like interacting exactly as the browser sees it, maybe a test with whatever front-end, rendering or UI stuff right. That's where selenium fits in.

A

So nice walk through here on how this is configured going through just putting pulling in two packages. It's nice here on this post, too I think is first, we walk through and we say here: let's click a bunch of stuff: let's send some keys, you know, let's interact with the page, and what Marine Cup points out here is that this kind of quickly gets pretty verbose. You're.

B

A

Doing a lot of very like type: this, do this click this in every single test, and so there's an abstraction here where so actually pulling things back. So here we've got this. It's doing all this stuff now here making it better, and this is abstract Intuit, and so this is the point where we're actually saying here's how to fill in an account number: here's how to fill in the age, and so now that that's abstracted to that level. Your actual tests can just focus on set.

A

This value set this value so I like I, like that kind of refactoring, to simplify the actual tests, got.

B

It ya know so we do this. This is we call this page driven testing like UI testing and the can you zoom in on your page, just a little bit to just like so yeah. We called this a page driven testing, no Expedia like xamarin UI test to do mobile app testing is very similar right, it's very like here's a page, and then this has all the commands that you would invoke on the page because often you're, just navigating through your website.

B

So instead of every page having a bunch of stuff, you might spin up the same exact page and then navigate through. So you can bypass a bunch of stuff and automate it in a good way like have a single navigate through. So you know to automate the same commands over and over and over again, you just abstract it into one little little area very.

A

Cool yep yeah, it's nice, how some of those patterns work across you know it's all c-sharp right, and so it's nice to be able to kind of a you know. Take a pattern like that and see that work on you know, whatever your kind of and platform is: oh right, pardon the interruption. What are you doing.

B

Here: okay, lassic medium, am I right yeah.

A

So this is a nice post from Renato we're we're working to feature non-english posts as well every week. So so this is another nice one. Renato was on last week as well. I do not speak very good Portuguese, so I'm gonna translate it.

A

You do yeah. So this is monitoring resources and what's really cool here is looking a bunch of stuff together. So we've got asp net core 300 health checks, so the health check support. That was something we used in the dotnet stand-up site, really nice to be able to kind of configure health checks and say this is this is what these are. My criteria for saying the site is healthy. You know whether or not a page is reachable or back-end. Api is reachable that kind of stuff.

A

So what Renato did here is tie everything together to say: okay, great I'm, gonna, take the output of a health check and I'm going to use logic apps to send that information to me over slack. So if my app becomes unhealthy, I'm gonna get a slack message telling me my site is unhealthy, which I think is really neat. So here's the walkthrough, you know we're going through we're looking at defining the health checks. Of course, there are different front ends available to help you view them so here viewing that one I forget the name.

A

It starts with an X, it's like zib leo or something like that. So here's, the actual health check definition of that the health check you can get your monitoring results from that in JSON format, so we're consuming that from a logic, app logic, apps are nice. For so there's there's functions, apps and logic. Apps functions apps, you know more kind of. If you want to do something code focused, you can do that with logic, but logic. Apps are great for something where you're just like plug some things together.

A

Right, I just want the output of an API, I wanna, verify specific result. Then I want to pipe it somewhere, depending on what happens so here this is going through. This is saying you know when H HTTP request is received. We're gonna map the URL, so you know clicking through here. You know setting up the monitoring the output, the output of that and then now, depending on, if I get a failed result hook it up sending the slack on post lots of screenshots, but there we go.

A

We also have a worker service going through and monitoring as well and scrolling down, because the actual ending result is there. We go there's our slack message so just really neat to see and I think this kind of points out some of the power of health checks that you really can use health checks to to monitor to you know alert you to that.

A

You can also use them in your application to degrade and maybe go back to using cache data or whatever it is right, so good stuff, so many good posts this week, ok, Steve Gordon again with the health checks. So here this is looking at two different options for health checks, with asp net core 3 and G RPC so option. One is using that asp net core health check middleware infrastructure. We are just talking about in the previous post, so this is where you define a health check.

A

You say you write your own, you know standard c-sharp code and you just say: here's here's, how I'm going to verify! That's that something's working right. So then, here you also have an option to do: G, RPC health checking using G RPC health check. This is something I was not aware of it until Steve wrote about it. So this is pretty neat, so you can actually write up. You can use the health check protocol and you you create a check request.

A

So then here is, you know, he's explaining that J RPC health checks and nice that there's any and you get package you can pull in for that. So and you know, then you know registering it and and doing all the kind of stuff. So this is using the G RPC specific health check implementation and using that protocol, and then you can call into that from a client and then the the kind of wrap up here talking about you know.

A

First option was using the asp net core health check, middleware and then second second option using the specific gr, PC health check-up, so good stuff, as always from Steve yeah,.

B

Very cool but I did we do have a question in the chat about GRE, PC and I'm, not a gr, PC expert, my needed Clint calling the Glenn.

B

However, I, think that I did find on github the answer to the question, so you can correct me if I'm wrong, so gr PC, which is sort of like binary structured data compared to like JSON HTTP requests that come back similar to like an evolution of a dub CF in a way, but very binary data, super small streamlined data and in here so good for different instances, because I was streaming data too, but the one question I had it was about. How can you host it? Can you host it in I?

B

Yes, or does it have to be on? You know, down eight core three service, so I look this up by the way and you're just totally looking it up, and someone said it's because GRP C requires HTTP to implementation of HTTP system support for like the trailing headers and stuff. So that's why it can't be in I, guess, IAS or an app service and I. Guess that's what they were there. You can also set an aks I guess, yeah.

A

Yeah so yeah exactly there's very specific requirements. Like you said, HTTP 2 is one of them. Another thing with G RPC is it's. It comes from I think it was original Google, our pcs, the name of it it's open source, but it runs on a lot of other, like it's supported in a lot of other ecosystems. It's it's, you know started outside of the dotnet world and it's been kind of brought in here. So that's also something where it's like.

A

If you want to work with another back-end or front end on another platform, that's also a nice kind of area where GA RPC works. The reason I came over here is there's pretty good docs in the docs site on you know all the G RPC services stuff. So these are all you know very, very new and current. That was also part of the the walkthrough that we were showing in the first way back with a dotnet comp right. That was part. That was a big part of the.net, confident as well and.

B

I think someone was saying too, if you want to, if you need to deploy it into an app service as a requirement, you could throw it into a Linux container and then throw that into a now service. That way.

A

Yeah one interesting thing too is you'll, see as you're looking at these, that a RPC actually has this protobuf syntax, and so that is one place where it's like hey. What's this language and that's that's that proto file syntax, so it's kind of and and again that's part of the G RPC being not just in the dotnet ecosystem it but there's clients on you, know Java and C++, and you know every other, whatever supported language, and so that's that's a whole chair thing. Yeah.

B

It's a nice option if, like this is going to you know, fit your requirements. You know for your application, there's a lot of different backends that you can choose for for your your bet. Your applications right, maybe you know dub CF is good, for you still may be. Restful client is still good for you or maybe eg or PC. It's based on your app.

B

So it's based on your apps or requirements and what you can do and every sort of tech layer is, is different of what it can just support by the core requirements of what it is. I guess right. So yeah.

A

Yeah and and I think that that is an area where this is, and we had a post on this last week from Rick's draw it's kind of a fit more for like the services that are somewhat similar to like WCF right. So this is a this. Is a service infrastructure I, don't know, there's a lot more to it, but you know, as opposed to like as I see some of the api's there.

A

It's kind of a different overall architecture, all right going on. We still have more links and we've got the site to get to see.

B

What happens when you have me on I like to distract you I.

A

Know this is this is wonderful. This is good stuff. Okay, so I think his name's Michael I always have to scroll Matthew there. You are Matthew Jones, so nice, post from Matthew- and this is on the repository service pattern with DI and asp net court I like this post, because he walks through a kind of fun scenario. This is a movie theater where we have both ticket sales and sale. You know at candy sales and we want to wrap those up. So here is showing both repositories and services.

A

You've got repositories at the bottom layer for the different things and then services that are kind of performing things like aggregation and abstraction above those repositories, so that you know normally, when I read that I kind of start to get bored but the movie theater sample. It keeps me a little more interested sorry, so here we're looking at both. You know: food and tickets. Those are very simple. You know, we've got repositories and the service on top of those.

A

Don't really need to do much and then the this thing here average profit across both ticket and food items and displaying on every page of the app that's where it starts to get a little more complex. So here we go through builds out relatively simple models. We've got repositories on top of those, and in this case they're just you know, mock repositories he's just using a static list, but of course this is where you could be doing your database data store call and then you've got your service abstraction.

A

On top of that, so here we've got. You know these are you know very simple ones for food and ticket sales, where they're just basically a pass through, but for the call three, where you're doing some more complex aggregation. This is where your repository is is handling that so it's going and is talking to both tickets and food items, and then your controllers, you know just calling through on food and ticket sales, but the more complicated class where you're doing your financial staffs. That's calling through the service later so anyways.

A

Here we've got every page in sight here, we're looking at say ticket or food or whatever, but then you've also got your aggregate information across the top. So so there you go and here's a nice diagram kind of showing at the top, as he points out. There's cases where hey it is more code. It is more complexity, as he says and I agree that it's it's a trade off and a lot of real-world apps over time are going to get complicated enough where you're gonna need that kind of level of abstraction.

A

So nice walk through there. You go yeah.

B

A

B

Kind of always come back around yep.

A

They do okay, so some great stuff from Michael Washington, Michael Washington, has been doing a ton of cool blazer stuff. Lately, he's got a book out, so I've got two posts from him today and both of them have a kind of similar feel we've got a client application talking into a service back-end. So this is one that a Google email, viewer and so the Google. This is calling into the Google API, and you know it goes through. Does all the authentication stuff granting access to his emails?

A

You know using the Gmail API really cool stuff here. As far as you know, building out the application and I love his diagram slightly we're showing the kind of stuff of how he's you know, architecting his page and yeah I walked through of all that, going through it getting all the data.

A

Now, here's a fun here's another one, applying kind of similar pattern, and this is going against the graph so using the graph API and getting his Kalin calendar information from oh three, sixty five, so you know there we go where he walks through all the kind of authentication stuff creates his application on the front end.

A

You know, building up, you know using the components pulling in the Microsoft graph, so here's a Microsoft, Kraft library I've used this kind of recently using Microsoft graph. We've done this using for the.net foundation members. We use that. So anyhow, we go through implementing. You know, there's a lot to displaying.

A

You know, editing and all that stuff with your calendar, but here we have kind of a front-end where we're able to manage our calendar information and then it's using the graph API and calling through to the backend good stuff. Okay, wrapping up our blazer segment, mmm yeah Daniel Roth writing about the different scenarios for laser. So when would you use blazer server hosted? When would you use the blazer client model? So he talks about you know: blazer service server model actually shipped at Patna Kampf.

A

You know ship with Nick or three, it does call using signal are back to the server so signal art is pretty efficient, but it does require that server-side connection. So if you have a case where you are going to require, you know your your constant connection, server, if you have you know very high, you know you have a lot of code. That's going to be executed needs to happen quickly. We've got that that delay, while you're going back to the server. So he talks about you know here's that they've done some some load testing.

A

You know they've handled over 20,000 concurrent clients, but you do have you have things like memory, bottlenecks and stuff like that, so you are actually doing the processing on your server and do you have to consider that in your scale, Wendi's webassembly, webassembly, you're you're, not communicating back to the server or your you know, for any of that, blazer logic you may be calling back for our api is, but your actual blazer logic executes the server as well as all the you know, all your memory requirements, all that stuff is client-side and for you know, incidentally, for the tried net site they originally had built that using server-side and when they moved over to client side, of course, that their server hosting bill went away, because that's all that you know all the memory, all the execution, CPU all that's happening on the client now so so talking about you know, that's why you do that.

A

Of course, blazer web assembly is planned to ship in May of 2020. So officially it's still in preview for web assembly, and so you know the recommended for production is blaze. Their server. What's really cool too is city talks about here is that you can change your mind later. It's the same model, and so it's literally like two lines of code to flip over from server side to client side.

A

So I would recommend building your stuff out using the blazer server model, and then you know flip over to blazer client side later and test using the blazer client side now, yeah.

B

This is a good blog post, especially up top is what I find most intriguing, because this is the thing that's GA publicly available today and fits a lot of use cases I think blazer server. Definitely, if you're like looking to pour it over like win or webforms applications or if you're used to web forms and coming over right like blazer server, is like a great scenario for that type of.

B

So no, you know thing and really describes how it works, and a lot of people ask me like I was at vs LA at the last few weeks and a few other conferences and they're asking me about scale, and it's like well, you know, there's have you ever used like you've been just there's just web forms or we give you.

B

You socket IO, for instance like these are all really web socket II technologies, but someone wanted what you scroll down below, which is like well, what do the server's like handle right, which is this that scale so that'd, be one a standard, d1 bucket I think is that's just, and these are all standard. These aren't even premium options right.

B

So that's just literally with four gigs of RAM, like four five and concurrent users, and that just doesn't mean that's just that doesn't mean that it's gonna stop at 5,000, just just without any degradation in latency and the same thing. If you bump up to vd3, then you're at you know: 20,000 kara, that's only 14 gigs around I mean that server has less than my surface book to I mean just to be honest with you like, there's, probably any memory in that and you know comparatively and then you know, then you can decide.

B

Fuel was asking in the twitch chat. Was what happens right and while you are there, gonna be degradation or you know you're gonna scale up right. You might need to scale up automatically when you hit that load and that's sort of what it's saying at that time. So I had a few people, ask me at the conference and it was like hey. You know. I, have you know 10,000 users of this app and what type of hardware should I run it on?

B

I could be like well, here's a good example right, you'd be somewhere in the middle there, and that's of course, concurrent users of the application all at the same time. So it's nice to kind of see the scale of it and, of course you can go way higher and scale out against all sorts of things so and I think here they even say: there's gonna be even more updates on scalability and there's lots of documentation on it too. So definitely check out the docs, so yeah.

A

One other neat idea too, as far as scalability, because signal are is involved, is to actually use the azure signal our service as well yeah. So that's there's a sample I'm, bringing that over here. There's a sample from Azure signal are using Blaser and they also have it written up in the docs too. So that's you know, that's something! We're making use of the azure signal our service, and, what's what's nice with that, is it's optimized.

A

If you're running signal are in the same context as your web application, they're kind of competing and what's nice is to offload all of that kind of you know, socket and stateful management and all that kind of stuff into a signal. Our service, that that allows you to scale. Also, you can you know so so kind of decomposing things a bit and moving things over and using that as your signal, our service can really get you a lot more scale there as well. Yeah.

B

A

Cool all right, oh I,.

B

Should also say that document that you just had also.

A

B

You code to help you detect your latency and stuff like that to that documentation or whatever, so it's a good doc, we'll add it to the community links and we'll show you where to get those as well. Well, show you, where to I, always get community links when we get to the community once.

A

ah Yes, yes, which is a nice feature, we're happy to add yeah, so Kevin posting about the update for SP net.

A

Contribute or so and I figured no that's a separate thing. So these are this. Is this is a nice release? There's a lot of different client front ends that they they have support for here. Just second I was trying to balance how many links to have so these are out on new get. They have millions of downloads. These are actually you know, very well maintained and, and so anyways, so Martin Costello contributed a lot to these, as well as well as Kevin's been running this project for a while.

A

So you know, tons of this is this is great to see the whole kind of community working together in these, and they do have support for a lot of different providers. So this is, if you're, using support for our open, auth or Open ID, and you need support for different social. You know authentication providers. This is a great project. Is.

B

Is the asp net contributing members? Is there like, as some Microsoft team are, is just people in the community just yeah.

A

It's just it's the contributing folks and the community building and stuff out steal.

B

This for xamarin contribu have so many amazing people of buildings, Ameren controls and extensions and I like the idea of having it in one place. Yeah.

A

B

Be stealing this model yeah.

A

I'm not gonna, some community.

B

Members is so amusing I hope you learn something new. Every standup.

A

There you go there, you go and kudos to Kevin, Martin and Tim for building this out all right. There we go or leans a cool update from surgery posting here on update, 4 or leans with three. Oh, the the big thing here that I'm seeing is support for bedrock layer in asp net core. So the networking stack. This is stuff, that's kind of been I.

B

Have no idea what any of this is. You should step.

A

B

Say what Orleans is Mickel me know, I remember, but then also I have no idea of a bedrock. Is it like a Minecraft update or something.

A

So Orleans is this: distributed virtual actor model and it's yeah and it's very highly scalable. It's been used, I believe in some some games and it you know it's been used in some large applications with actors there's. So this gets over my head, pretty quick, but there's support for all kinds of stuff where your actors, there there's grains, there's clusters, clients and then, when you deploy this out you can you can configure like where things are running and the whole life cycle.

A

So it's honestly I've read about it several times, I think it's very cool I'm, not I'm, gonna, say something wrong. If I like try and say more than that, hopefully someone in the chat can talk about what they're using it on. If.

B

You're, an Orleans expert yeah in the chat yep.

A

But this is this: is a very cool project they've been building over time and what's so? This bedrock layer with my understanding here is that they, you know with the whole Kestrel thing, with asp net core. The first run of this was building out a high-performance web server in dotnet and as they did, that they found a lot of patterns.

A

A lot of you know a lot of core primitives that needed to be abstracted out so that people could make use of them as well, so tons of cool stuff came from making asp net a fast web server, and so some of the things like with the memory management we got stuff like span of tea and memory of tea.

A

Also a lot of things at the network layer were abstracted into this thing called bedrock, and so bedrock has some of this kind of core networking stuff. What's neat here is Orleans is actually a library, and it's running kind of you know it's it's not something that you're going to be hosting inside of a SP net, but this bedrock network layer is now available for other dotnet things to use.

A

So for yeah, so for running, like high-performance, which which this you know, Orleans tons of communication between all these grains across all these different silos and stuff and so being able to handle that across all those different layers you know and and be extremely efficient across the different kind of levels. You know that's an example. We're pulling that performance in you know is really needed.

A

So it's cool for me to see how some of the different things that we're doing across you know it started with make asp net fast and then, over the course of years. A lot of those learnings have been abstracted into hey. Let's make memory management better. Let's make networking better. Let's make it! You know all these different. You know, let's make di better and all those things kind of floating and being available now across all I've done that, oh okay, this is neat. This is an update from David Fowler.

A

This is, and then it's posted in the docs, so this is in the performance and reliability or asp.net. So so these are things that we've seen over time where people you know run into scalability problems. Running to performance, reliability, issues and stuff, so these are don't send dues so, for instance, don't you a stream reader read and then do something with it in a controller as you're doing that, then your thread is now blocking and you're. You know that you're causing thread starvation and stuff.

A

So instead here's an example: let's make that an async task, and then we can do a you know, read to end async and now this is async. So now we're not walking on that thread while we're reading. Even better, though, is instead of you, know, reading into a variable, and then you see realizing it lets a wait, jayson's deserialize err. These here lies a sink now this thing is fully async, so this is.

A

This is a great kind of walkthrough of here's, here's a bad pattern and then some kind of better and best Sun, some of those things so again reading over a form. Let's read the form: async, basically everything: let's do it async. So, instead of you know, let's grab the form: let's do some stuff; instead, let's read form async and then also here's some great stuff.

A

As far as you know, data processing api's, so some stuff- you might not think about like your HTTP context, you know here pointing out that the HTTP context should not be stored in a variable and in- and you know what you should do instead with that so all kinds of recommendations on context, of course, anything you're doing with context. You need to be concerned about scalability specific stuff here about multiple thread access. So instead of here, we've got search, async, sir chasing search, async and then we're you know we're combining the results using a win.

A

All all of the search, a sinks are accessing the HTTP context. So that's not good. We've got a bunch of async requests all going into that same context. It's not thread safe, you're, gonna have a bad time, so, instead, what we're doing here is we're getting the path before making that call, and then all of those are making the call without using that HTTP context anymore, all right so yeah. So you know several more things here.

A

You know good good stuff to read through good, just general stuff if you're gonna take away one thing from there. It's you know async all the things now we just need Rosalind analyzers for all of it. Well, so I actually did ask about that on Twitter and there was an interesting discussion.

A

David was saying that you can do some of that, but Roslyn doesn't have access to all these like lifetime handling and all that kind of stuff and then Barry dorans chimed in as Barry will with with you know, some grumpy reminders that you know if you're gonna have, if you're going to have analyzers that are saying hey. Maybe this is wrong or hey. You might want to do this. It can be a little noisy but I agree. I do feel like. There are some cases here where arousal and analyzer and a fix could definitely help.

A

So, ok, that's how the community links tons of good stuff. We actually did plan this out. We wanted to have a lot of good community links this week, and so here they all are two others that we're going to include in the community links our stuff we're going to be talking about you and I. As part of the you know how we built stand-up site, so that's the repo where the code is, and also the playlist, the YouTube playlist, which shows where we actually built all the stuff out now I'm going to stop sharing.

A

However, this is I'm in the weird state where, because I've clicked away from it in the I, don't actually have the team's thing to stop. Oh.

B

It's hidden up there. There you go yeah.

A

But it's now and now in teams Wow and look at that.

B

You know I got really fancy with stinger transition, so you know we had to get a standard.

A

B

So, let's see oh see.

A

B

Was asking on touch before we go on was something about the synchronous, asp.net cores, synchronization context runs and the continuation without locks are on a different thread, potentially I'm, not sure.

A

Honestly, I don't know yeah.

B

Yes, shoot us a tweet, she does a tweet up cool yeah.

A

B

Well, do you want to talk about the journey a little.

A

Bit sure sure so the idea was SP netcommunity stand up, has been going on since I think 2014 five.

B

Years ago, Center five year right, yeah.

A

So crazy- and we started with you, know- is just Google Hangouts and Twitter and we'd say: hey, come check it out over time. Damion Edwards built a very cool site that integrated with the YouTube API back-end and but it did require every show. There was like an admin screen that somebody had to go into before the show configure stuff. When the show went live, we had to do some stuff to make it go live when the show ended. You had to go in and do some stuff.

A

If things were not named exactly correctly, it could break like the page would go down. Also the YouTube API would change over time, and that would break things, and so there it was a very cool page that served us well for a lot of time. It also helped drive a lot of really cool stuff, Damian said as part of building out the site and maintaining the site use that to test application patterns to test the API and that actually drove some of the thinking behind building razor pages.

A

You know the actual application building helps, you know say like hey the MVC pattern, not working well and this kind of site where models using controllers are not super useful, yeah, so so very useful site. However, over time our use case changed and we ended up. You know wanting to like, as we said, we have the Tuesday Thursday show we have the support for twitch and we're also now on Facebook and mixer.

B

A

The places all the places and so that you know we didn't have support for that. We gosh the YouTube API had changed. Also, we wanted to say, like hey, we're, already scheduling the shows in the YouTube API. Why doesn't the show just automatically update everything itself? Oh yeah.

B

A

Api knows the name of the show and the, and it knows when it's gonna happen and when the show is live and all that we.

B

Wanted to automate as much things as possible, because we now have a bunch of different hosts on the show or I do the xamarin one Kendra. Does the vs visual studio on like rich and emo or doing like the other ones like so there's a lot of people, and we only have so much time and for us to go update an admin portal every single time or a people. Log in and people forget.

A

B

Wanted to just work, and we oh you have like the one thing we have to do, no matter what is scheduled. The YouTube show like it you have to because we use restream and in restream da yo, allows you to stream to multiple sources so for YouTube, since emo also runs the dotnet like reviews or whatever the done it team reviews he may be streaming to YouTube to so we can't just generically stream to YouTube.

B

We want to pick an event and that's actually really good, because then we have this playlist and that's like the the source that is the master source of of it, and if it's not in there, then we can't stream to it, which means it's not planned.

B

So that's super nice because we're already setting this up so it'd be one less thing to do, and additionally, YouTube API tells you when the show goes live when the show ended, like all that stuff is already done for you, which is pretty great and, and you know we could use like a twitch API or a mixer API, but we're not scheduling those events, so there's no source we're just going to them at any time and tweeting about it. Right.

A

Right also, there were some things over time where you know we've had these community links and we used to just I would go into the YouTube description after the show and I would update the description and paste in all the links you know and then and run into weird limitations where YouTube would say, you're pasting too many links.

A

This is obviously a spam comment, all that stuff and then over time we started using a service called one tab and and one tab which was good, but it didn't exactly do everything we wanted to do and sometimes people would be blocked or whatever and then sessile and burke built the URL list, and the URL list is a great service. For you know, managing a list of links and like these shows links are published in the URL list, and so that was also something where we said hey.

A

It would be nice to have first-class support for that as well, yeah, so yeah. So we built a site yeah.

B

I think the cool part about building the site is that we wanted to do it in a way that would be a fun sort of in the in the tone of community stand-ups.

B

It would be a way of teaching people how to build a website using asp.net core, and you had me who is already streaming on Twitch I, guys stream mobile apps, but I have always wanted to build web apps I'm one of the I don't know if I'm rare but I think that to me it's a little bit rare that I work on the.net team and like I'm around you all the time and like I've, never built a website in my life, I've, always integrated into other systems like I started with like gray matter and like WordPress and like now, I'm on ghost and like I've, always integrated, but I'm.

B

Never from scratch built stuff, I've done web api's here and there when I need them, but I'm, always integrating into other services. I've never owned and like builds a web real functioning website in modern time in a long time.

B

So you are lucky enough that you have done this for a long time and I said hey, let's combine James John together and will stream it, so we did I think ten episodes it took us longer than we wanted to you, but that's okay and we built the thing live on Twitch and what's cool about this, so I'm gonna go and share my screen over here.

B

Okay, let's see if this is gonna work, Boop and what's cool about is you can go like relive the magic if you will and these go for about two or three hours through all of them, ten videos from start to finish and they're all in order of operation that you can go through all the live streams, all the dates that were on there and what we ended up building was if you go to dot dot, dot net, slash stand up.

B

You end up going to the dinette community site, which is like literally streaming right now and when you come here, it's very much like the alive dot asp.net website. But these are the dotnet community series. So everything is here and since we're streaming, the video plays, if it wasn't- and there was something scheduled, it would do a countdown which is cool. It also gives you the links to YouTube, twitch and mixer, so you can chat with us there, and then you have all the archives.

B

So what's awesome about this is that right now you can always go here and then you can see that it's an asp.net show a language is in runtime, show here's the the xamarin one here, so you can see what it is yet the topic and then always get the community links. If there are some some shows don't have community links, so so, if they have them they're here, it's updated and we've been adding them before we start too.

B

So you can just always come here in the very beginning: click on it boom good to go and and open it up in the I call it the Earl list, the Earl list, but mi.

A

Yeah, you know what I don't know if want to even show we have a planner, it's a Microsoft planner plan shows, and we actually have like all that stuff in there, like you know the illest and the you know all the kind of stuff I'll put in there before we, even as we're planning the show out yeah.

B

So, like every bit of this data is coming from YouTube, the thumbnails the if it's on air all this stuff, but we wanted to create an API that was versatile, and so we kind of started off with the very first episode is like John explaining to me what asp.net core I don't know what I'm doing John please help me and it really morphed into something that I think was really cool. So this is the website. It has a full back-end in Azure. So we have a dev portal, so we actually have a dev website.

B

That's running dev as your function, which we'll talk about. We have logic, apps that are running willfull as your dev ops pipeline for the website for the azure function, which I think I love. This function based architecture which I'll talk about that was my idea and John gave me the nod of approval. So I was like that's cool yeah and that's what it is so I figured.

B

We can kind of walk through the structure is cool because you had Rowan on last week to sort of talk about the dotnet website and how he built it and a lot of people came into the livestream and they would ask us: why are you? How are you building it? Why are you building this way? Why aren't you using blazer?

B

Why aren't you using you, know, MVC or why aren't using this and and and what we went with at the time, was a dotnet court to to and I think on your stream next week or later this week, you're gonna upgrade this to three. Oh I just know I've just kind of made that decision.

A

B

We started with Razer pages and we started with that because we were integrating. We wanted to build this in the open, so anybody that had their own YouTube page or any other data feed could just copy it put in their back-end and boom good to go. You could literally clone this website put in your playlist and boom. You have a website with all of your YouTube videos for any playlist and you could yeah.

A

B

Do anything could really easily you see how it's done, so we honestly only have there's we added a YouTube health check, but besides that we just had an index CS HTML file and like that, was it it's.

A

Basically, a single page website, it's.

B

A single page website yeah so a spot yeah.

A

But you know so I think a nice thing with this was we did have some kind of non-trivial requirements. We had this API back-end that could fail or you know, had limited amount of times. We could call into.

B

A

Part of the you know, our architecture here is moving some of the moving parts into it functions you know and then the functions back-end is cached and we can call from our API. So the funny kind of way this was deployed was we actually we wanted to have this live during net conf and you know Rowan and team said hey. We're not gonna have time to. Actually you know.

A

Do the whole engineering pass to deploy this, but if you can skin it to use the same headers, footers and style as a site, we can use Azure front door and basically just shoehorn it in right, and it's just that one page of the site actually was being served off of your hazard. My.

B

My personal Azure subscription that we leave ranked up because yeah you're right, so the thing is here's. The cool thing about this architecture is often when you think about I'm gonna, build this website and you're like I need to hit an API, so you would hit the API from your browser. The problem here is that let's say you have 200,000 people or even right now, a hundred or 200 people going to that page.

B

You would have literally maybe within seconds or maybe all at the same time, if everyone saw the tweet went to the page immediately, everybody would be loading the website the website would then be. The server would hit the YouTube API and you only can check the YouTube API so much right near serializing. All this information, you're parsing, all this information and you're also parsing the entire YouTube API every single time and I've built this website or this mobile app because I'm the mobile app.

B

You know person on this call I built this Hanselman forms application, because I love, Scott Hanselman and when we were releasing xamarin forms, I wanted a showcase and on twitch I've been building ow REE skinning it I just had a dark mode to it. All this stuff and I ran to the same thing where the mobile app would tell you about Scott Hanselman.

B

It would show you his tweets, it would show you his blog and it would allow you to view all of his YouTube and channel 9 videos, and also all this podcasts, and here is the issue. John is that in the mobile app remember like in mobile apps? This is why webs of elements very tricky for me and why I kind of like blazer client a little bit so I understand it, is like on the mobile app. Everything is running on the device right like it's running, I'm gonna go big, it's like it's!

B

It's in the computer John! It's like it's.

A

Happening like when you.

B

Click a button, it happens, they're, like my mind, like didn't, understand like when you click a button on a website like it's not like JavaScript is running but, like the things are happening on a server, it blows my mind every time I think about it. It.

A

Was funny working with you because, as part of this, we actually after we built the function, backend and then I said hey now you walk me through and we'll build a mobile app. Yes,.

B

A

You were having to watch me and I kept on trying to to refresh yes.

B

A

Like now it's about it's.

B

Happening it's in the computer right so so, so that's why it's really tricky when you, when you want to like build this out, you also don't want it to have this so I thought for the mobile app to two issues: one Scott Hanselman for Hansol Hansol minutes his RSS feed John is five megabytes and the one thing you don't want to do on a mobile app. Nor would you want to do for every single time. You're. Making a call you want to keep your server cost low is you want to do?

B

Is lease lease stuff is humanly possible on the mobile app or on the website? That's that was my thinking. So what I did in the Hanselman app is I said: hey, let's have an azure function that just all the time can go query, maybe once or twice a day or every hour, parses RSS feed, and then you would basically your Azure function. That's running server list would take that parse it and shove it into blob storage. That was my goal and then your mobile app or anybody else.

B

This is the beautiful part of not doing it in the mobile, we're doing it in the website here. So you put it in the function. You can create a HTTP trigger and what's great about, HTTP triggers is that they're super duper. Cheap I mean they're, crazy, cheap because there's no API gateway. It's built into app service, so there's no extra cost for as your functions with HTTP triggers it's very beautiful compared to anything else out there.

B

It's really awesome, so you can just say: hey anybody can hit this URL just like a getter like in a Web API call, but you don't have to run a server, and this was great because we could take this functionality and shove it into the dotnet website, which was cool, so I could show you the web site, but I want to show you the function. I think that's cool, I, think that's the cool stuff. It.

A

Is cool you know? If you have the azure portal, you can actually bring up the diagram to I.

B

A

An app insights or I could do that as well. There's a time where my app let.

B

A

B

A

B

Right, I'm interested in this okay location.

A

Map rule application map- oh.

B

A

So yeah so I mean that's the I, don't know it's calling back into that and then I think there's a way. Also, if you click through a cursor is also a storage account that it runs on as well here. So what's kind of neat there is that one on the Left, that's the website and the website itself is not having to make all these calls into the YouTube API. The YouTube API actually is the one is being called from the function so.

B

Yes, there's one instant of this, which is hitting this I think these are other clients to better hitting it yep.

A

Yeah and there's there's ways to I. This UI throws me a bit if I click around randomly I get things where it'll show more of like the API back-end calls as well, but it'll show all that kind of like so it's the function, making the calls into. So what was nice for scale is when we went live at nakhon. The website itself could handle. You know thousands of requests, because you, what like it wasn't calling the YouTube API as your yeah.

B

So here here is the goal of the backend, so we also wanted this to kind of go anywhere. So the nice thing is, you could. Basically, this is the other part of it to that. I did for the Hanselman. Application is I like this logic, because, instead of doing binding or basing your UI on the YouTube, API I just created my own model and we have a dotnet standard library called share, and this has like information about this show like what do we want to display in our UI? So an ID there's a title.

B

The topic there's community links, URL, there's scheduled date times, and this is all information coming from the YouTube API. But the difference is that is you only want some of that data right? So you want it to be slim. So, instead of just having a an azure function, that takes the YouTube API and then just jams, the JSON blob into storage, and then you get it all and have to parse it all again. You trim it down and I did this with my Hanselman app and it went from five Meg's to like 20 kilobytes.

B

So you get huge perf right because you're trimming down your data model, so this is this is what we have and, and the back end is just you know: gonna set all these properties, so the function here, super simple is we have this live stand-up functions and a function? Backend can have a bunch of different things, so this is really cool, so we did basically two methods in here. One is get shows and update shows.

B

So that's that's the entirety of the backend right, so the backend get shows anybody can call it at any time and it's an HTTP trigger with a get and what it does is. It will grab a blob from blob storage automatically called that's in the folder of live stand-up. Slash shows, JSON and functions are cool because they come with the storage automatically. So you don't even have to configure anything.

B

It just works John, it just works and that's it, and what we did here is I just have a very simple helper method that I created and what this does is honestly funny enough. I should probably be using whatever that that best practices from asp.net core thing is because it look at me, look what I'm doing the.

A

B

Someone call Fowler on me but yeah. What I'm doing here is I'm grabbing that blob, which is actually just a stream reading it to end, should do it, asynchronously, I, guess and then I just return that as a string here, whatever so I, basically take that and since it's already JSON I, just plop it in there, so I don't need to use JSON net or anything in here and just boom good to go and super simple and then what we do here is whenever we want to update.

B

So anybody can call, then you just get JSON back, but it's that slimmed-down JSON. So if I actually go to my local host, where is it at I.

A

Think this is cool too, by the way when you were showing the triggers there. mmm We set this up. So it's a common function, that's called both from the HTTP request and also from a timer a trigger yum. So you both you, have both a timed update, but you also have HTTP call to to update, shows as you're doing yeah.

B

So two things happen there. So here's this big JSON blob of shenanigans right. So these are all the shows that are coming through so yeah. So the other thing I did here because I just put this in release only because I didn't want to have it update every five minutes while I have my user function running locally, but on the server yeah.

B

What I do is I have this method, so we can manually call update, shows- and this is nice because you could call it manually or you could connect it to a logic, app and say: hey whenever an RSS feed changes or when I tweet something specific or do something go call this method.

B

So you could call that from a lot, and what we can see here is that this is an HTTP trigger and it's a blob, but it's an out blob because it has write access, so get shows, reads it right, shows, update, shows, writes it's a file and what we see down here is very much the same. So if I do, if I just remove this for for highlighting sake here, let's remove that here.

B

What we'll see is that I also have a update, shows timer. So that's going to be the URL of it, but it's not a URL, because it's a timer trigger- and this uses the cron job format- to update every five minutes, and this is beautiful, because we can literally update our website data every five minutes and we could do it last I think the YouTube API allows a several hundred calls a minute even or maybe an hour. I don't know whatever it is, but we only need it here.

B

It's gonna run what sixty five six times no twelve times math math is hard.

A

B

Times and we could do it every minute, we could do it every hour or whatever, but we figure. Five minutes is good because this will happen at the start of the hour just non-stop. So if you come into the website boom, it's gonna be updated within five minutes and we don't have to do anything and that's really nice. So this update shows is like where the magic happens John, and this is what we originally had inside of the website. Originally, we we did it in the website.

B

We just said call call it: do everything go to town and the goal here is that when we call update shows we give it a blob and stream that we want to write to, which is that show data and we created a show. Youtube show service, and this is the thing that actually calls it. So it's an interface just like if you were calling it from asp.net with the built in just dependency service.

B

It just shows it gets to the shows from YouTube, and then it serializes that out to a string and then dumps it into the blob boom. Basically, like that and what's nice, is that this, for all intents and purposes why it's really also super beneficial here is that we have an IEEE YouTube, show service and if I peek in here, it's just one method which is get shows. So it's not very fancy, but this is cool because we actually mocked out all the data.

B

We took a JSON blob and put it in our website, so I could or you could work on it completely off offline. Well,.

A

And also for tests right, because we want to be able to run our unit tests or our health checks without hitting the backend exactly.

B

So like when we're testing it, we just need to see some data. We don't need the real data and then we could also buffer for what's really cool is we could test different scenarios because we didn't want to have to wait for a show to go, live to test what it would look like when the show is live and we could mock that data out, which was nice.

B

So we have a bunch of variables, so we put in like YouTube, keys and app names and playlists, and we just you know, get that environment variable which is hosted just like asp.net, environment variables are and what's nice is that the core of it gets shows uses the official YouTube dotnet nougat package, so it just gets it which is cool, and we on the stream you'll see. If you watch it, we learn all about the YouTube API. We give it an API key.

B

We give it the app name which you set up and we set up in the portal and we're getting which, by.

A

The way so that API key is like it's like a password. You don't want to be sharing that information, and so that was a nice place to use the user secrets. So he is user secrets when developing locally to make sure we didn't check in that key to to github and then on the server. We just use the azure app service configuration setting so yeah nice kind of used to that and.

B

That's nice too, because when you're, when you're and when you think about it right when, when you start to think about how you're building different apps when they're running on the server we're like cool the server knows the key or the function knows the key. But what happens when you're running on the client right and what you don't want to do is put your YouTube API key in your mobile, app right more on your blazer client application right.

B

You don't want to put the kid in the app, because that's no good for anybody involved in general, but what you can do is you can call your functions back-end, which has the key to to the YouTube API, so yeah. This is super great, and so what we end up doing here is we tell YouTube the YouTube service to grab playlist items, and this is sort of like the snippet and status it's sort of their way of narrowing down the data.

B

So, instead of getting everything, you can say only give me the snippet and the status, and you can tell it how many shows you want to get and you get paged. But we don't need to page because we're only returning the last I think.

A

B

We make the requests asynchronously and then we end up doing like this big, like parsing, back and forth. So what's cool about this is that we end up taking all that playlist data and converting it to our show. So our show we go through all the items. We make sure that one we only get the public ones right, because this that's cool too. If you're calling this from your multiple APIs for something else, it's gonna get all the data, even private ones, because it's you, you are the admin and you have access to this.

B

So we say only give us the public ones and that have all the information. And then we just start to go to town here and we start getting thumbnails descriptions all the IDS, because you don't want to have to do this over and over and over again, like figure out the resource ID to video ID snippet. You just want the ID title, thumbnail, the playlist ID, and what I like about this is then you're in control. So if YouTube changes its API, then you can just update your back-end and any of your clients.

B

Web mobile, IOT or whatever right don't have to do anything they just.

A

All just a bunch, an app that stuff date, yep yep.

B

Exactly so, that's sort of my what I like it. You don't even need to redeploy your website right, because you're redeploying a function in general and someone asks is the code available on a public repo. It is. Is it in the earliest.

A

And the it is in the ER list and then I'll post it in the chat as well.

B

You can always go to the dotnet stand-up website, so dot dot net, slash, stand up. We're gonna put this in like every tweet now, but you can always go see. Community links tap on that. That goes to the Earl list, and then it's somewhere in here and boom there. It is John, Galloway, so very cool. So so what we end up doing here is like we just do tons of cleanup right, so your browser doesn't need to figure out how to shrink in cata.

B

We just try to say only just this become like a dumb client just display information and don't try to be smart and string concatenate in your razor. You don't need to do that. You know we do all of it for you here in the function. So when we get it from URL from YouTube, we shove it into that blob right and that's our goal. Does that make sense that yeah.

A

And that made our this might be good spot to also we could show off the unit tests and the the.

B

A

Checks too, because that allowed us to simplify, like our health check, really just needed to say like can we display the page and I forget if we also in our health check we needed to you see if from we had access to the API back-end? Yes,.

B

We have to testing projects, we have health checks and then also just tests in general, which are these X units. These are richer, just normal MS tests, I think yep, no any X unit there a connection. So the reason we did that is because technically anything from our function is you know it's just logic at the end of the day, so the unit tests are very straightforward. We have like some information here about, like we mock out a YouTube service, so we, you know we get some data we're like here.

B

This is what we would expect from the backend. We call some methods in that that YouTube service, which, by the way is, is here so it's inside of the function. So your mobile apps tone have access to that or anything like that, and we just do a bunch of things like make sure that we are parsing the title correctly, the topic correctly because the the function it's doing all this parsing and we want to basically validate that all that parsing is correct. This.

A

Fine 5758, it's kind of neat. We actually had some file data that was pulled in that was something I think you had pointed out that that was a an option. So we have a test running against some JSON sample data. Yep.

B

Yes, so we took that JSON sample data and what we did. It was just dumped out that JSON and sampled data is right here, so we can see it, we can update it. We can use it in our web app and we could have put this in this- the shared one, but we just put it in our mobile app right now and then it we just made sure that that parsing was correctly happening and the same thing here.

B

So we on the show the show itself has a bunch of extension methods, and that's where the core of this is happening is. If we look at this shared code, there's the show and then there's the extension methods and the extension methods are calculating trimming, stuff figuring out the title, and the function is doing all of this. So we and it's doing a regex pattern matching for the URL list. So it's kind.

A

B

Out all of this, this.

A

Is what sessile said on the chat? We're gonna get a nice API for the ER list at some point and that's will rip out our regular expression, because I remember that, as already is like I, don't want to write a regular expression, but we have to yes.

B

This is nice because you know it just looks at the description of YouTube regex. Is it and this is not doing it on the website? It's doing it on the Azure function. The.

A

Function itself, yeah in.

B

The function itself, so the mobile app the website does no parsing. It just DC realizes a very simple blob of data. This is my favorite way to now build mobile, apps, basically yeah.

A

B

Your we're doing all this, like these devices, are powerful. Our servers are powerful, but why do a regex when you don't have to that, was kind of a lot yeah.

A

Another nice thing with this kind of pattern is you the the function hits the backend API, which could fail. It does some parsing which could fail, but if everything succeeds, it writes out a JSON blob and then any calls into it are going to be reading from that JSON blob. What's nice with, that is if the API back-end goes down, if there's something malformed or the regular expression doesn't work for some reason or whatever it is right that doesn't matter in terms of the whole site going down the function. The next time.

A

Someone calls that function. It'll read the last good JSON blob and it'll return, the last good state right, and so as far as the website, the mobile app whatever they're pretty resilient, because all they need is for the you know: we've already got a known good state function, back-end data, it's a you know what I mean exactly.

B

A

The whole site- that's.

B

What I like about it too, because yet no one needs to update anything. It just magically happens and we can redeploy that function back in and then the website so need to be deployed at all, which I think is pretty cool, so yeah. What we have in the health checks over here to is on the asp.net core website.

B

We created a normal YouTube health check and what this does is it just returns if it can get the shows from a service return healthy or not, and this YouTube service that it has inside of the inside of the website is what it's testing is. Can it reach the function backend right? So it looks to get the functions key, so the backend key deserialize the data and that returns healthy or not. So it's a very simple way to say: hey.

B

Is there something wrong with my function right and and is that as a function healthy or not, and we could then detect it, which is cool and that super duper simple. So the the test here which we put up, which is a health check, just simply calls in to make sure that index works, privacy works, and then we have very simple little code here to check. Give us as healthy or not so it's kind of almost like the default.

B

We just gave it the routes, the in line data to check for or in the theory, yep now, I think the beautiful part here is that I'm, not a web developer, but you're able to help me at least build this application. So if I look at the backend of this code in general, it's SuperDuper simple, so it's straight razor pages, and inside of here we just register and bring in a YouTube service. And what we're doing here is we have a list of shows. We have an upcoming show.

B

We have an on-air show and we do a few things like simple boolean that we can check inside of our page like is there an upcoming show? Is there an on-air show and that's all we need to do so when we load this like this?

B

Is the entirety of the back end like when we load the page we get the shows we see if there's an upcoming show, which means that there's a show in the future and that the show is not in the on-air and then we also just see if there's a show on air. So like that's all we do like that's the entire, that's the entire web, app like that's it like, and then it's beautiful right, because literally the entire web. App here is three lines of code. The YouTube service is two lines of code.

B

I mean the entire mote. The entire web app is seven lines of code. Well,.

A

So we do have a little bit in the what is it in the index? Yes, so the first file, you have the first tab. You have there yeah.

B

A

Html, yes, I forget now, as we evolved this mm-hm, we do have some like some bools and stuff they're weaker, so those are part of the page model and I do like this kind of this I.

A

Don't know this pattern when you're building with the page model of having some of these, you know calculated fields that you use them to simplify the front-end RAZR code, so the Razr code has no logic in any of this. Like are we on air? Do we have an upcoming show? Those kind of decisions are made as properties in the page model, yeah.

B

That's kind of like a it's. My came from an nvvm background, so my whole thing is applicant. Is busy can load more like there's all these properties and I'm, not a big fan of value converters blasphemy I know, but why call an entire thing to convert it where I can just convert it? In my view, model and create another property. I just feel like there's less work, there's less stuff I'm, just not a big fan of value, converters, sorry, jack, sorry, Internet,.

A

No, and so this absolutely stolen from like the mvvm style right, it's but I do love that it's like hey. Let's do the processing here it's in code, so I can easily debug it. It's very obvious. You know and then set that front end for that index. Cs, HTML, yeah, mostly just binding to properties. It's saying if model is on air if this or that and then just yeah.

B

Lets them, let me run this okay, so I have the back end running here, which is here and what I'm gonna do is I will I will go ahead and I'll set the website as the startup right now and then what I can really do here is.

B

I can really show you how this is running so I'll go ahead and hit a breakpoint here and I'll just run it locally, and then we can kind of walk through the CS HTML, because once you see it in action, you'll kind of understand a little bit like what it looks like here and and what I'm doing is inside of the function. In my side of my app settings, I have the localhost so I'm, just debugging it locally right there.

B

So I get the data back. So here's the the data, the JSON blob and then, if I continue on over here, we should see that I have a list of shows now so I'm going to zoom in for everybody, so I have a list of shows, 25 shows and very like a simple data. So this is asp.net. Here's the community links. Here's the description, here's the display title, here's some simple boolean for the show and then yeah. We just simply set a few properties so on air. It's currently on air.

B

So literally this show is on air right now started an hour ago, use human eyes err for that which is pretty cool and yeah, and so we get thumbnail URLs things like that which is pretty cool and then, when we run this and we the browser which is here, this is what it looks like. So literally the show is running and it's not as pretty, because this is shoved into the the dotnet website. So it's pretty okay, but we use bootstrap, bootstrap, yeah yep.

A

B

A

And so it's well, you call that out. That was a kind of a big win in this case was we built it out using bootstrap? We use things like the bootstrap. What is the latest bootstrap for like with the grid and cards? So we got all the responsive handling we got.

A

You know a lot of nice styling stuff for free and then, when we talked to the team that runs, you know the dotnet site, they said: hey, here's our bootstrap theme, and so we just pulled in their bootstrap theme and like 70% of the work, was done like all of a sudden, the site looked like the live site. So that's a kind of nice thing is that bootstrap defines kind of a de-facto sign language. You.

B

A

B

Know we've got, is it running yeah right, yeah so looks similar its tweaked a little. We keep tweaking it. You know yeah.

A

So yeah, so it's nice that that kind of you know we had the same class names. We had the same grid architecture, whereas if we had written our own CSS yeah sure it may have like and happier with the exact names of all the classes, but we would had to rewrite it when we migrated it. So now.

B

The nice thing about this es HTML, so the razor page itself is yeah. So there's a little bit of logic here. So there's this Jumbotron header and what you kind of see there is if it's on air, what it ends up doing is it just says: hey like model?

B

If something is on air, then display the category so it'd be like asp.net live community stand up or xamarin can you know live stand up if it has a title, but what the topic is, and then this gobbledygook here mostly just outputs the YouTube iframe, so the iframe of the YouTube embed, and then we just use a container here and we use some rows to output the icons, so you YouTube twitch and mixer. Basically, we just output those images.

B

Now the difference here is if there, if there is an upcoming, show, we do something else, and then, if we do nothing, we just output, some some normal stuff here and I'll come back to the has upcoming show, because that's the crazy magic of being lucky that we already had JavaScript. That worked for it to do a countdown, but what we ended up doing here is very simple right, so we just have a card deck which is coming from bootstrap we've reach over all those shows.

B

Now one thing we did change is in the production website. We show all of them, so we can show the community links and that's one thing. We were like skipping over here and I kind of like that. We show it now but yeah. What we do here is we just say: hey, you know, here's a link and an image show the thumbnail.

B

If it's new put a little badge, it says it's new or if it's upcoming and then on the bottom of the body we put the category and if it has links just put the links and like that's literally the page, it's pretty straightforward, it's just CS HTML and then we have a little bit more stuff, some more fun stuff, I would say at the bottom. We have another container for seol shows which is the more shows URL, and then we output the icons again.

B

But then we have this thing John, which is, if there's an upcoming, show load some JavaScript um and.

A

This is the case where you know you did talk about at some point. Could this be blazer? And that is a case where here we've got some custom JavaScript and we're doing some parsing and date math and all that in JavaScript, and that was some of the more comical part of the show of like how do you even JavaScript? You know because I don't.

B

Know how to you, that's, why I mean so what this does here? What I skipped over is, if there's an upcoming, show what we end up doing here. Is we output some information here, such as the live stand-up? If there's a title, we put it and then we basically load that javascript and pass it this information on this div, so we give it the year the month the day in the minute- and all this is doing- is a little countdown timer.

B

So if I go into the dub dub route, JavaScript, oh, that where we put it yeah now, this is some JavaScript that we stole from the live.

A

B

Website yeah, so this does a bunch of math a base on says: what's the user's time zone, let's do a countdown show them the day will show a.m. versus p.m. twelve hours versus not 12 hour clock inside of it it does formatting. It looks up timezone information, it does a bunch of stuff yeah, it's just a bunch of stuff, basically there's more JavaScript to do a countdown timer than the entire website by the way, yeah and then.

A

There we, you know.

B

A

That data stuff, where it actually replaces us the replacement using the iframe with the embed knowledge, yep.

B

Exactly so, all this is doing is its figuring out the current time zone, and then it does a countdown over and over again, which is a great use case for blazer type of stuff, but you'd still have to get information from the browser for the time zone to be able to pipe it into the the website. Now.

A

I'm not sure where we settled on it that code way down at the bottom. There you know, does a replace mm-hmm.

B

A

The idea there is that you know do to do to all the kind of cookie limitations you can't just throw an iframe in a page in some cases and so for this I. Don't actually think this was turned on, but the idea here is you can write out.

A

You can write out an image with a data iframe and then click on it. So once you know, somebody is like accepted cookies or whatever clicking on it does the the replacement. So that is a pattern. I've used that, like on the dotnet foundation, side and stuff, like that know,.

B

What you ended up doing them is, you ended up just refreshing. The website yeah.

A

Which that works too I.

B

Don't know where you did that, oh there, it is right there. So if we're at, if it started, then just reload the page yeah.

A

And you know we went back and forth on different things there, but really it's like. Instead of having the site that can do both things, it can do the countdown and it show the life side and all that and handle all the different cases and stuff. It's like just refresh the page. Just.

B

Refresh it it's there, just refresh it and it works really. Well, so that's how we do the JavaScript, then yeah, it's cool, so we have the website. It's it's up and running, and it's there what's cool about this, though, is that, as part of the live stream we decided to have you John build a mobile app, which.

A

Was also fun so.

B

This is kind of cool right, so so what I like about this model? Is? We have the shared library here, which is: has humanize ur, as JSON dead in it has? The show extensions has the interface for the YouTube API, and that is shared with the web site, the azure functions and we have an iOS and Android app built with xamarin and xamarin forms. So we literally just sort of grabbed information here or for here we have. We have some models, so this is, you did file new, so we didn't even delete stuff.

B

You just took the file new and then slap some data in there.

A

B

There's no model, this items not used at all there's. Basically, we just did file new, which displays a list of date and we said display a bunch of items, so we created our own YouTube API client, which could be heavily shared.

B

Actually we could have made this easier, as we can see, is probably pass in a URL, so here I'm just hitting the real back-end, but here I'm, just getting the string, asynchronously and deserializing a list of shows like the same thing that the website is doing so, not that not that crazy and we have we have a view of items. So we have this view here and what it's doing is displaying information about the the show. So this is sam'l and we have data binding to a title to the description to a thumbnail.

B

Url I can actually have it running here. So let me pull it up here on my device.

B

Live stand up, Dom mobile, so here it just went and hit the Azure function. Backend and here all the show is right and what you can do is you can tap on one and we figured out how to this is like we spent literally want no, no theming, no styling. This is John's first app here.

A

It's just like click, and then you like shaking and shaking your head and face yeah, and so like you, the episode up.

B

To ninety links right boom, um you can view the video. So if you want to you, probably embed the video at some point but boom now it's actually playing it back. So that's good yeah, so you can actually have it all here right and you can have it on your phone and we just kind of started on and I think it'd be really fun to really yep.

A

Built this out more, it's definitely him yeah and and again like by having that common function, back-end and everything it was pretty straightforward. We're will to have that shared client code calling back into it and everything. Yes,.

B

Beautiful right here, you're sharing that function, you're sharing the model and the we could probably create and share the same exact YouTube data store, because the only difference between the mobile app now and the as your function or the other asp.net core website is where it gets the URL from for asp.net. It puts it in the app variables, and here we would just put the URL into the application and that's okay, because you need to call a URL. So it doesn't really matter that it's calling the function URL, which is cool and yeah.

B

So all of this is here. When you go into item detail page, you can kind of see that we we just started hijacked it here and we have a very simple items, view model and, as a list of shows, we give it a title. It goes and it calls into our data store, which says get shows and and that's that's how that's all it is like.

B

That's the backend, and when we go into a detail page, we just put some images and buttons and labels and check out a mobile app and is your first mobile app right. John.

A

Yes, yes, yes, pretty much yeah and especially doing something using kind of modern xamarin forms and stuff. So yeah think this a lot of fun and and looking at this more makes me want to like hey I, want to turn on some of the new features. You know it was cool using the live reload. um You know and yeah yeah. You.

B

Debug, a sort, hot reloading, the pages and boom you go yeah, so what I wanted to show? The last thing I wanted to show too, is, if you are interested in this architecture,.

B

One thing that's super nifty is the azure storage, Explorer and I, really like the Azure storage explorer, because if you're using storage accounts locally with your as your function, you can see the data. So this is my local data right here, and this is the JSON and I can open it. I can download it and it's it's it's just. You know, emulating the azure storage here, so I'm running the function locally. The mobile app can hit it locally. You know everything like that and I get the JSON file.

B

So I can see it here on my machine and it's stored here. So I don't have to configure anything. I just create an azure function, hit go and my mobile apps can read from it. My website can read from it and and I don't need to set up anything at all. I don't need to set up an azure account. I need to do anything, I'm, just debugging everything locally and that's super duper nifty to be able to use so yeah.

A

Yeah, the overall kind of workflow is generally kind of happy with you know and I've seen. Some of these things evolve over time, but, like your function, tooling, pretty nice, the kind of being able to work offline, you know using the azure function, backend and storage and all that emulator locally, then deploy it up to Ezzor and then kind of the final steps of when we deployed it through Azure DevOps and had the kind of you know we had tests run on build and also then you know like we when we actually did go live.

A

We had this deployment slot swapping stuff set up. Rowen showed some of that last week, but you know the and a general build test, publish and it didn't publish until the test pass and all that kind of stuff, yeah.

B

And then yeah that's cool right, so we build tests, publish and then we're building it on an in Boonton machine because we said why not.

A

Platform and yeah yeah.

B

And then we had one for the function and then we also had a build pipeline or for that's for the website, one for the function- and you can put this all in one pipeline, but you know we had it in both, but it's very simple, like the azure functions, have build archive and publish, and what I liked about this is how we ended up doing it is we had another pipeline? That is two steps, so we don't have any auto deploys, but what we do have is a deploy function and then deploy the website.

B

Because- and here I think the function has to be approved. I think is how we did it. I forget.

A

I may have.

B

Turned it off so at one point you.

A

Might earn it off for.

B

Some point but yeah we have it on and then you can just easily sort of deploy everything and then I think every time we commit yet does push it out or whatever. So we should probably add that back.

B

So we had one thing: we'll do alive, pre-deployment approvals and we'll say either john galloway or jeans magno, and then now, if we get a pull request or we get something boom, we're gonna, you know actually wait for approval just saved, but new comments in there boom yeah and that's how we built it as your DevOps and we did it all. Like I said you can follow along all of it and what's crazy is we now John and I have production code running on the dotnet website? It's all live, it all happened. I want.

A

One of those cubes or something I want a glass cube to put on my shelf. There.

B

A

B

Line is all happening so boom there. You go so.

A

I had thought we didn't have a lot to cover we're actually, at an hour and 45 minutes, we should probably wrap up yeah.

B

Wait, oh I wanted to say one other thing about the stand up. We should probably tell people so also if one thing that we started to do we're working on it going everywhere, but we have closed captions now on Twitch, so you have anyone the knees, closed, captions or unique closed captions head over to twitch.tv, slash, visual studio and those are into the video and the video on-demand youtube. Of course will translate it afterwards. So if you see it on demand, it'll be there too, but these are coming in close captioning feed.

B

So I was like we did that for all the katana community stand-ups. Are there we're working on figuring out how to get them everywhere to all the sources but they're? Obviously, very every single source is very tricky to do, but this one at least works on tight, so you're good to go there. That's it yep, so John that is it. This.

A

Is wonderful? Well, thanks for being our guest today, thanks also for helping I mean, for you know, like pairing with me, to build this whole new website out, it's so exciting to have that yeah.

B

Thanks for letting me attempt to be pretend to be a web developer, your.

A

Running you have asp.net or 2.2 almost 3o code running in production, yeah.

B

A

B

Well, thanks everyone for tuning in lots of great comments. You have any you know. Questions hit me up on Twitter at J's want to magno at John, Galloway and boom boom boom boom you'd be good to go ray. Okay,.

A

Anything else we close it out all right, don't forget, I, think it's it's time for an exciting stinger here.

B