Build Amazing Cloud Connected Apps With Xamarin, Azure, and App Center

my name is Matt soaked up and I'm a senior cloud advocate here at Microsoft and for the next 30 minutes I'm going to show you how to build a mobile app using xamarin connect it to the cloud with Azure and make it amazing with App Center so let's jump right into it and show you what we're building today so what I have here is you may have seen this app used a couple times yesterday and during the keynote and today it's the pretty weather app and it looks pretty good alright we have the weather condition so we're in Seattle we have the temperature we have the current date but the world doesn't revolve around Seattle right don't tell anybody the bad here but there's more cities involved and so what we're going to do is we're going to make this app fully functional and by that we're going to hit the three little icons in the bottom and then we're going to be able to sign in to Chrome say no thanks and actually be able to sign in to our app so I'm going to enter my email address and my favorite password of all time ABCD one two three four with an exclamation point sign in and what this is going to allow me to do then is save cities that I want to be able to view the weather with hit a plus button and I can now add other cities other than Seattle around enter Honolulu probably has a little bit better weather than Seattle and now I can be able to see the current weather conditions then in Honolulu so what I did is in addition to the current weather conditions added a little magic to be able to sign in and have data follow me around the different locations or different devices so let's see how we did all of that we're going to be using to build all this three things xamarin for the mobile app functions to be our compute in the cloud and then App Center mobile backend as a service that do auth and data which wraps around as repeated C and Azure cosmos DB so first up xamarin so a quick overview of what xamarin is xamarin is microsoft's framework for building performant ios and android apps but it's so much more than that you can build mac OS apps you can be able to watch OS f so you build TV OS apps you could even build apps for Samsung's Tizen operating system so it's much more than just I Oh s and Android apps and how this is done is that you've used the great power of dotnet and c-sharp so we have let's say an iOS UI and Android UI and as G sharp UI for Windows so we're going to build a UI for each one of those out separately we're using c-sharp we're using dotnet we have full access to the platform but we're building those UI separately but we're building an app that one app is still going to perform the same thing although we have to build it for each platform so when we call to that web service when we go get our our weather information it's going to be done the same way so we may as well use a shared C sharp logic way Eclair and that's where the power hammer comes in that we can write our shared logic just once and have it use across multiple platforms that well at the same time but we can do better and that's where xamarin forms pops in so what salmon forms does it gives us an abstraction of the user interface layer so let's say iOS has a button Android has a button and uwp has a button so what we're going to do then is salmon forms gives us an API that lets us program against a button and then forms takes care of emitting a natural native button for us so now we're sharing c-sharp logic for our application logic we have shared logic for a UI logic and we have more and more shared code this is great so that in a nutshell is what Zarin is the next thing I wanted to talk about is the compute layer or Azure functions and so this is a quick diagram of what we're gonna call the cloud native compute or how we're gonna architect our apps so way back in the day we had the claw on-premise architecture and so what that was was essentially that was the old data the computer underneath your desk right where you had every year to take care of everything yourself the machine make sure the operating system was good you had to install all the software yourself but as we moved along we started moving to the cloud so you had infrastructure as a service so you no longer had to take care of the hardware you then you moved a platform as a service so you didn't have to really worry about the operating system and now we're at functions as a service or serverless or are only worried about writing our code and so our answer to that is as your functions where it's events being tied to code and then we have functions and so what are some of the events that we can write that we functions run off of think of having a blob being written to blob storage or something being written to the azure queue so that in itself will actually kick off an azure function and have our code start running the secret sauce though comes in with the bindings and so what a binding means is that we can have something let's say from cosmos dd be bound to an azure function and then like a document can be sent into our function as a variable so the same thing can happen with a Azure storage table or a file it automatically gets sent in or we can write it out as well so this gives us a really powerful mechanisms to write some really cool code with a little bit of lines so scenarios to demonstrate this so let's say we had a timer going off every 15 minutes that's our event the function then kicks off it will then find and maybe clean some invalid data from a table and then we are resulting with a clean table afterwards another event could be a file a CSV file let's say gets added to blob storage we have a function then that takes that in transforms that CSV file into data rows and then from there we can display a power bi chart graphic or our scenario that we're dealing with today is our mobile app it needs a forecast it sends off an HTTP GET request to a function that function then is going to call up to a third-party weather service get the data back and then it's going to massage that data into a version version that the app can deal with send it back down to the app and in the app displays the data so let's see how we can use compute with Azure functions and add that in to our mobile xamarin application so this is what the function looks like it's some call get current conditions and it's running as an HTTP trigger so that means that as soon as a HTTP GET request comes in it's going to trigger off this function and is going to start running and then it has various requests queries that I can get a latitude and the longitude and then it runs through so actually let's kick this off and run it so it's going to compile and I'm going to run this all locally and then as that fires up I'm going to actually call it out through postman through this localhost 7:07 1 and here I have postman sup and I'm going to be passing in a latitude and a longitude of Seattle so I send it off hiren hits so now what I can do here is step through so I get my latitude and longitude out of the query string and then these next ones I'm just pulling out of essentially a config file to get my key and my URL for my third party weather service and so that's another great thing about putting this up in functions instead of having it in my mobile app I can have the key to my weather service not onboard my mobile app where it could be possibly compromised I have it up on functions within the azure cloud and it's safer eventually I could even put that in an azure key ball and really lock it down if I wanted to great so back to the function then all I'm doing here is using this client which happens to be an HTTP client calling getstring async invoking that third-party weather service getting my data back deserializing it and then finally all I'm doing here is putting it into a version that my mobile app would use so I continue that off and down here I just get this a little JSON back and this is all my map app needs to display its data so I've already actually deployed that to assure that particular function and I'm gonna run my mobile app now to actually see it in effect so I'll compile it and run it on the emulator and as it's going all I'm going to do here again is using the HTTP client is called getstring sync and it's just calling out to pretty weather that as your website's net to get its data back so as soon as it fires up still compiling and then we should have it done in just a second here hopefully and then um we'll continue on talking here we go so loads up going to deploy it to these emulator then once that's done it'll go through and the very first thing that's going to do is going to hit this weather service here get the weather info and then it's going to deploy call out to the function loading itself up and then it should come in here and that's what I did call the getstring async and I can see my weather info that came back it's the same thing as before and now it's just been updated with weather from Honolulu so there we go so that's all that's involved with loading up and calling an Azeri function from a mobile app it's just an HTTP GET request involved so that's pretty straightforward as far as it's creating just a back-end a Web API but doing with Azure functions a cloud native way of creating a Web API so now adding the real amazing stuff to functions or to our mobile app and that's with App Center and so what App Center is gonna do is gonna allow us to wrap together Azure ad b2c Active Directory b2c visit the client and also as a cosmos DB and our really nice easy-to-use developer friendly SDK and so the way this works is that a lot of y'all may be already familiar with App Center in the dev ops portion where we had build and tests and distribution so what happened is that with build what you would do is that you would connect to your favorite repo and then as soon as you would push to that repo it would build it would kick off some unit tests and maybe even some UI tests that would run on real devices and as soon as that was done everything would pass it would kick off to the distribution whether it's distributing to the stores or whether it's to some external beta testers and then you would have some Diagnostics I could run so what happened at the app crash maybe you can get full stack traces it could hook into app insights and then you have analytics where you can track how people are using your app that was App Center however there is this now this new features called the mobile backend as a service where there's authentication data and push now what's great about these features is that they interact really well amongst each other and they are super easy to use so first we'll take a peek at what the authentication does and as I mentioned before visual studio apps centers authentication works hand-in-hand with Azure Active Directory b2c so ad b2c itself is I'm gonna say it's a little bit involved in getting set up and also what App Center auth is going to help you do is going to help you ease that process of getting set up and making calls to it so it's focus is on making everything easy for you and so the other way so there's two parts involved in calling and authenticating and signing in your users there's the b2c portion and then there's the actual signing in portion which is done through Microsoft authentication library or M cell now the M cell is all done on device and that's taken care of displaying the webview and actually communicating the b2c and performing the authentication where b2c handles like calling out to Twitter or Facebook or your email to make sure you are who you say you are so you have these two pieces that need to interplay with each other nicely in order to get your sign-in experience App Center makes this whole layout this whole journey way easier this is what it looks like it's just sign in a sink now if you're familiar with what the M style framework was before it's super powerful but it was a lot of ceremony that goes along at Sutton setting it up this is what it looks like now it's super it's nice it's developer friendly and that goes right along with the App Center ethos going along with this I mentioned that right now it's just working with Azure Active Directory b2c but in the future they're implementing something called bring your own identity and so what this means is is that if you're using auth0 or if you're using firebase or if you're using Azure Active Directory already you can just bring those in to App Center and it's gonna work for you so you don't have to be just using b2c you could be using any of those other identity providers bring it in and you'll still be able to work with them behind that beautiful su K that we had then next up is the data portion so what the data gives us here is a nice wrapper around as your cosmos TV so the way is I mentioned before is that auth and data and push work together hand in hand so this is one of the ways that they do so we're logged in with auth and then user a user B and user see whenever they do some data information they get their own private partition within cosmos dB so what I want to store some data I get my user a partition the same with be the same with C but yet we still have some public data and so there's no I don't have to set up as a developer set up a new partition for anybody app centers SDK takes care of that for me now the other thing that we get with the data SDK is the ability to do offline writing if I'm connected it writes to the cloud right away also writes to an a sequel cache on device however if we're not connected just writes to the cache on device and we keep on going it'll write up to the cloud next time we're connected same thing when we're reading always read it's from the online cat or the cache on device if we're connected reads to the cloud and syncs up automatically works you don't have to worry about whether you're online or off the SDK is gonna take care of it for you so some methods here that you have you create your data model new it up and then there's a create method a delete method passing in the IDS of what you want and then the partitions here are the user documents as opposed to public and then there's a list a sink to get them all back a read for a single and then a replace which is like an absurd or an updating well cool things that we have with AB Center is that you can see data metrics from what your cosmos database looks like all within the App Center portal and you can actually go through and view different documents and the best thing at all is that there is a free tier coming along it's not there today but it is coming along soon so it is cosmos DB free tier with App Center and that's pretty really slick so let's jump in to the last demo that we have going walking on sunshine off and data with App Center so first thing I want to do is show you how we would set up the portal the epicenter portal to work with ODS and data so what I would have here is I have open up a App Center application and I have often data here so just by hitting auth it says welcome to auth connect my address subscription and I can go through I'm gonna have my pretty whether it's reading what's already in my Azure subscription user impersonation and then for the policy I have to manually add my user flow which has happens to be this user flow is the how you sign in so it's like which identity providers like if you want to connect to Facebook or if you want to connect to Twitter and then I can just say connect and that's all there is to it now my app is set up to use authentication the same with data all I'm gonna say is I want to use an existing database use my subscription hit next here which database within it user preferences which collection and that's it I would hit done so to show you one that's already set up and ready to go is one of my Android authors already there it's telling them my tenant name my application ID and the data and you can see here I have overview and then my Explorer and you can see I have both Seattle and Honolulu so the next thing what I want to do here is finally go through and show you the methods that I have set up to be able to log in and a save data so I hit the little things below and the sign in right here is just off sign and a sink I have tokens that come back an account ID which is my b2c account ID all within that I can get listing my cities out is just a data list a sink sending in a city info which just happens to be a regular class continue on and then if I when I want to add a new one we'll come through here pick a new city and crash the app so what it would look like if I would pick the new city then is say vsync instrument just says create a sync city info passing in everything I need and then what I would have there is some really really funky stuff but if I go over to my real device I can see if I load up the app it should be able to see Madison Seattle and Honolulu come up now because Madison did not save but that's okay so hopefully it saves here without crashing anything and it comes over so great that's the quick version of adding everything and using App Center with as amra mobile app so in summary we use xamarin for creating a cross-platform mobile application as your functions for our server list back in for a compute and then App Center for a mobile backend as a service data and authentication so please go out and learn more follow these documentation links for xamarin App Center often data and finally the bottom one there is all the code that you can want from this session alright my friend man how you doing today my friend I'm doing well Seth fantastic so here's a question that I always get that I thought I would ask you performance with xamarin versus native is like tell us about that you get 100% native performance with Sam earn as you would if he were writing something in Java or if you're running something with Swift you're gonna get the same native level performance as you would so there is no difference as if anything Sethi write bad code he can get back home yeah he's saying that from experience yeah we work together and so he's seen some of that all right so here's another question those Azure App Center auth work with uh securing with securing a web api being called from a desktop app that's a good question so the center app works with securing a web api calling from a mobile app I haven't tried it from a desktop app but they do support WinForms in the other portion of app centers so I'm not gonna speculate and get that project team or the development team product team into trouble but it's just a JWT token fantastic well there's a lot of good links that he put up there so make sure that you follow those and get some of the code so you can try it out yourself it's pretty amazing now as we go along make sure to remember to participate in the technical treasure hunt it's still going on you're gonna want to watch olive dot Netcom 2019 because the UH net partners are sponsoring a technical treasure hunt there will be fun challenges to solve me to be eligible to win a lot of prizes which is critical so what we're gonna do is we're going to throw to a commercial break and right after that we're gonna have a tour of what's new for zamel tools and saml islands in Visual Studio 2019 with my good friend Demetri Lyle in but this first

