.Net Foundation .Net Community Standups, 16 Apr 2019

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: ASP.NET Community Standup - April 16th 2019 - Blazor Updates with Dan Roth and Steve Sanderson

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 for this week: https://www.one-tab.com/page/li5E8v32RTmqnu0etBYolA

Suggest an idea for a standup: http://aka.ms/dotnet-standup-suggestion

A

B

Yes, so this is quite exciting, love, punctuality. We have 66 watching already, oh, and so this is the part where it auto tweets from the dotnet foundation. Account then I retweet it from the asp net account, and I also.

C

Like it, some like it.

D

Has a life of its own, that's like leading us through our community stand up. Yes, yes,.

B

Oh Chris, is there Ed's era happy to be I will be showing posts from both of you. That is exciting hello, Shane. All these people, all our friends showing up this is this- is great excitement, so I'm like I'm, so excited to jump into the community news, but I realized. We probably should wait a second there's James.

B

This is like a little party, so this is the blazer show we have. We have Dan and Steve on hi. Everyone.

C

Steve is our disembodied voice. Today we don't get to see Steve. It's like it's like I, say on Steve. Are you with us? Are you there Steve I'm.

E

Gonna be with you intermittently I will be muting myself as much as I can, while I cough and splutter well, I heard.

B

Steve was growing his hair out, and so he just doesn't during the transitional. Hey we've.

C

All been doing that right, John, yes,.

B

Well, let me see you're 75, you know what I just I want to dig into their community links. I think it's time. Let's.

C

Give the community some love okay,.

B

I'm gonna share my screen. Let's just do this: cuz I am I'm honestly, I, love, community and I also cannot wait to see all the stuff you're gonna be showing off. So this one move this off the screen, and can you see my you see my screen here? I can.

C

See your screen awesome what about, but that's just me what about the masses, yeah.

B

Yeah that all works I see it on twitch awesome. Here we are okay, so this is cool Ilan sent this link over. This is Vaser. This is a community project and it is a look at blazer like razor pages support using Visual Basic. Yes,.

A

B

Yeah, so this is pretty cool, so I went through these steps. You know um you download a v6 and then it adds a new project type and here you've got Visual, Basic use, so I actually went through and and and did this I've got, I've got their demo app running.

D

C

D

Literals, like the VB.

C

Xml literals thing: it's like it.

D

Is it's like JSX.

C

Except it's it's like vbx yeah. Was that already thing there's already a vbx? Did we redo a PBX I, don't know I, don't think I, don't think I'm started with PBX VB. Well, he called it. Bb XML he's got a DB XML you're.

B

C

B

Right so here yeah there's this like virtual node. He has you so when you originally open the project, it'll show using the VBA editor, and then he has some tips here where you go through and open with the HTML editor and then you've got HTML, editing, syntax. The actual change here is relatively small.

B

It's it's adding in a adding in the view where is it as you're, not working here, a Vaser view provider and then other than that you know standard VB code and among all my browser's here, just kind of a standard iterating and showing showing students. So if you've got I think this is interesting. If you've got a VB, you know shop with a lot of VB expertise and are more comfortable with with VB. This is this is interesting to take a look at again community projects.

B

You know neat thing and that's all.

C

Server-Side rendered is that is that, yes,.

B

C

A server-side rendering tax, so it's like it's like razor ish but sort of inverted. Will you have your markup inside your VB server-side, rendering with a snake or yeah all right? That's cool, yeah,.

B

All right cool on to the next this so last week we had the the workers show with Glenn and Brady, and so here's actually a write-up of using workers with Azure container instances, so that was I believe this may be either an exact, an exact demo. He showed or kind of you know filling in the blanks. There was one thing that didn't completely work during because he wasn't able to share a screen. So I think that's that's actually what we're seeing here. So this is pretty cool just going through.

B

Creating a worker at deploying to Azure, contain your instances so neat to see the workers just chugging along and then and then you know, the ability to run this in a lightweight container instance eat so gun are showing here file uploads in an asp net core integration test course. Integration tests can be really useful for making sure that your your application code works with other dependencies and a file. Upload is a great example of a case where you're you know working with the file system and doing doing something that goes outside of your application code.

B

So here's here's showing how to do that, including making files available. So you know the simple thing that I always screw this up and have to you know: why has that file not there so making the file available so you're kind of goes through and explains how to do that, each from Ben I'm, just you know man. It just keeps going on every time, I'm like wow. This is the last big amazing update on performance for asp, net, core and and no here here is yet one more enormous one.

B

So just just you know, tweet based updates on on huge updates. This one is mostly from reusing headers. So so I forget the actual title for it, but you know tightly using static, headers, I believe which.

C

But you know which is which benchmark this one is. Is this the like plaintext benchmark? Do you do you know I, don't.

B

Know using a seen numbers that high I would think so I.

D

C

Know like when text has been so heavily optimized there wouldn't be much to grab, but that's that's yeah.

B

I'm not sure and I I dug through it. When this, when this came out, this actually is from the tenth. So, almost a week ago, I'm.

C

Familiar with like the benchmarks that we work with like we work with the second powered benchmarks and there's a whole bunch of them like there's one where you just try and spew out like hello world as fast as you can, there's others where you like. Try return of Jason payload, and that's that's one of the reasons why we're working on a new Jason stack and dotnet core 302 get some good optimizations there, hi Jan.

C

You're always welcome.

C

And then there's even ones that involve like the database and such so we yeah we do different optimized different parts of the stack for for those different benchmarks, and so it's interesting to see which yeah this one's I think that's plain text.

D

B

C

B

So one sub n was tweeting about we're, showing four million, so that's that's gonna, be one of the others. Probably.

C

Yeah and though you can see they're all in fact, those those are also heavily optimized at the top of the stack and that in the plaintext.

B

C

That they're, all like they're, probably hitting some some bottleneck like they're all coming.

B

Yeah stopping it to a point networking and we're.

C

Right up there, we're in there like, where are we at, is right. Well,.

D

Here it's number seven number.

C

Seven, there you go there, you go and then we've been working through the other ones to you know, push push ourselves up. The rankings and Ben.

B

May have been pointing also to the you can also see they have now a one where you can see I forget what they call it, but you can see constant benchmarks like they're they're, basically running all the time, so they do. Official benchmark runs on a regular basis, but you can also see the basically like they just run all the time now so.

C

B

C

The Olympics that have every now and then and then there's just everyone's like own personal time trials that you can always just post whenever you want to see them exactly good.

B

Stuff, okay, two posts here on on authentication and specifically this one is on as your b2c off so I actually ran through this recently we've been using this with membership for the.net foundation, so so this goes through and shows how to do that. So this is a.

B

This is a walkthrough on setting up with Azure Active Directory be to see there are several kind of steps to go through and do this, and so so in this post this this is showing kind of the this is showing the the hook up kind of this one's a little more high-level, and this one going on this one from Shaheed is a like way and depth one. So both these posts are good.

B