App Center for WPF and WinForms

>> On today's "Toolbox", Matt and Wendy are going to show us the latest goodness being sent away of WPF and Winforms apps. [MUSIC] >> Hi, welcome to Visual Studio Toolbox. I'm your host Robert Green, and joining me today are Matt Cornwell and Wendy Lee. Hey guys. >> Hey, how's it going. >> Good. Welcome the show. >> Thanks for having us. >> Happy to be here. >> Matt and Wendy are in App Center Land, and we're going to talk about App Center today. Now, App Center has been around for a while, and we've done an episode or two on this show and of course James has covered it on the Xamarin Show, and you think about App Center as DevOps for mobile apps. Right. But it's expanding, and you guys are going to talk about App Center for WPF and Winforms. What? >> We are. But really, we're hoping to be App Center for distributed Apps, right? Things that are not co-located where you are and maybe multiple instances around the world. >> Cool. So I guess that immediately brings to mind two questions. One is, how does that work? Which you'll show us, but two, why? Because we already have DevOps for WPF and Winforms is called Azure DevOps Services, right? >> So you don't have to answer right now but as we talk about it, those are the two questions I want to cover. How does it work and why? Then which one would I choose as a WPF or Winforms developer. >> Yeah, absolutely. So App Center is actually very different, and it's a great supplement to users already using Azure DevOps. So we've kind of realized there's not a great tool in the space that allows Windows Developers to easily manage their releases, look at their crash reports and just better understand who's using their application, and got the analytics that they need to really deliver the best user experience. >> Okay. >> So if you're already using Azure DevOps, fantastic, continue using that build your app and Azure DevOps, and App Center will help you release those apps that you build in Azure DevOps. So we really think about those two products as a compliment to one another. >> So use one, and then use the other use them side-by-side basically. >> Yeah. Absolutely. >> There really is when we said they they fill different gaps and that really speaks to the why. Is that as a Windows Developer, there are lots of tools at my disposal, but I really believe there isn't a set of tools that brings this piece of the puzzle together in a comprehensive way, right? You can build things with Visual Studio, you can do your DevOps stuff on Azure DevOps, you can run it on Azure, but how do you manage your app when it's on a million devices in the wild? How do you see who's using it? How do you track logs? All these pieces are things that there really is not a turnkey solution for, and we hope that's what we're bringing to folks. >> Okay. Cool. >> Yeah. So I guess for those of you who don't know what App Center is, we are end-to-end solution for developers, so like you mentioned, James have talked about it probably on Xamarin with prior iOS, Android, and most recently we expanded our platforms to support desktop apps as well. So WPF and Winform Applications targeting dot Net framework as of today. So today we can go over the top three most requested services, so I'll be doing a quick overview of what these services actually looked like on App Center, and then Matt will actually show how to get this up and running under five to 10 minutes. >> Cool. >> Yeah. >> All right. >> So cool. So you can see my screen here this is a sample app that we have. The screen you're looking at is just an overview of how to get started with some SDK instructions that Matt will actually be going over in a bit. First off, we have distribute. This is a service that allows you to easily manage how to release your apps to your end users. So over here you can see the releases I've made to the Beta Testers and to myself in the past day. I'm able to see how many downloads I have, how many unique downloads I have, and I can also sort this table by what's most relevant to me. Under "Groups", I can create a new distribution group. These can be your Beta Testers, your end-users, really anyone you want to download your app, all I have to do is add their e-mail address here, click "Create Group", and then I'll see a Group appear in this screen. >> In the why section to keep sticking with that one, this is I think one of the fundamental pieces that is very different than what Azure DevOps would offer. Getting that app to either testers or end-users did not a compelling story for that that I'm aware of elsewhere, and so this starts to become super valuable. >> To putting setup dot exe on a jump drive and walk it over to another computer and having somebody run that, you don't consider that compelling? >> I mean, it is totally compelling if you're co-located. but we found it really interesting our team is actually we got 15 or so time zones around the world, right? People working on these things, and so this kind of centralized push model where I can control who sees what and when, and let things go to customers. While we don't yet supported for the Windows story, we do have in-App updates where you can basically help auto-update a user from within App Center, really is a game changer to be honest. >> Okay. >> Yeah. So yeah. Looking at distribution, I can click here for a new release. Like Matt was saying, if you're using Azure DevOps that's great. Build your app in Azure DevOps, and then upload your app package here. So we support dot zip, MSI, and a lot of different package formats that can meet your need. So once you upload your package here, I just click" Next", I specify some release notes, who I want to distribute my app to, and then I'm done. >> Can I do the build-in App Center as well? >> Not yet. >> Okay. >> So right now in Azure DevOps you can build those apps. So we definitely encourage users to use Azure DevOps for that, and if we decide there's a need to support that in-App Center as well, that is something that we can look into as well. >> Over time, eventually these tools will probably coalesce into a single location. I mean >> You'd have to ask someone with more knowledge of the discipline than I, but I don't think it'll be unreasonable to picture what would that happened. >> Okay. >> Yeah. So that's our distribution service, the next one we have is diagnostics. So this is a service allows you to see when your apps are crushing and it gives you a good overview of the different types of crashes and errors. I can click into a crash group and get a little bit more details. I can look at my stack traces, look at the individual reports, see which devices are crashing, and got some other data that will help me understand what's actually going on once my app is being used by my end users. >> Right. Then in that world where you've walked as it drive around to a 100 people, and traditionally working through e-mails, asking people to send your logs, right? Even if you've got your logs going to a central location, looking at logs as raw data is very different than looking at rich data that has been grouped in augmented and provide it in a way to help you as a developer to figure out what's wrong, right? There are some other tools in this space that do this, I don't think any of them hit the mark with this kind of complete end-to-end picture, and so really at this point you've got your ability to send your app out across the world, and you've got your ability to get that data brought back to you and presented it and I hope a really useful way. >> Yeah. With features like events or attachments, we really allow you to customize what you need in a crash reporting tool to really understand what's going on in your app. So that's what we have for diagnostics. Last but not least, we have analytics. So all this data you see right here is out of the box. All you need to do is integrate our SDK, and you'll start seeing these metrics flow in. So you see how many users you have, the daily sessions, where your users are, what devices they're using, a lot of really great stuff for you to understand who your user base is and what features are using, and how you can really deliver the best experience for them. So all this nice data is here, and then you can go into our "events" tab and actually set specific events that you want to track. So if you care about a very specific set of features, or you care what buttons users are clicking on and those are things that you can track using our SDK as well. >> Cool. >> Yeah. Those are the three services that we decided to introduce WPF and Winforms Support first, and Matt will go ahead and actually show us how to get started. >> Yeah. If we want to flip over to my machine for a minute. >> So if all you did was use the distribution, it seems like that's pretty cool for starters. That's all you did to get the app onto other people's machines easily when they're ready to do it, and you just push up the latest build. So if you then make a change to the app, anybody can go get it, they'll get notified if there's updates, right? So you just have a central location that's not sitting on a drive somewhere. >> Yeah. >> Right. >> Must be cool. >> I really do think it changes the way Windows Developers can start thinking about shipping this stuff. >> Yeah. >> Right. >> I know we're talking about Winforms and WPF, and so we're not necessarily talking about the store. At least there are other other broader options out there, but I don't think anything targets it with this kind of focus from a really developer first mindset, right? As developers, we want make other developers lives easy, and this is I think a really good first step for the Window space. >> Cool. People can go to aka.msappcenter Windows to learn more about this. >> Yeah. Well have links to the documentation, and I'm actually going to just walk us through the initial documentation. Just so people can see it, I know as a developer seen that actually played out is a lot easier than reading the docs sometimes. So hopefully, this will work it makes sense. >> Yeah. Cool. >> Cool. So the aka MS link will take us to, I'm just going to click everywhere, take us through the Getting Started page, which essentially says Create an app in app center, follow a couple of steps to integrate it. Start making your App crash and go from there. So here I am over an App Center. I have a few apps ready. I'm going to create a brand new app. Let's call this VS Toolbox, and I'm going to say it's a Windows app. WPF and add a new app. >> So UWP is already supported I see. >> UWP is partially support. >> Partially. >> We'll actually talk about that at the end. We have plans to get UWP up and running all the way in, but I think right now WPF and Winforms are the for the store. >> Okay. >> Yeah. So I'm adding new app, assuming the network and everything is working, there we go. So dropped into the same page, we saw Wendy looking at a few minutes earlier, and here on my machine I've got Visual Studio open, and I'm just going to go "File", "New". Let's just close it and start fresh here. All right. I'm going to "create a new project" I want to do WPF app targeting .NET framework is when he said right now we target.NET framework standard. We do have changes coming. So in the wild introduction today, you can use WPF with .NET framework. Our next SDK release which I believe is mid to late August, will target.NET Core 3 for WPF and then forms apps. That won't be cross flat, it's still Windows because that's where the UI framework runs, but we are definitely moving to that OS agnostic platform versions. All right so I'm going to get this app up and running. It's Toolbox, put it in there. Then to get this up and running, I think our main steps are going to be just following the guideline which is going to be adding your NuGet packages as it says right here. I put this code into the start of my app to initialize the SDK with the information about my app. >> Then do it in the Azure app SQL. >> Yes, that's your actual value. >> So app center knows which app data's coming from. >> Correct, where to route it on the backend. >> Is it actually a secret or was it just an identifier? >> So it's a really good question. It is just an identifier that is named a secret. I don't think we publish it a lot of places in the UI, I don't think it's a common reference points. But it's a good question without a great answer. >> But if you don't treat it like a secret and people use your ID in their apps or you use the same ID in multiple apps, then you lose the ability to really know what app caused the problem, right? >> Certainly. >> It's an a unique identifier for the app. >> It is. Our intention would be that as every time you create a new app here in App Center, you would get a new one of these and you would see it through there. So I think as you get in and use it, it becomes pretty clear that an app is a sandbox for all the data of the distribution, the diagnostics, the analytics. So it's really up to you. I mean, it could theoretically, I suppose you could have the same app secret in several different executables, but I'm not sure that pattern would make sense for use cases we thought out, maybe there are other use cases out there. So I want. >> You just want to know how many users you have total and you're too lazy to do the math. >> One way to go about it. So I've included pre-release on our SDKs. Right now the SDKs are in pre-release version that will be changing. So we're going to install these. Also, I want to go ahead and change. I don't remember if I just picked it out on and change the.NET version to 4 or 5 because that's what we found out this morning was on your machine. So we want to make sure this runs as we do it. So I'm installing the crashes. >> You'll see that Matt is installing two separate packages because their services are actually modular. Meaning, if you want a crash reporting to on analytics, that's fine, you can just import the crashes NuGet package and everything will work just as well. But we do want to put everything in one spot. So it is easier if you do want distribution, diagnostics, and analytics all in one. >> It would also seem like this would be a handy place to create an extension that just says, "Set up my app for App Center." >> Yeah, something with that. >> All the packages that adds that line of code and then you just copy the secret in and the unique identifier and you're ready to go. >> Yeah, that's great idea. We would love to hear more ideas like that. I'm definitely drop as a feature request, any feedback that you have. >> We do keep our roadmap and our iteration plans on our public [inaudible] depo. So Microsoft/AppCenter under GitHub, I believe it is. We'll put the official link and the details, but all we feature requests, these are the roadmap where we're going or things what's coming when, it's all on there, trying to keep that living in transparency. So we've got our two packages installed. So I'm going to go over to my main window and actually I'm going to go to my App CS, because that's where the start of the app is, and so I'm as developer here. I'm just going to find out which keywords on my Mac. That's not it. Let's see. There we go, generate overrides. I don't need all of them, I just need on startup. So I've overwritten startup, so I can put the App Center's specific code in there and I go copy in the us ins, even though do it for me, I don't trust my keys, my fingers on these keys, and paste, and back one more time. Copied in, like you said, it's convenient that this is my data and everything is good there. Paste it. I'm going to go ahead and build real quick before I do anything else to make sure I didn't mess anything up this far that'll hamstring us later. Build worked. So I've got that up and running. If I run my app, we should see that it starts and it's just a blank window. So far, nothing particularly noticeable. >> Oh. that's beautiful. >> I know this is this looks like every UI I've ever designed in my life. >> Sharp white. >> Right here. All right. So the next step, I'm going to cheat just a little bit rather than trying to type this out from memory because lose in mind. Just go ahead and put this in. So let me go to the main Window XAML. Bring in a couple of buttons. Now, I don't normally build absolute buttons that say crashed them. No judgment if that's a good thing, but that makes this easy right here. So I've got the buttons, I've got the code behind, and there we go, skip those in there. All right. So we've got all those in and running. As you can see these three buttons, actually exhibit a couple different things in the App Center world. So we have a concept of crashes and errors when your application crashes and has to restart, if you divide by zero error and unhandled exception. There is also a concept of what we called handled errors. Just think of it as a robust error.log. So rather than the user app crashing, you might identify that there was no network connection or you couldn't find the right version of a file on a server is. Something that is manageable but you want to know about, we allow you to track is handled errors and see those in that same diagnostics UI. Then they will actually give you the full stack trace and the other memory data at the same time, so you can go a little bit deeper than a real log. So these are up and running. I think I'm going to need to add. >> You see the crashes, right? >> Yeah, and I'm just going to copy it from over here. Copy. Come on, you can do it. Put that in there. All right. So let's go ahead and run this app. So this would work from my machine and debug, this will work in release. As we'll see in a little bit, we'll send it over to Winnie's machine and it should work over there. >> Okay. >> So if I come in here and I say "Throw Handled Error", I didn't put in the UI in there, but we can validate if that did it thinks. When I go back to my app under diagnostics, give it just a minute to work its way through the pipes of the internet. >> Obviously, if you don't have conductivity, they're all cached and then gets sent up when you're connected. >> Yes. I believe that's the case for handled error is definitely for crashes. So as we'll see in a minute when an app crashes, we actually send it on next restart. >> Okay. >> So what we've learned through our time in the mobile space is that trying to do any processing when something's gone favorably wrong in an app is a good way to make things worse. So we capture a text file actually of what happened. Then when the app next starts, it seeds if there's a thing there, and we'll send that data back sooner than so when you back in a healthy state. So I'll click it a couple more times. It should show up relatively soon. You can do it. There we go. All right. So we see that today, we had one error. If I come in here and look at that error that I just got like you said, in this case, this is all the statuaries that was there because that's what we've put in there. I see the reports. I can go into this one. I can see this one, we know it was running on a virtual machine. See the main thread. I didn't really give it much data here, but this is the general idea. Also under analytics, I'm going to see that I had one unique user show up today. >> Yeah. >> I haven't gone in and done much of the other data write, I'm just in English write. There's not a lot of writing here but this is the basic feedback. So the other thing to show then is to see a crash. So in this case, it's going to stop the app. When I restart it, you'll get some off to App Center. >> Cool. >> All right. So that's the diagnostics piece. What I think takes this really to other level is being able to shift that over to somebody else. >> Right. Yeah. >> So with just I hope a few clicks here, we can do the same thing on Winnie's machine as in real life end user and see the diagnostics and analytics come in. >> Let's see that. >> So let's do this. The easiest way is to just go ahead and publish this app. I'm just published it to my desktop for now, and let's get it in "Desktop", let's make a new folder. In there, "Open" that, "Finish", let it do its thing. All right. There I am. I'm going to "Add" this folder to a zip file, click in it a couple times. So it's the virtual thumb drive that we're using in this instance. >> Right. >> So we do support MSI, we do support app actions from other platforms for the sake of this demo. It's the easiest to go. So I'm going to go over to "Distribute". >> If you build it in Azure DevOps, can you just point App Center to that build? >> You can't. As of yet, you have to download it and bring it over. >> Okay. All right. >> But that is definitely to flow. In fact, for a lot of the other platforms that are a little bit further down the road, it just happens automatically. >> All right. >> If you build in either Azure DevOps or App Center, there's nothing else to do. >> Right, okay. >> So we'd like to get to that point. >> Yeah, cool. >> So you say, I haven't send my app to anybody yet. I'm going to "Upload" the zip. Then over here, let's just give it "1.O.O". Then Y-U-L-I-1 is your, "this is my app it doesn't crash", but it does. Works on my box. >> Yet. >> There we go. All right. So it knows when it is engaged in App Center. As a tester, must send it over. All right. So you can see this there. So if we can flip back over to Winnie's machine, she should get an e-mail in the next minute or two. >> Right here. >> That's already there. >> So I'm very excited to install this app that does not crash. So you'll see it takes me to the install screen. So see Matt's very truthful comment here. >> It worked on my box. >> I mean click "Download", just going to "Open" it, and then you'll see the app right here. So if I click here, let me just open up the executable. So it give me some warning. >> Yup. Just to address this Yahoo. >> Yeah. >> Yeah, it's Yahoo. >> I'm going to install that, and now I have the app on my machine. >> Cool. Nice. >> So why don't you give us a handled error and then crash maybe. >> All right. Let's see. So we hit "Handled Error". Let's do a "Stack Overflow" crash. >> It takes a second to [inaudible]. >> Now, if you open the app backup. >> Let's see. >> Then we didn't give you access to the app as a collaborator. So as a tester, I don't believe you're able to see all the diagnostics information because that's my business. I just asked for you to test it. >> Yeah. >> So we could flip back to my machine one last time, and I go back into diagnostics. We should see in a minute when they process through the pipeline that we have a number of crashes and a number of handled errors coming from Winnie's machine. There's the issue you did, the stack overflow exception. I did the other one there. Under "Analytics", we should now see that I have two users coming in and let me know what's going on. So take that and extrapolated out across tens, thousands. We have apps with millions of users, tens of millions of users. This starts to really just take that distributed debugging for about historical debugging. Clearly, we're not actually debugging. But we are providing information that will allow you to understand how to prioritize what effects, and hopefully, how to have enough information to know effects. >> Right. That is so cool. >> Yeah. >> Awesome. >> So this is in preview, available for anyone to use. >> It's out there in the wild today. >> All right, aka.ms/AppCenterWindows for more information. You guys got to check this out. Give it a shot, and let these guys know how you like it, and what new things should go into it. This is really cool. >> Awesome. Yeah. I'm pretty excited about it as someone who spent a lot of years in this space. Before I got the App Center, we really are doing things that are not really brought together anywhere else, which is awesome. With the coming support for .NET Core 3, that's another step in the right direction. We've got some future plans there to take that, I think a little bit further even outside of the UI section. But we're not quite efficiently there yet, so we'll leave that for another day. >> All right. Cool. Thanks so much for coming on the show. >> Awesome. >> Thank you very much for having us. >> Thanks for having us. >> Hope you guys enjoyed this, and we will see you next time on Visual Studio Toolbox. [MUSIC]