I I was happy to see both these come up and- and there were several lessons learned as we went through and set this up. I worked on this with Oren Novotny Oren wrote most of the complex code for it and there there's you know it's: it works well.

B

It was nice to be able to kind of outsource the identity provider, but there there were some things where there was a learning curve for me in terms of getting this set up but yeah, so she had walking through in detail he's done these these weekly posts, which I deeply appreciate.

B

So this is this a really nice one here at digging through so sure, heads post focuses a little more on your application code and so you'll see here on run down here, some of the things actually as far as like requiring authentication configuring that the actual, so here, for instance, you know where you can toggle and turn turn that on there's there's actually in the in the code we've set up, there's other things you can look at as far as you know, logout and keep me signed in and that kind of thing, so you can go pretty deep.

B

With this. The.

C

Thing I've always loved about the idea behind as rady b2c is like you know, all the concerns with with. If you use a spec or identity yourself, then well, the passwords are stored in your database. So it's your responsibility to make sure that those things I mean we. We do a lot of the work, the heavy lifting for you to make sure that those passwords are stored securely. But it's it's your problem now right because it's in it's in your app.

C

Where is it when you use Azure ad b2c, they're handling a lot of that for you they do a bunch of like fancy, AI smarts to detect like people trying to you know brute force, passwords and stuff like that. So you get a lot of like you know additional benefits around trying. Instead of trying to manage all that those I think very sensitive security concerns. Identity got concerns yourself, you just let a service handle it for you I. Do there were things I?

C

Did you find that it was a little a little hairy to set up? Is that kind of what I was hearing that the there were? Some bad yeah.

B

Yeah- and you know some that some exactly some steps, some things I found needed to be managed via PowerShell or or needed to be toggled via PowerShell. That kind of thing does the standard thing where you learn a new technology that you're not quite as interest or not as up to date with where I would find a blog post that was maybe a year or two old and it and things have changed since then. Yeah.

C

B

Are also a few little oddities as far as if somebody already has their own, their their MSA, their Microsoft account set up with their own Azure Active Directory. Then you can run into cases where it gets confused. Like.

C

B

Try and use the wrong one. The service.

C

Itself gets confused about who that.

B

Yeah overall pretty good, and it is neat like you're saying to be able, like you, can set password policies, you can setup two-factor off you can, you know, require password reset you can. You can basically like do all that admin kind of stuff without having to like exactly like you're saying I, don't want those passwords, I never want to have I, never want to store a password, and so.

C

When we, when we did, the original integration would be to see like we had envisioned that there would be a visual studio, tooling flow, where you can file new project, say I want to as your ad b2c and then it could handle provisioning for you, it's setting up the tenant and wiring it all up. Today you have to kind of bounce back and forth in Visual Studio and then the azure portal to get everything going. If, if that's a scenario that people are interested, let us know and that's something we can.

C

You know reach back out to the identity org and see, if that's a scenario that we can make easier ah interesting.

B

Yeah yeah, that's um I. Definitely having gone through this myself, for instance, things like making sure the callbacks are set up making sure is like setting up things like keep me signed in and stuff like that. Those are definitely things where, like you're saying, there's a little bounce back and forth, so yeah, cool and yeah definitely do. Let us know in the comments. If you have thoughts on then okay, this is interesting from genic.

B

This is a he's he's using javascript services, but he's created a template using create react app and the idea here is a very minimal set up, so it doesn't have all the typescript and server-side SSR I forget what that is. I, wonder if that's hot reload.

E

B

Rendering Thanks yeah so um so anyhow, this it's always interesting to see a an opinionated template. Honestly I, don't have an opinion on this I don't know, but I'm interested just kind of as some.

C

As he's come out, I wonder if this is sort of a reaction to the us adding typescript to our we decide. We had a. We had to make a choice. We didn't want to support Bo, so we're like well. Should we do typescript a note, I skipped, we went with high script and I know not everyone uses type script. I know that's hard to believe, but but fortunately.

E

Access in here.

C

E

That you start scripture Richard, we did use scratch originally and then loads of people's told us off and said that was the wrong thing to do and the react community was basically not a doctor. Yet so we removed to typescript and standardized and then the react community did adopt typescript. So we added it and re standardized. I guess you know, people will always their own different ways of doing stuff.

B

Right, yeah, well and I, think that is neat that here, it's possible to have an opinionated template. But then you know I did dig through the code and it is using JavaScript services and it is you know what I mean, so things are factored in a way where people don't have to say use the Microsoft provided template or do it all yourself? You know this is a. This is a way to say.

B

Well, I like this in this, but I want to take this these parts out and so yeah, so I'm I'm interested to you know partly I, like sharing links with this, as people are starting on something and then there's going to be some people watching that are writing react apps all day long and they can dig in and they can. You know either get feedback or or say hey. This is exactly what I wanted, so cool all right, Andrew Locke, two interesting posts.

B

These are on avoiding I, don't know if either of you folks saw this I thought this was an interesting series. This is on.

B

So the problem he shows is if you've got something like an int, ID or a good ID. So here he has, he has both a product or excuse me an order. Id and a user. Id are both goods and he shows a case where you're accepting you're accepting both- and you know both of those goods and it's possible to pass them in in the wrong order.

B

So he actually I'm spoiling the surprise for you if you, if you've, because this is written a bit as a quiz like do you spot the code error and the the code error- is that you're actually passing them in swapping the order and you're passing and the user ID as the order ID and vice versa. So so that's that's kind of the problem.

B

Is that they're not strongly typed as IDs, and this isn't directly a an asp net issue like this kind of code problem could occur in any application right, but there are some some asp net specific places where this comes up, things like model, binding and and javascript, serialization and stuff. So then so he goes through, and you know talks about this. This issue, where, if you're just using primitive they're, not strongly typed in you're, not able to to tell if an int wedding in is, is it an order ID? Is it a number of monkeys?

B

What is it you know? So so he talks about using strongly strongly typed to IDs and creating an order ID class.

B

So so this is, you know it goes through and shows us off and then talks about how you know he's not totally happy with this and some some places where you run into issues with things like binding.

B

So then part two where he goes through and in talks about a more kind of complex one and more sophisticated one and shows things like creating your binders, so fixing things like Java same API is making it so that you're Jason, you know using a JSON converter so that your internal implementation doesn't mess with the serialization and then later on in here. He shows also for things like route constraints. Now.

C

So it could be a language there's some languages that have a feature like this. We're like.

E

Oh yeah you're.

C

Right but they're like, but you can say that this is not just any old string. This is a you know, a password string or whatever it is.

B

So um so just wrapping up on this and then I'll that's that's kind of the the dramatic conclusion.

E

B

So here he goes through and his solution here does end up with a bunch of boilerplate code, and so he shows he shows a snippet that he's created that creates that boilerplate for you. So you know my thought on this was like hey yeah. Isn't there a way to I? Don't know, do something smart with generics or whatever and, like you said, everybody that's ever used. F sharp is like facepalm in it saying this is easy. I did have Daniel who works on the Facebook react stuff. He on Twitter told me like that's.

B

That is a language feature, other other languages have called opaque type aliases, and so basically, with that you say like I'm, creating a user ID, that's it's an opaque type of an int and it it doesn't have to do anything boilerplate. It behaves as an int, but you can strongly type it and there actually is a language feature. Suggestion going back to I, believe 2015 and it's kind of been floating around and and I don't see.

B

It looks like it's unscheduled and then there's people also talked about source generators as a solution here, which I guess is a you know, an upcoming c-sharp feature so yeah so I'm interested- and this also partly was I- was curious and I'm interested to see with any of these things. People will will, you know, say, like I I solved this three years ago and here's here's a smart way to do it so nothing wrong with that. Yeah I'm having.

C

A smart way to do it, that's already been done. That's all yeah.

B

So yeah, so that's that is interesting and that's something where I was I was like and couldn't you is there some way to like even attribute an ID and have that kind of flow? Through you know, and so so it would be an int, but it would be attributed as a order. Id you know, and but I don't know. This is a place where I'm like yeah, I, guess I wish I knew the in depth plumbing of the type system a bit more bright, so Chris auntie, who I believe was on the chat.

B

So this was a cool post on getting started with typescript for Jessie, J's, Interop and blazer. So a blazer has support for J's Interop, and here he's talking about using typescript, which I think makes you know sense. It's nice to be able to write c-sharp and have have strongly typed code for everything and then the places where you do need to use JavaScript. It would be great to have the strong typing and the other language features you get in typescript as well.

B

So here he's talking about converting code over and you know using using typescript and then how we set up is build in order to do that. So um you know setting up you know things like your typescript tools and and and stuff typescript compilation, so yeah I thought that was cool all right and yes, we've transitioned to the blazer part of the Lynx. So I always I have to point this out.

B

This is this: is the blazer community resources on blazer net tons of stuff every time I go back here, there's just more and more so I, it's really cool to see that it's updated. If you want to see what's new here's a trick you can do, is you click on this improve this doc link, and that takes you over to the github repo? And this is this is just marked down and you can do things like, for instance, here.

B

This shows where my whole showed updates for for the DevExpress, both the training and the razor components that they've contributed. So you know you can go through and you can take a look at all. The kind of updates here. Blazer revealed book so that you know it's it's cool to kind of go through and get that kind of updates on on. What's changed, I've.

C

Been reading through blazer reveal.

C

B

Cool very cool, so so yeah so to wrap up here, there's a bunch of new components that that um that we've seen released and so I just wanted to point some of those out DevExpress so they've they blogged about some new components. So this is an early access preview. This talks about you know explaining what Blazer is explaining the client and server side models, talking about razor components and then ending with here are the DevExpress UI for blazer and razor components. Nice.

A

B

So, and and a very cool demo, you know you can go through and you can. You can take a look. So this has all the different know, grids and pagers, and editors and all that stuff, so good, stuff and I'm not sure it's taken a bit to load, and that might be my fault. So if I go through here is like really.

C

Posting the DevExpress demo yeah okay, here we go yeah.

B

Yeah there it is so I'm yeah so need to see. You know it's I think this is I'm, not even sure if, if you folks like saw this as a huge value, but the component model that is available with with laser and razor components is really interesting, and it unlocks a lot of things that the vendors used to provide historically for dotnet developers, and it's it's really cool to see.

B

You know bill building, it's cool that I can go and build a component, but building a full-featured component is a lot of work and supporting things like theming and localization, and you know in-depth reporting features and all that kind of stuff, and so it's cool that component vendors- who you know, have done this for years and have learned the hard lessons it's cool to see when they jump in and provide you know, professional professional implementations. You.

C

Just drop it in and use it yeah. This is exactly what I would was hoping would happen with blazer that we would, you know, start build up a you know, an ecosystem of component libraries that you can just reach out into new, get and find them and add them to your app and and build up rich UI and a really easy composable way. That was one of the things we were trying to accomplish. We've had that with older net stacks and I.

C

Think with the you know, with ace man, a spec core, we kind of had lost a little bit of that sort of composability, and we've been trying to pull that back with blazer yeah.

B

Yep cool yeah, here's an example: you know things like working with a large data source. You know so there's with all these. You know pivot grid and a grid and and people are doing that this is using over a gigabyte of data right, so those kind of advanced components in areas. It's really really um something that I've I'm messed with building these a long time ago. Oh man, this those with WinForms, apps and building a full-featured component, that's performant and stuff. Is it's not easy?

B

So so there's a lot of work behind the scenes that goes on and.

C

I believe the DevExpress ones that they are like the their life site is done using the server-side blazer, like it's all there, hosting their components or that site on the server I believe and then all the UI interactions that you see with the DevExpress site, with their demo site, is all being handled over that WebSocket connection over a signal. Our connect, it's interesting like I, was trying it I was like okay.

C

How much can you tell like how much can you feel you know a little latency and it's it's good like it's really good, like I I, still, I'm, always surprised when I, when I try out a server-side blazer based app how natural it feels, even though all those UI interactions are actually going over the wire yeah.

B

Yeah and and it's I love the model that I can toggle between them relatively easily too so I could develop using server-side and then switch over to client-side and and it's not a big deal, yeah cool, all right sink fusion, so here here says sink fusion I.

B

They just introduced these on the 10th so that these are some some this you know every post I've noticed the three vendors I'm showing off here all three kind of they need to explain the what the model is and and explaining what what blazer is so introducing both both the models. So then, this talks they've got over 60 UI controls, so so this walks you're getting them, set up how to set those up and install them and there's a github repo with with the source code and then here's here's an example.

B

So you can go through and you can see the different, the different controls you can. You know, navigate through I love. These you know for a component, I'd love to be able to see, you know see an actual component. How does it function and how does it do things like work with different themes right? So here's here's some of those and if I can go, and you know the I I liked there that there's an example of a high contrast right, so so those sorts of different cases.

B

You know where maybe you're I could see these being used. You know when I go and pick up a rental car. Some I would love to not see people typing away on the on those terrible old consoles, or you know, I'd love to see some of those contribute. So maybe I could see somebody using a high contrast, theme and I think I've, accessibility.

C

Right absolutely.

B

Yeah yeah, who.

C

Need the extra contrast, yeah I think so from I understand. I. Forgive me forgot this wrong. I think the sync fusion guys like what they did is they had a bunch of components that were written in JavaScript already and then they use JavaScript Interop to shrink wrap them in as Blaser components, I below.

B

The implementation.

C

Strategy they took I think the DevExpress.

B

C

And telluric I think it did a similar thing day. They went pure down at il I think they may like implemented new components. All in you know, C, sharp and and.net. So it's interesting to see those different different strategies, but if you have existing.

B

C

Javascript that you want to just use like you, can do that and make them easily accessible from blazer apps. That's just a you know again drop in nougat package wire it up and you got a component. ah That's.

B

That's really good to know. Okay, so yeah like it's. It does call that out here that those are so Dave expose these JavaScript components to blazer developers, and you can use them using c-sharp code to turn them on to it to work with them. Yeah.

C

I mean they are they're. Just there are components, there's yeah the covers in their guts. Their implementation is just their existing JavaScript implementations from a.net developer. You can't tell like, as far as I.

B

C

Just just a component: it's a thing that you use in the in a blazer app it's net c-sharp, but under the covers they were able to leverage their existing JavaScript assets, which is great I mean that's that's what that javascript interrupt mechanism is for yeah.

B

Very cool all right, so then Edie who's on the chat here and has been providing links and stuff and also has a really cool show. He has a twitch show I believe it's on Fridays and so we're he's he's been doing a lot of well, my audio cut out and I hope I'm still there, okay yeah. So it's been doing twitch presentations on telluric on on blaze, err, sorry, here's!

B

Here's! A recent post on grid component basics, there's been a series where they've been talking about their there, the telluric controls for blazer. So this is walking through setting that up. So this is kind of a more in-depth. You know all the things you can tweak and set up with a with grid, and then again this is this is their. You know this is theirs, so there's some pretty fun ones here, there's like animations!

B

There are things like you know, so, like there's also grids and I. Think another really interesting thing is charts. Charting is something that you know have having a chart in your application that works. Well. Is it's um there's really helpful, especially you know a dashboard or whatever charts really really are helpful and again here I love this playing with the different themes here. So you know bootstrap and material and default so yeah.

B

So so this that's kind of my wrap-up of my Community Links and as always, I'd love if, if you've got others you'd love to you know like to share, let me know and I will share the link for these in the show notes, and also in the chat and back to you back.

C

To me, alright, alright, so uh I guess we want to talk about some. What what's what's new with blazer like? What's what's happening? What have we been doing since we shipped dotnet core 3, Oh preview, 3 and blazer 0.9, so we're gonna show a few things for that I see some people in the chat are asking our you're checking the chat, and, yes, we see everything that you write. Every word so feel free the chat away.

C

We want to hear what you guys think about this stuff, so we've been working on the next update, tunic or threa, which is pre before, which should ship eminently like soon, hopefully, very soon, I mean knock on wood.

C

Don't have don't have exact date to share with you, but it we're pretty much done with their preview for bits and, of course, along with it the next blazer update. So that's what I want to show you a little bit now so I'm gonna switch over to my to my laptop.

C

Hopefully, you guys can all see that now down here at the bottom, I hope we can see all my visual Studios, like I'm, very proud of this I've got like they're enduring and they're an order of ascending preview, Ness and descending stability. Of course.

C

So like this first one is a that's BS, 2019 and then I think this one's the preview Channel and then I've got like our internal preview channel that we use for like dog, booting and then I got this crazy, like what a random dev build of a Visual Studio 2019 of the next preview update. So let's.

A

C

Craziest one I think, is what we'll do for this set of a set of demos. I'll show you the latest greatest bits. I also have the latest nightly build at least well pretty recent nightly build of dotnet core through yo installed. You want to get this yourself, you actually I mean these are all public I, don't know if people know how to get the the latest builds of dotnet core 300, but the way I usually do I usually start on the well. That's just starting.

C

You go to dotnet core SDK core SDK, that's the magic URL, just a repo on github and then down below you'll see this grid, which has all the new core build status. The the first column is like the latest up, that's in master and that's actually, if you look, you can see, that's actually already gone to preview 5, but the second column. Those are the latest preview for builds like those are the you know, candidate release builds for for preview. For so you can just check on the Installer there. It looks like I'm.

C

A couple builds old I'm on two one: six and the latest ones, two and eight, but we're getting pretty close to being done with that. So I've installed that got I'm on the preview channel of a vs 2019, that's important. If you're on just the stable channel the release channel for 2019, the release channel doesn't pick up preview versions, of.net core anymore, like I used to be the case. It used to be you just install the preview and Bs would pick it up. They stopped doing that in the stable releases of vs.

C

You have to go check a checkbox and your setting someplace for it to pick up preview versions of the.net core SDK, so we actually recommend like with dotnet choreo and with blazer. You should be on the preview channel just get on the preview channel stay up-to-date for now. That's that's the bits that you'll want to use with with blazer and, as you can see they these things install side by side. I've got like you know. Ridiculous number of BS is installed on my machine and I've never had any issue works great okay.

C

So, let's take a look at some stuff: we wanted to go to the crazy random, build of Visual Studio file, new project and let's talk about blazer, so blazer is actually let me call this place or app. One I think is now basically in the Box in dotnet core Rio.

C

Now, when we, when we started blazer as an experiment, we we played around with the alternative hosting models like we started with, with hosting blazer apps directly in the browser and web assembly, and then we did it some experiments with what, if you could host the components on the server, but you managed all the UI interactions over a signal, our connection and we called that server-side blazer and that was didn't, have a web assembly dependency, and so actually it was easier for us to ship that first and just go ahead and get the you know finish.

C

The component model support a server-side hosting model and just get those bits into people's hands. We asked the community if that was something they were interested in and about half of our blazer users said yeah that sounds great. I was, in fact I'm in many cases. People said I actually would prefer that model for a variety of reasons. Some people like that, the fact that their code stays on the server some people like the fact that doesn't require web assembly in the browser.

C

You can use older browsers with server-side blazer a bunch of reasons, but we decided to go ahead and ship it now when we moved it into dotnet core 3. Oh, we decided that we had to give it a new name and the part of the reason for that was well. Blazer was this experimental thing that was running on web assembly and we didn't want to put something that was, you know, experimental into dotnet core 3 Oh, dr.

C

Correa was a shipping product, so at the time we said, ah we should probably give it a new name. So we get we caught started, calling it asp.net core Razer components that unfortunately caused quite a bit of confusion. Ecosystem, sorry, I'm, sorry, everyone! It was with good intentions, but very few people can figure out. When do you refer to raise your components? And when do you refer to blazer?

C

So we've decided to you know, revert, get revert on that one. Let's go back and just start calling everything blazer. Now there is one thing that also made that decision. A lot easier, which is the the end of the experiment, is in sight. Let that blazer as they just an experiment, something that we're playing around with is pretty much done.

C

I'm, not gonna, say this is the official announcement right now, but I I think we're about ready about ready to ship our first official blazer preview release something that is on an actual roadmap to ship as a as a support product and by black blazer. In this context, I mean blazer on webassembly dotnet in the browser running on web assembly, that we are really close to doing that.

C

So that also made the decision easier to say: okay, Blazers a thing, let's just call it blazer across the board, there's blazer on the server blazer on the client. So you can see now the template, the individual studio says blazer server side for the. What used to be the razor components. Template is now blazer server-side in this latest release. We've done that in the SDK on the CLI, we've also done it in visual studio. The visual studio changes is coming in the next preview update to vs 2019 16.1.

C

Well, that should come out, hopefully later this this month. If you're on the preview channel of vs 2019, that's great, you should be there initially when Donna core 3 o Creek before comes out. You may see it still show up as racial components and that's just because we need to do a vs update to to get the strings and BS to change. So that will happen with the just next update to the preview channel. You'll, see you'll, see this flip over to the two server site: blazer, but don't freak out.

C

If you see it still show up as razor components, it's the same template the strings. Just haven't changed in visual studio with the 16.1 preview, one release they will update with preview too. So, hopefully, in just like a few weeks, you'll see server-side play so let's go ahead and and create one of those and take a look at the updated template all.

B

Right people are, people are noticing some interesting and then, when.

C

Let's go back, did you notice the cool icon? You see it purple, people did and they loved it. What do you people think? It's you like it? It's it so I, don't know exactly it's a it's an @ sign in there enough people get that like this. That's that's! You know. When you write razor razor code, you use the @ sign. So it's an app with a purple flame. That's yeah! That's new! We've updated a given an icon to all the blazer templates and also to the b6.

C

So yeah, it's pretty it's pretty hot, literally okay. So what is the template? Look like now. Hopefully, you'll notice that the server-side blazer templates being been cleaned up like before we had a components folder- and there were some weird stuff in the project file to say that see. Html files could still be used as components. We've now cleaned everything up, it's it's dot, razor as the file extension across the board. Now, for all of your your components, there's no longer a separate components.

C

Folder the the server-side blazer templates, been cleaned up to a line with the client-side blazer template. So that's cool, but if you look in these files they all look the same as if, as they always looked like this is this is the standard counter component that we've always had. You know fetch data for like fetching the weather forecast data. That's that's all the same. Let me just go ahead and run their app to show you that, yes, this is in fact building and running.

C

We'll get the browser up, so we can see some some pixels and close some tabs yeah, okay, so same stuff that we've been showing forever. You know we got a counter. They can click on fetch data that fetches the data from on the server and then renders to this table. This is all running server-side. This isn't the web assembly a template. This is the Blazer server-side template over over signal are okay, so that's all been nicely cleaned up.

C

You'll! Also well we'll get to this in a bit, but you'll notice. There is still a CS HTML file in the in the template. What is that? Well, that's just actually a normal razor page like like you would have in a a spinet core app, and so it's it's CS HTML as opposed to dot razor, because it's not it's not a component, but this is what's being used to actually host the server-side blazer app that this is where the the code lives for wiring up the the bootstrapping script.

C

That sets up the signal, our connection and also the code for saying. Here's where I want my my blazer route, blazer component, to render on the page we'll talk a little bit more about this in a second about what this is doing. Cuz there's some interesting stuff in there, but I want to show you some of the new tooling improvements that we've been working on.

C

One thing: that's nice is how you can how you bring components into scope, how you how the compiler now resolves components, we've aligned components with the way you normally would think about types like types are normally based off of namespaces. You reference some assembly that has types. If the namespace is in scope, then you can use that type. If it's not in scope. Well, you can still use the type you just have to use the full name of the type we've done, the same thing now with components.

C

So if I want to add a counter component on to this page, I can start typing counter and you'll see that the completions that are being offered me are both the just counter, which is the you know, the type name for the counter component or the full name of the the counter type Blaser app 1 dot pages. That counter and both work like, let's try the the new version, where you put the the namespace qualified version of the type. If we go back to the app and just refresh talked about this UI in a second.

C

This is interesting, the attempting to reconnect, and if we go to the home page, you can see yet we've got a counter component on the home page. Both syntaxes work, just fine, so don't freak out if you're, like oh I, like the shorter syntax, well yeah of.

B

C

Works because the namespace is in scope, so, if I write save this now go back, let's refresh the app I should now have to counter components, and yes, I do okay. So the way this is working now is be using statements that you have in scope for your app or whatever namespaces are in scope. Those are used to resolve which components can be used on that that page. You know to really drive this home. Let's add a component class library to this solution, so I'm gonna add a new project.

C

Let's go into the HTML core. It's called this a component component Lib one and I'm just going to create a RZR class library, RAZR class libraries or class libraries that are set up with the Razr SDK, so they can compile things like views pages and also components on there. I've got a new class library project. Added to my solution. I'm gonna delete this area of solder. I, don't need that that has a bunch of razor page of stuff that I'm not going to use I'm just gonna add a component.

C

It's a simple way to do that. I'm. Just gonna. Add a class and I'm gonna call it my component 1 dot razor and then delete all the content. Okay, so, let's add a little content in here my component 1 and let's have a little razor syntax. Just so this component does something interesting. What do want to do?

C

Let's give it a couple of parameters: I'm going to need a namespace to do that so at using a static or components great and then, let's add a parameter here, for what I'm gonna do is just gonna have a component that, like generates a list of items based on a message that you specify an account that you specify so, let's add a property here which will be the count by default. It will do 1 and parameters generally should not be public.

C

So with the public thing, let's add another parameter, which will be a string and that'll be the message that I'm going to repeat, and by default that's called. Have it be repeat me like that? Ok and again this should be public and then up above, let's just completely implement the logic for our component puts out an on over the list and then for two count. Great and then add a list item in here and we'll just print the message.

C

Ok, so I've got a component there, it's in a class library, let's use it from our app I'm. Gonna. Add a reference to this component to this component library now referencing the assembly, so the the type my component one should now be a scope as long as the namespace is in scope. Let's, let's see if that works. If I go back to my apps index page and start typing, my component 1, you can see by default, the namespace hasn't been specified. Users are using, but I can still specify the full type name by default.

C

Why won't can't I uh-huh I? Can't there we go. Let's see, let's put count, equals five, a mess which equals do it again. Okay, save that if we go back to the app then it rebuild, we should see. Hopefully our yeah there's our my component once showing.

B

C

I don't have to like before you had to like add tag helper and some SMI the assembly and where you want to import components from that's all gone like it's now: just assembly, references and type names and normal using statements. If I don't want to have to specify the full name of the type here. I just add a using statement so that using component component live one and then I can, in addition to doing the full name of the type I can now to specify my component one so that that should work as well.

C

B

Sure that it does so.

C

It can't let's do three and which we do for message. Yo that way, we should have yo yo.

A

C

The back and we should see the component- show up again awesome yeah. So now we got to my components, one using the you know, just the type name when using the fully qualified type. So.

B

C

B

Got a few questions come in. Do you mind if I jump in and those real, quick, okay, yeah all right? So question is what so I'm, not sure exactly what this one means here. Is there still a lingering issue with pre-rendering and events, I'm gonna.

C

Talk about that, we will get it okay,.

B

C

We'll talk about rendering this app just give me give me one. Second, I want to show one more thing: what is there not another I'm gonna poop on that one I'll come back to it. Okay,.

B

There are a few few others. Can you alias namespaces to avoid collisions? That's.

C

A great question, I think so like see at using equals. Does this work yeah that seems to work and then I don't know if they will pick it up here? Will it pick it up here? Doesn't look like we, we honor that yet just even I am I doing that right, yeah.

E

I'm not aware that that's something that's been implemented it. Would it wouldn't just work? What about? I don't have to do something we tweak.

C

We don't have anything yet sorry: okay, a.

B

Question, if you can separate out for these components or you can separate out c-sharp and the HTML we've got.

C

A second a long, long time, a lot of people, they see the the code in the the component like this is my component one, and they see this code here and they're like ah I, really like to have that in a code behind file. Absolutely you can do that so, like the way I. Normally. The way you can do it today is I would add a what my component 1 dot razor dot. Cs. That's the no way we normally name the file on there.

C

It doesn't nest with its in a razor class library, that's probably because it doesn't use the web SDK, but normally if it was in a web app, he would nest. And then you would have this be like your base type.

E

In you didn't oh I,.

C

Messed up the time, thank you, which was.

E

C

One there we go in component, one the base and then derive from component no.

E

You want to inherit the other way.

C

For the base class of the like that, this is your best class, so inherit from the wall start the merit from the I know, but this class has to inherit from component base. Does it I'm.

E

Sorry, that's like you very narrative. Sorry I'm just am I.

C

Doing wrong so, if I doing wrong I'm, sorry no I think I think it's this way so my component base and then this would derive from component a so. This is a component.

E

C

This ok, and so now you would move your code in here like you would basically take the functions block out of here and move it over here. I'm sorry is going to take to take a second and then in the class file. You would then inherit from that now. This is an inheritance model, so you'd have to make things protected instead of private and all that stuff.

C

But if you say inherits from you know my component 1 dot base, then the the class that gets generated from my component 1 dot razor will now have the members from the the base type I. Think that's is that right, Steve yeah.

E

That's correct, yeah, onions.

C

E

Nice to do they normally.

C

Hit: here's that these properties, because I had to find them as private, like they're, not showing up so I, have to now go back and they'll make the protected and I messed up. One of my properties, apparently a string message and make this protected and save it, and now these guys should go yeah. So then that's that's the pattern that you can use today in the future. We want to make it so that these are partial classes, so that we can, you know just compile them together.

C

That's something that we're working on for hopefully to the next next preview update or the one after I can't remember, which one it we thought I think I think we said we could get it in for preview. Five I think.

E

It was previous six previous six.

C

E

B

One one last question and then I'll: let you get back to your thing: the why the extension of host? Why is that still CS HTML or why is that CS, HTML and not razor okay,.

C

Let's go ahead and talk about that. So host is just a normal razor page: it's not a component, it's just a normal razor page like you would do with an a snake or web app. It's the page that we're using to host the components for the application, and so this page actually will like you do when you make a request to the application. This is the page that it R initially runs. This is an instead of, for example, having an index.html file, just a static HTML file.

C

Instead, we actually have a you know: server rendered razor page that we're using for the initial render of the app and then by calling HTML that render component async. The all of the components are also being pre rendered with that page. So the first request not only gets the the content of this page and the script. It also gets all the pre-rendered component content as well.

C

Well like before what would happen if you didn't have a pre meandering, you would just get like say this app element marker in the initial render of the app and then we would set up the signal. Our connection talk to the server, get ask the components to read them themselves and then update the Dom later.

C

The nice thing about pre-rendering is: it means that all the content is statically available for things like you know, web crawlers, you know anything that wants to be able just make a request to the site and see the content that just works. So, if I look, if I refresh this app and look at its source, we see that you know all the component content is here like there's all you know. My components is in that.

C

In that initial request, we we got all that content right out of the right out of the box like it just it just just happened, as opposed to only seeing, for example, app.

B

C

App element and then having that get updated later, does that mean.

B

That's pre-rendering.

C

We added pre-rendering support in actually in preview 3, like we had started doing this pattern with the server-side blazer template in preview 3. What some things that are new, though in preview 4, is that in preview 3 after that initial render, when the signal our connection then got setup, he would ask the server to render the components again and then it would basically kind of blow away the the Dom content that was there and render you basically render twice in order to get that initial setup for the page.

C

What we do now is we will actually do a stateful reconnection back to the server to say you know I, you already rendered me. Can I reconnect connect back now to that state and reuse that state again for for this application, so I don't have to redo it all again.

C

So if you, if you set up some initial state, then it should still be there, like as an example of that, let me go back to the app let's, let's clear out a little bit from from the home page is a little busy now, let's just have a counter, but in counter, let's add it like some some initial state that we can pass in like if we add a parameter here, like initial account and let's make it 0 by default, ok and then, let's override on an it and there's a formatting bug, fix that okay and then, if we set the current count initially to be initial account.

C

Okay, now we can pass in an initial account where we want the counter to start at. If we now go back to our index page and let's say that we want this.

C

Actually what we can do even better is we can have even multiple components that we render in the Razr page like you can use components safely and with a stateful reconnection from your razor pages. This is really like. I think some people are wondering like oh, is, is it dude? Do I no longer use NBC, do I no longer use razor pages, and is it all now components?

C

The answer is no like these things actually compose together, like if I want to add a counter right here, let's head at the top, it's out of like a div and, let's add a weight, the HTML render sink and, let's add a counter component right here and then here we can also pass in some initial state, so I'm gonna we can. We can set parameters using a an anonymous object. So let's do initial state equals an out of 10 all right and save that good?

C

Okay, let's go back to the application and close this, and so hopefully we should now see our app and above it we should see an you know, just a crack. What I do does not have a property initial counts.

A

C

Lack of strong typing in this case right shall count all right. Just a rock does not have initials.

C

There's a there's, an issue with the auto rebuild with this latest tooling, that doesn't work with the the razor pages, so I actually have to rerun it. Okay, great! So at the top see we have a counter component rendered directly from the razor page, and it has that initial state and it was preserved like a what didn't get like blown away on the non the next render it sits there. So you can now render stateful components as from from any razor page and have that just work. Yeah.

B

That thing you pointed out, I think is really like. You said it's really powerful to know that you you can just sprinkle in if you just want a blazer component in a razor page or in a razor application, razor pages application- you don't have to rebuild and rewrite like I saw that long ago, I did a lot of Silverlight, dev and I saw people would like try and write an entire website with all the navigation and everything in Silverlight. It's like. Why would you do that?

B

Just all you needed was a video player or all you need. You know what I mean and.

C

B

Like sprinkle in just like target the right thing, you're writing a mostly HTML website and you have one page: it's a dashboard with some charts, just put your grid and charts in as Blaser components. You.

C

B

Pick and choose enables.

C

That Center exactly right now I want to make sure I know I want to make sure I answer the question about pre-rendering and like dealing with events, because I know that's been an issue for some people.

C

Often, what happens is because, because we're pre-rendering the app well on the add initial render, you don't have a connection set up between the browser and the server you're doing the initial render you're putting bringing down if the the first batch of HTML so that you can set up that signal our connection, and so, if you had code in your components that was trying to do say, JavaScript Interop. Well, you don't have any code running on the browser, even yet, so that code would didn't just fail.

C

So one of the pieces of feedback we got with preview 3 is it would be nice if there was a way you could tell that you were pre rendering and that it'd be nice. If there was a way that you could delay any initialization code that you needed to run, that required, JavaScript Interop to a later stage after the pre-rendering had completed and after the the app was now connected, so you can do that now. If we go, let's go to to like a index dot razor.

C

If we want to know that this app is pre-rendering, there's a new service that you can use to do that. You cannot inject an I component context. I'll just call this component context and then, if we put in here, let's put a header to component context that is connected. So this property will tell you: is the app currently set up with a live connection between the the browser and the server.

C

So let's do is connected after marking that okay and then now, when that the app renders it'll render what-what the state for whether you're connected or not. If you then want to know that the connect when the connection has been established, the right place to do that will be in the on after render async event override.

C

I'm, after renderer event, ah crazy formatting. This is a crazy night to build with yes, okay, so this event will now we guarantee that this will fire only after the connection has been set up and you can now and you're ready to do JavaScript Interop. So you should delay any JavaScript, Interop logic that you have until this point and I think I don't know. Isis complaining is playing cuz. This.

E

Has to be locked, protected, yeah, okay, great yeah,.

C

So if you have JavaScript Interop, you would do it here that you need for initialization. This will only happen after the pre-rendering has completed, so that will help you out just to see that this. This works I'm also going to put a button here with an onclick handler, so that we can refresh the the rendering of the page to see that the is connected has two issues switches to true. After the app has connected and I'll just put a little dummy like function in here.

A

C

And then refresh so by clicking this button, this refresh button that should force a the component to re-render, because we always we render after a click. Let's.

E

Let's do there is actually an extra right, yeah yeah.

C

Oh thanks. Alright, no I hope my friend here the beginner yeah was right. Wasn't it that's right yeah, it looks right, yeah, that's right! Okay, great extreme programming,.

C

Okay, so initially during the pre-render phase, we're not connected because we're rendering from the server so connected as fall. So if we click refresh then now it knows that the connection has been established and we're now connected to the server so and then put all of your stuff that you need to happen after the connection has happened in on after render async. So hopefully that will help out, with some of the pain points that people had with the pre-rendering support that we had in preview 3.

C

B

Others one more one more question: that's come up quite a bit, which is support for authentication, so.

C

Yeah authentication is something we've been working around already like Steve X has been done, I've done a bunch of design work on what we want to do in the authentication space we haven't implemented it. Yet we did the design work and now we've queued up the implementation. Work I think we've cute that one up for preview 6 as well. So probably you know May June June timeframe is when we would expect that to ship I, Steve I, don't know if you want to mention a thing to do about what you're thinking there I'm.

E

Sure, ok, so the basic idea with the authentication is that for server-side Blaser we will completely piggyback on the existing authentication and authorization work that is that exists inside a spinnaker already. So whatever your HTTP context start user is that will be the user that we claim. You are to all your components.

E

We will add a little bit of new stuff. To that we'll add some service or event. You can subscribe to to be notified when the current music changes. That's a new thing for server-side SP that core, because in the past the currently logged in user never changed like because the entire process only was the duration of a single request. But now the user is connected, stateful II for a long time they might log in and now there's different people. So you might need to get notifications about and then for client-side execution.

E

We are going to provide some abstractions that allow you to provide your own way of defining who the current user is built into. The template will be a suggested way of doing that. That relies on server-side logic. If you are wanting to apply a completely standalone, Blaser client side, app that doesn't have any Dom met on the server or- and obviously you weren't well to use that, and it would be up to you to provide your own different implementation of the interface that defines who a person actually is at any given moment.

E

We will also provide a bunch of built-in components that make it easy to display different content, depending on whether the users logged in whether they're in certain roles or have certain claims or whether they satisfy different policies.

C

Yeah being a full authentication and authorization story coming up and then probably like probably two previews from now, I won't be in pretty for we've done. We did a lot of design work and pre before preview.

C

Five will probably be pretty short milestone, so I'm not gonna, squeeze it in there but early summer for us, when a Jewish time frame I think he can expect a first uh first draft, I guess our first implementation of the the often authorization work, cool, I, see also a question about is connected, and what does that mean in the wasm world in the web assembly world? Well, there's no connection like in a web assembly based application, you're running completely in the browser, so it just always Iblees always returns. True. Is that right, Steve yeah.

E

C

Always true cool a couple more things: John, just uh yeah. Sorry, so I probably noticed that as I was like editing code like about an internal random random edit to this file, I'm saving and then over in the browser is something the UI like changes is like I'm tempting to reconnect to the server like what? What is that like? What is going on there? Well remember: server-side, blazer apps are a connected model like they record. The UI requires a connection to the server in order to function. Now this build of Visual Studio.

C

Has the auto rebuild re-enabled again. So that's that's good! That's coming back where you edit the code, you save it detects the change and then kills the app rebuilds. It restarts it, and then you just refresh the browser to see that the the changes so every time I'm editing a file. Then the server is actually being killed. The gaius Express is being being shut down, and so the connection is being lost and the app is detecting that that's important right.

C

If you have a user who's using the app and they lose their connection, the apps not functioning. You need to give them some sort of feedback that the app is currently in in a in a functioning state. Now the app will try to reconnect that's new in this release. It has a reconnection logic. Well, it'll, try to reconnect back to the server ending reconnect to the back to the same state that that it was using previously.

C

If it can't do that, then you end up with this version of the UI, where it's like, hey I, tried to reconnect I wasn't able to you can click the botton to try again in this case. Obviously that won't work, because the the server is not even up like the the state that I had before got lost when the server was taken down and pulled up again, but if we do a full refresh to the browser we're back and connected.

C

We're now pointed at the the Ice Express instance that came back up after it was rebuilt and restarted if I were to simulate say, like a network connection drop, let's see what that happens, then. So there is a API that can do to to sort of kill the WebSocket connection. That's currently being used. What is it like window blazer and it's some internal API? It's not not something that you would use in your app, but for this little demo purposes it works this.

C

The forced closed connection will kill the WebSocket connection, but it leaves the server running like Ice. Express is still there. The state that's being managed for the components on the server is still there right hit that then you can see I lost in the connection time, I'm attempting to reconnect it server out. Ok, we're back and all my state is still there. If I add you know a couple of count: increments and rerun. You know force to the connection. To close. Do I lose my current count to 6? No, it's still.

C

It's still there we're still we're still good. So reconnection is now there where we can reconnect back to the same state on the server. If you want to customize that UI, that's shown when the connection gets lost, you there's a way to do that. You add an element with a particular ID. Actually I think I'll skip up. We'll have details on that in the upcoming documentation, but you can change how that UI looks so that you can provide the experience that you want for your users.

C

So that's automatic reconnection and last thing, I'll show is, let's just look at the client side as well. We've been looking completely at the server side version, let's go ahead and do file new project and just quickly create a new earthquake glaser app to.

C

Instead of doing server-side, laser I've also installed the b6 to bring in the client-side laser templates. Some reasons are up here at the top they're not grouped together, we'll fix that so that they all double your blazer stuff is in one spot, let's go ahead and create a client-side blazer app and the thing to notice here is just that again, the templates have been cleaned up, so the client-side blazer templates are now also using dot razor, consistently I think in Blazer 0.9. They were still using CSS HTML. That's now, that's now gone.

C

We use dot razor consistently for all for all components and all the normal tooling stuff works here like if I want to go mess around with counter I can do that. If I did that in Visual Studio, that would be the demo that you've probably seen for like the past year in half, but instead of doing in Visual Studio. Why don't we do something different, so I'm going to actually go to Visual Studio code, let's open up visual studio code here, I've installed the latest c-sharp extension update, which is I, believe 1.19 there.

C

It is, and let's go ahead and open up that folder, where I created the client side blazer app. Where was it's like blazer app to write this one that looks good? Okay, we have done a bunch of improvements to the razor tooling in for visual studio code. So hopefully, now, let's see, can I can I like at a counter component to my home page, getting coloring.

B

C

C

We're gonna do this. No, this is still preview, tooling support. Let me let me see if I can get this to work.

A

C

It just needed a second, so Omni sharp is the language server, so that's used for Visual Studio code. Sometimes it takes a minute for it to get up and running there. It is so there's my counter, so I can have a counter component here, that's great. What about just like you know, binding and all that all that great stuff like let's do to-do list real fast, I'm gonna, add a to-do straight.

C

Okay, let's see what do we get here so at page, do I get yeah, okay, page directive again completions on so to do this? Let's just add a Jew's header here, let's add a functions. Block I need a type. Let me let me just add a to-do item class to item dot, CS and namespace. This is just of course he sharps, so it needs. What's the name plays a wrap to.

C

What we know names.

C

Public class to-do item grade, so let's give it a string title.

C

And a bool is done. Okay, so we've got a little class, now awesome and then oh I know I put it in the I put it in a solution. That's why it's like that there there that will be better. I can go away now: okay and then here, let's, let's start doing some more razor e stuff, so I'm and believes every stop. So a list of to-do item awesome to do is equals new list of to-do item. So all the normal C sharp stuff is working.

C

Let's go do some some razor II things, so it's great on our list at or each or to do and do I get intellisense here, yes, awesome and then let's go and add some list items for each item in to-do list. So to do yep and tell since they're do I see my title: yeah awesome. Alright, what about like bind and click handlers? So, let's add an input here so placeholder do something dot dot. Let's just add an input in a button, add okay and then we need something to bind to.

C

So, let's add a string string new to do you have to do and then a click handler event to do, and we can do some stuff here like yeah string is null or empty the new to do all the intelligence seems to be working great now. What do we do if we, if it's not null or empty? Let's add it to this list. Add new item title title yep equals the new to do that. We're gonna bind to in just a second and then we should probably clear it out afterwards equals drink dot empty, perfect.

C

Okay, can we bind to these things? Let's try and do a bind bind shows up great. Let's.

B

C

Like new to do yeah, we get intellisense for the things that we combine to and we add a click Handler on click, that's just normal HTML. So we expect that to show up. But what, if I, want to bind to a c-sharp method? I had to do shows up so.

D

B

C

Do code, so if you want to, like you know, work on a Mac, you can now do that now. This does require preview for of the.net core 3 o SDK. So if you try this with preview 3 like with the blazer bits that are publicly available right now, it's not gonna work. So wait for the preview for release or go ahead and grab a nightly build. If you want to just try it out now, but you will need a preview for build, but as soon as that's out, then this tooling is available for a blazer.

B

Very exciting, Wow, mmm ok, see if there's more no people are people are very happy to see that that is really cool, so I'm sure. What's next. What's these, these are all you're showing these are preview. Bits and stuff have you've talked about the timeline.

A

C

Really should be hopefully any day like I. Don't even have a.

B

C

Very soon there should be a the preview for if dotnet, core 3 Oh, along with a blazer update, to apply a blazer on web assembly, update things that are next things that we're working on we're going to to stuff so be like support for static assets in component class.

C

Libraries we've had that in clients I blazer for a while, like we in fact still have a blazer class library template that sets up some msbuild magic that allows you to have JavaScript files and CSS files or whatever content you want in a class library that can then be used in Blazer apps. We haven't really had that for server-side blazer in the in the.net course real-world.

C

We, we, we didn't bring it over, because we wanted to build something that we knew would work across the board for asp.net core, so we're working on our static files story in class libraries in this next preview. So hopefully we should have something to share there in the next preview update what else is coming?

C

We are working closely with the our friends on the the runtime team on the.net runtime them the mono guys on ahead of time, compilation, support for web assembly. They have working now mixed-mode support in the IL interpreter.

C

What that means is that the il interpreter can now handle a mixture of dotnet IL, like you know, just deal else and also ahead of time compiled web assembly code, that you know like to your C char code and just said just compile this part all the way to webassembly the isle interpreter now can handle a app that has a mixture of those two things.

C

What that should enable us to do is to take parts of the you know: the the base plate base class library of core effects and ahead of time compile that to web assembly. So we can get much better performance for critical paths in the framework and then in the future. We hope that even that's that will become a tool chain that app developers can even use to to optimize parts of their app that are performance critical so that they are ahead of time compiled to web assembly.

C

While the rest of your app can just happily stay in Li L, that's something that we're working on Steve mentioned the authentication and authorization work, partial clips.

B

C

Coming there's a bunch of people.

B

Asking about client-side debugging yeah.

C

So the client-side debugging is it's there and it's it's getting incremental improvements. There is a I hear some support for inspecting, like full objects like complex objects. Now in the debugger in this next update, the improv improvements in this next blazer preview will be fairly incremental, though nothing, nothing too dramatic, but it is something that we are working on. We also do have now the pieces in place from the mono team, not for it not for this.

C

This coming release but hope for either the next one release or one after that, where you should be able to attach visual studio to be the client side, blazer application and start debugging from within vs, though the infrastructure release is there and we've we've done like prototyping and demos of it. That's. We hope that that's something that we'll be able to enable soon as well. Well, honestly, there's still quite a bit of work to be done and just have full fidelity in the client-side Blaser debugging story.

C

That's one of the reasons why client-side blazer won't be shipping with dotnet core 3, oh it'll, ship. Sometime later, it still allow for time for us to do things like you know finish, the debugger get the runtime completely done a port for mixed-mode äôt and all these things size reduction. Those are all things that still need to be done for dotnet on webassembly. Well,.

B

Wow, this is great. This is a lot a lot of great stuff. It's it's a lot of chat, going on to very there's, there's a lot of people watching and a lot of excited response to what you've been sharing, so that so this is. This is great. Should we wrap up sure.

C

I know if people still have questions that we didn't get to you like feel free to you know ping us on the in github issues on the repo or find us on Twitter we'll be happy to chat with you more. If you like what you see you know, download Blaser, give it a give it a try, fill out our survey. We still have the end product survey for the client-side blazer templates. We love we. We read that feedback and thank you for everyone.

C

Who's already done that, and we are on the road now to turn blazer into a shipping product. Alright,.

B

Alright! Well with that, like it's time to say goodbye.

B

B