Windows 10: The developer platform and modern application development | MDEV50
So, my name is Pete Brown and I, work for Microsoft in the PAC's group under. Joe Belfiore in, his org we cover, everything. Em 365. From, Windows, to office, to graph to surface, and. A bunch of other cool interesting, topics and also the, edge browser if. You're on Twitter you can reach me at at Pete, underscore, Brown so, if, you have. Any questions, or anything like that after, the event I'm going, right to France after this for the ignite tour so that's probably the best way to get a hold of me if you have any questions or follow-up type stuff from. Here. How. Many of you here are here. As part of the overall learning path like you went to at least two of the other learning path sessions. Just. A few folks okay. How, many of you in here are Windows, developers. All. Right and how many of you are web developers. Okay. About, about half the room there and how, many of you would say your IT pros. Non. Programming. Administrators. All right and who just does everything for, their company. Yeah. All right so I figured, so it's actually a pretty good mix here today so, if you did miss any of the other previous, sessions, as part of the learning path I encourage, you to check them out if, you have to prioritize you. Know depending upon your interest of course but if you have to prioritize the graph session, is probably, one that's really worth checking out because Microsoft graph is a super important technology, and we'll start talking some more about that as part of this session today as well so what, are we gonna actually cover here so. We're gonna first start with how, to get started developing, Windows 10 for those of you who are already know how to develop for Windows 10 this is going to be kind of refresher for you that's fine goes fast, pretty. Quickly. Then. We're gonna dive into one of my favorite topics which is all the command line tools that we have and all the advancements, we've made to make it easier for folks who who, like to type commands and who like to work at the command line and or maybe coming from other operating, systems where the command line is sort of the primary interface we're. Gonna talk about some of the things we've done in Windows there and show you how to use that. Then. We'll talk a bit about web app development on, Windows, so, this is a super interesting topic, we'll, talk about progressive, web and introduce some other hydrazine. Concepts here, then. Finally desktop. Development so, for all of you who develop, on dotnet, in the desktop WPF. Windows forms etc I'll show you some. Of the things that we're doing to kind of bring that forward and then the very last thing we'll talk about here today is, packaging. And deployment with MSI X and out, of curiosity how many of you in here are responsible, for packaging, and deploying applications at, your business. Quite. A few okay also. How many of you send these applications, to consumers, or to external, businesses. Actually. Excellent okay just a few folks they're great great so we'll cover all those things here today.
The. Slides are fast I have, some slides here but they're super fast most of the stuff that we're gonna do is demos, there's, gonna be a lot of command line and code stuff on the screen I hope that's cool with everybody. All. Right I do, have one slide with resources, so. Every, link for every single thing that I'm gonna talk about in this session is in, is. On this page. Ignite, Windows dev so akms. Slash ignite, Windows dev. You're. Certainly welcome to take other photos during the session but you won't have to like pull out your phone and take photos at different slides just to get the links very, good. There's. No screen behind me all right pose and try to get in your photos now okay, all. Right so. I think the best way to start a Windows. Development. Type session is with a demo so, I'm gonna switch over here to. The demo PC. There. We go oh this is a resource page by the way so when. You're when. You're there you'll see it not only has all you know all the topics we talked about here a few of those the ones that we talked about in other sessions and then, if, you're interested in learning more about the topics, that I talked about here today there are other ignite sessions, that you can either attend this week or just catch the videos on that but. Let's go here to getting, started how, many of you have been to developer, at Microsoft, comm the get started page to kind of learn a new technology, it's. Good about a third of the room there or so this, is a great way to get, started in, something, that you maybe don't know anything about so. If we want to go into like Windows development, here we see that we have the ability to learn. Are about building Windows apps and that, brings you over to this uwp documentation. And then you WP documentation. Which, is one of the ways that you can build apps on Windows has. A couple of different sections like you can learn the very basics of, uwp so if you if you need a primer and how that works you can start there or you, can go right in to.
Start. Coding a uwp app if. We click that we, see when we start coding a WPF, it tells you you, know how to create a contact, us how to create a form how, to load and save settings how, to get started with C sharp again really the basics, here so if you were anybody at your organization. Is trying to figure out like how do I get started, in, building a hello world type application. Or just get started in learning this this is the page I would send them to its again the the tutorials, in here get really as deep as you want them to get so. What I'm gonna do is I'm gonna go into Visual Studio here, and. I'm gonna create a new application, so. I'm going to create a new project and. I'm. Gonna create, a blank, uwp. App and this. Is going to be C sharp. Next. And app. Seven that's an awesome descriptive. Name Oh keep it and. Now, it's gonna ask me to pick which SDK, version I want and this SDK version, is. The feature set that your applications, going to use and I'm gonna say I just want to use the latest stuff in here so both, the minimum and the target version of this SDK need to be the same in this case now. It's gonna go through and create this uwp application, for me again. It's gonna be super basic we're, gonna do a hello world. Alright, now, how many of you know zamel. All. My peeps all my pieces amal about half the room here ok for, those of you who don't know zamel it's like HTML, but better so, I think we're pretty good there so, if I go into app dot or excuse me into my main page dogs amyl here I. Can. Create, say like a text block. Trust. Me it'll get more complex than this, and. Block. Text. Equals, hello. World. And. I'll, close that now, I can also do this from the designer so. I can, say I can go in here and say like font size equal. 50. And. Horizontal. Alignment, or. Santol. Alignment. That's weird. That's. Why it's textblock, it's the Texas version of the text block apparently, all right so, horizontal. I mean equal center thank you people in the front row your check will be coming afterwards and vertical. Alignment will, be Center, as well now, for those of you who can actually type zamel and not mess it up this is great there's. Also a design, surface that you can use here so if you, want to you know use something, that you're familiar with from like very. Similar to the WPF. Designer or the windows forms designer you can drag and drop controls, on here you can do all your layout through that alright so I can run this just, to make sure it's all cool. It'll. Compile the application against. The latest SDK here. And. This is usually when you play some music while it's compiling, there. We go. Loads. Up the application and, we see hello world right really. Really simple stuff I appreciate, the applause I don't think that's deserving of applause but I do appreciate it alright, that's. Fun but let's pull in something just kind. Of marginally, more complex, than a text block that says hello world here so, if I go back over to the zamel, there. Is this technology called the Microsoft graph which I'm not gonna go into great detail here, but for those of you who work at enterprises, and who build applications, that have to integrate data from, individuals. Like all the data about me my mail my my. Profile, information my, photo my contacts. My SharePoint data my my documents. That I have all, those types of things that you used to have to go to many, different places, to get that information from, are, all accessible through this technology, called the Microsoft graph and so I'm gonna introduce here, some brand new controls, that we've put out for the Microsoft graph to make it super simple for you to take your application here, and connect it so, the first thing I'm going to do is I'm going to add a reference to the new get package. So. I managed to get packages. I'm. Gonna browse here, and say Microsoft. Toolkit. Graph controls. There. Is our new get package I'm going install that I. Accept. The License Agreement yes. It's. Helpful to it comes from my same team so if I didn't accept a licensing agreement they might be upset with me all right so, now I have a reference to this nougat package which is pulled in this interface to the graph the. Graph API it, uses behind the scenes the same graph API that everybody, else is using on, the web and, command, line and other applications, we've just provided, some higher-level controls.
To Give you access to that now, if I go back over to my main page zamel I need. To add in some namespaces, to get these controls, so I'm gonna wind owes V John. Though that we have clipboard history in Windows, did. You know that I think. It's super cool ok Windows, V is how you get clipboard, history so, I can go through here and I'm going to add in. Those. Namespaces. And then I'm gonna replace this beautiful, text block, with. Some. Other zamel. That I have here. There. We go and. What this zamel is doing is it's just instantiate in, the controls, that. I that. I added a reference to in that NuGet package, it's. Having it's setting up a control at the top that's going to allow me to type in names of people and get, those resolved, by Microsoft, graph and then, it has a list, at the bottom that it's gonna populate with, all of the entries that I've done in there you're gonna recognize, this you've probably had, to build something similar for, the applications. That you've worked on, first. I'm gonna sign in and authenticate to the graph and it uses a technology, called, M cell Microsoft, authentication library, behind the scenes and, like. Everything I'm gonna go in here and windows V that. Hit. Next alright. My, password. Hopefully. Nobody saw that. I'll. Go in and. Then, you'll see it authenticated, me and up at the top right you see Meghan Bowen I'm I'm Meghan, for this case this is test data we. Are all Meghan here all, right and now, what, now again what I have here is I have this text box that lets me type in name so I can say employee. Right. So all I'm and, I can type in let's see Alan. So. Or let's do it del they could do Ellen, oops. Dee, and. I ain't a hit comma and it'll just resolve that and so this is the type of thing that you saw I hate. Saying you can do this with no code but you saw I didn't write any code to do this these were just controls, that were made accessible to me that integrate, with the Microsoft, graph so, if you ever need to resolve names of people in your organization. Or get other data about, them this, is a super. Simple way for you to do this in your application now. I showed, you in you WP here we'll talk about other technologies, here going forward in just a few minutes okay. Make. Sure I get the right. There. We go. Awesome. There we are alright. Let's. Talk a little bit so that was um so, that was just a very basic hello, world connecting, to the graph in your application, you saw it was really, simple to do and. Obviously you can expand upon that I also want to say that everything you can do in zamel you can do in code so you don't have to rely just on prepackaged, controls, to do this you can authenticate a different, way you can pull into other information, there a different way as well so we've, been doing a lot in Windows, 10 to try to make it easy. For you not only to, develop, applications, on Windows, but also our, excuse me develop applications, for Windows but also to develop your solutions, on Windows. Right, so. We want to make it the home for all of your development whether you're doing cross-platform, application. Development doing, web development. IOT. And embedded development etc, all, of those have a home on Windows and I'll show you some of the tools that we're doing to make that possible, first. We have Visual Studio which. I assume everybody in here is familiar with at this point, and, that's also free for open source and small teams and then we have Visual Studio code, which is cross-platform, a, lot of people don't realize that it'll run on Mac OS or run on Linux runs on Windows.
10 And. Then all of these tools together support, all the three primary processor, families, that and, architectures, that we needs a support. Or windows and notice. Arm is one of those we, do have versions, of Windows 10 that run unarmed, and you can use these same tools to compile for that. And. Then, finally we have command-line, tools, which. We'll talk about now. Most. Of you are probably familiar with kind of command dot exe or, con host this is this. Is the command line that you've been using since. Day one in Windows it's you know goes all the way back to command command, DOS it. Is backwards, compatible and, it's been designed to be backwards compatible for all those years that's. One of the things that's held it back a little bit actually because. It has to maintain that backwards compatibility, we can't go and modify that and and make changes to it that would potentially break those applications, but, we have added some new features to it for example we've added tar and curl, commands. Into that to. Make it easier. For you to bring your other solutions, from like Linux, and Mac and whatnot, over to the command line on Windows. Then. We have PowerShell and PowerShell core most. Of you here who are done that developers, are familiar with that so PowerShell, we introduced originally with dotnet, and made, it super easy for you to use dotnet. Commands, in a command line it's really it's a shell based all around dotnet, so, we've introduced, a new version of that powershell, core which is again, cross-platform. It's supported, on everything, that PowerShell, core is supported, on and. We have a version, seven of that that is in preview, today. And. Then finally, we. Have the windows subsystem for Linux which is really one of my favorite features in Windows 10 this. Allows you to run, or enables you to run your. Linux, workloads, on Windows so. If you have say tools that you are using as a developer, and they. Are Linux based you, can incorporate them into your build scripts and incorporate, them into your workflow on Windows, without, having to have a separate, Linux. VM without, having to have a separate Linux machine, and. As part of that and this, is crazy and I love getting up in front of groups and saying this but, we ship our own Linux kernel with Windows, that's. Awesome, like who would have ever thought we would do something like that but. We do because, it's the right thing to do for developers, here, and. All. Of those are supported, in, our new windows terminal, which you'll see here in just a moment so, let's.
Take A look here. See. If I can get this correct twice in a row there we go all right so. Now if I go back over to my demo PC here. I have this, is Windows, Terminal how many of you here have seen the Windows terminal that we have in the Windows Store or the Microsoft Store a whole, bunch of you great so, you know there are some cool things you can do with it you can for example you, know use the scroll wheel or two-fingered, scroll on a touchpad and the control key and you can change the font size ooh. So. Fun okay I'll, stop doing X it's probably not healthy for all of us to watch that you can also do ctrl, + shift and scroll. And because. This has a. An. Acrylic background, you can change the opacity did, you all see that, so. You see stuff peeking through behind it there. You go oops. Also. Like stuff the, other thing that you can do, is. You. Can select text, in here and a feature that we've added so. If I if I copy, this with the right mouse button. Right. And I, open up Microsoft Word really quickly here, and. Do. A bite document, we. Just added in, HTML. Copy and paste right so, you can copy and paste stuff directly from the terminal it retains a formatting, the font everything in there. Super. Good especially if you're doing tutorials, or something like that and you don't have to do screenshots. Now. The. Font that I'm using here as you can see is not, the normal font that you probably are used to it's not consolers or anything it's a font called Cascadia, code and, Cascadia, code is a font that we developed originally just for terminal, and it, has some really cool features so if I again if i zoom in here just. A little bit we, have something called ligatures, and they are programming, specific literature's so, what they do is if I type say. Not. Equals. You. See that the rendering for that the ligature for that changes, it into that not equal symbol we. Do it again not equals right the, characters, are still the same behind the scenes it doesn't change any code it's just a ligature the, same technology, that's used to say combine a tee an adjacent, letter so. That they have a single line between them and fonts is being used here in a more creative way you, can also do say less. Than or equal excuse. Me I started.
Or Equal to write greater, than or equal to etc and it changes that and I found that actually it makes the code much easier to understand, because this, also works in Visual Studio and when you're scanning through the code it's super quick to go and look at that now. Let, me get. This down to a more manageable size here. I'd. Mentioned WSL right, so WI sell the windows subsystem for linux again a technology, i really love if, i go in here and type WSL i am, now running in. A linux instance. On windows this happens to be a bun to here, I can, say. Give. Me all the stuff there and you see it has integration. With excuse. Me with the Windows, operating system, so, automatically, my drives were mounted I can, do interesting things like I can shell out and, execute. Windows programs, here without having to leave this and have full integration between kind, of the windows side of the OS and this Linux side of the OS now, it really is Linux right so if I go say Python, 3. Right. And I do, import. Sis and then, I say see. Cyst platform. See. It says it's Linux okay, just just proof there for anybody who wasn't sure now, I'm Donna, core as you know is a cross-platform. Version. Of.net so. Of course it's also going to work here on linux so if I go into, my, folder. And my demo folder here, make. Sure there's nothing in there at the moment. Right. Just a text file that's fine, I'm, going to create dotnet. New console. Hello. World, another. Hello world but, this time I'm using dotnet, core 3 running, on Linux, on windows here and. If I go, into that folder, hello. World I say dotnet run and, it's, gonna execute that template, that console, application, for me it just says hello world and if I look inside that folder, I see. Program dot CS I can, use my normal tools I like Nano as an editor on, I can, also say notepad.exe. Program, CS, and it, opens notepad, on windows, with. That. With. That file, from Linux right I can. Also use Visual, Studio code, here just. Type code dot and, the. Interesting thing about the way Visual Studio code, works is if. You're running say like a node.js application. That you want to debug the, back end of that node.js application. Can be running in wsl, so, it's running in linux and the front end here this hold the editing. Experience and stepping through the debug points and stuff is running on Windows in, that way if you are deploying a web application or some other applications, to Linux you can debug and test any in a highly.
Compatible, Environment. Without. Having to leave your Windows workstation so. I can say hello world, edited. From. Yes. Code and. I'll. Just save that, and. Exit. And. Then if I do done dotnet. Run again. Oops. Here. We go. Now. When you do do not net run it's going through and kind of compiling it at that point running it at that point you can also with, dier core applications, you can do. A real compile of them and bundle them all together so they execute, quite a bit faster that way but, this command-line way is super easy so, you see it says hello world edited, from vs code now, I did say that this is. Is. Cross-platform so, if I go back out to Windows here if, I go into wsl folder, so. Now I'm in normal, Windows by. Going to the hello world and I. Say dotnet run here, because. I also have dotnet core 3 running, on Windows you see the same code no changes, ran on, Windows as well so super, cool stuff there now. One other command-line. Technology, we have that I think is. Super. Interesting is, our. Scuse me one, other one other way that you can use dotnet, core here is not, just to do cross-platform, applications. But. You can also build window specific, applications, so if I go back out to this. Folder. WPF. You see is there's only this WPF, Linux here which I'll explain later it's, probably not what you think so it's okay I'm gonna create a WPF. Applications, so I say dotnet, new WPF. Oh. WPF. App. And. It's gonna create a template, WPF, application, for me and if. I give. It a second here to finish up and I'm. Gonna go into that WPF, folder. All. Right and I, can open this in Visual Studio if I want, and. Pull. It up now. This, isn't the only way to build, a WPF, application, but, if you need to script. Out the, creation, of applications. As part of your day-to-day job all the stuff you can do in dotnet core you can do from the command line and if I look at there's a WPF, app if I right click on here and, choose properties for this project you'll see that this is in fact a dotnet core 3 WPF. App ok. So, dotnet core 3 does support WPF, and windows forms projects, as well as full. Cross-platform, projects, now, if I wanted to create the same thing inside Visual Studio I can just do file new, project. And. Go, over here on the right I can just I WPF, and. I, get the choice between WPF. Dotnet, framework or, WPF. Nick or there. Are other sessions, here that talk more about the relationship, between Donna, core and on their framework but. In a nutshell in, a very brief nutshell. Dotnet. Core is kind of where we're putting all the advancements, in dotnet, going forward, so all the types of things when you're looking for new features you're looking for new capabilities, they are all generally going into dotnet core and then, within.
The. Next year I believe it is we, are converging, dotnet framework and dotnet core together to try to make sure that don''t core does everything, that you need dotnet framework to, do but, if you're looking for a path forward today like if I had to do a new project today what is the safest one for me to pick that'll. Be the easiest for. Future, support and migration anything, necessary, dotnet. Core is the way to go there, now. The one. Last thing I want to talk about here command line wise is, PowerShell. So. If I go over here to PowerShell this, is PowerShell that we, all know and love I think it's, classic it's built on dotnet framework, I have, also installed, on here PowerShell, preview. So, if I just do TW, SH it brings me into PowerShell, seven preview five this, is the cross-platform, version. Of PowerShell. So. If I go, back. Over to command here for a second and if, I go into. WS. L I also. Have, PowerShell. Preview, installed, inside, WS l so, I'm say PWRs, H preview. And. Now I'm running, power shell inside, Linux, here so it's yeah it's power shell inside Linux inside. Windows so we have a couple of layers of interesting things going on there but, this is dotnet. Core compiled, for Linux in this case so I think about all the it's, Donette. Core and PowerShell seven compiled for Linux so think about all the things that you might write in PowerShell scripts and if that, would if, that would be beneficial to have those work cross-platform, your, build scripts deploy scripts, any kind of tool chains etc now you can use the same command shell working across all of those. Now. The final thing in PowerShell that I want to show here is. Kind. Of a new. Fun technology, this is again. Based upon Microsoft, graph and this is brand, brand-new like, on my flight down here kind of brand new so. I'm gonna show you how. To connect. To the Microsoft graph from, PowerShell, so I say I'm. Going to paste, this in because that's the safest way for me to do that I'm. Gonna connect, to the graph inside, PowerShell, we have to tell it what permissions that we want I hit. Enter here now. I've already authenticated previously. As Megan if it was the first time that you were doing it you would get pop-up.
That's Gonna ask you to sign in with those credentials, and. You can also authenticate. Via other, mechanisms, and code and whatnot and. Then I'm going to get. Here. The. List of messages so. Pick. This one and. This. Is gonna get me my. As Megan, is the email list right, think about how hard it is to get email, from yourself. Just like a list of email all the different objects that you have to mess around with Jenny, faces you have to play around with try to get those today, this makes it super simple, and if I'm gonna add in one. More thing I can, go and add, filters, to this so you see I want, the filter here contains, subject, marketing, and, that I'm going to select just the date time and the subject and I hit enter and you see we got just that one email they, think it's going out to my email, repository, it's pulling all that information, back and doing that appropriate, filter through the Microsoft graph super, cool right, yeah. All right cool thank you Hey thank you for your mercy applause I appreciate that all. Right so, it's um let's. Take another tact here for a second. See. If I get the right one this time. There. We all right. Here. Are a few different things that you. Saw in action there so you, WP the universal Windows platform is. Technology. That I showed you it's, being, used by poss scuse me by the. Terminal, application the terminal application is actually using something called. Sam'l. Islands that is combining a win32. Application. Host with. A control, written, in, uwp. Sam'l, right, so it lets you combine those two technologies so we'll talk more about that in a minute the. Powershell, powershell. 7 preview, is available, via either Microsoft, Store or will be available in Microsoft Store but today it's available via msi x as well as several other mechanisms, the. Terminal, applications, written in c++, WinRT you, saw me use in c-sharp for some of the stuff etc etc etc the. Point I'm trying to make here and I hope you all understand is that there's. A lot of this technology that, is embedded. Across, all these different things that we're looking at that we are using ourselves, at Microsoft, and these are the same things that we're providing to you to be able to build your own applications. So everything, that we do you can also do here. If. You want a deeper dive into what's going on in terminal and wsl there, are two really great sessions, that are coming up on that the. The first one is just about terminal like I said and the second one is about, wsl, and they really go into like great detail on those and those are also on that resources, link. Now. Let's talk about the browser. So. Some of the some. Of the biggest users of our command-line, tools and the technology, I was just talking about are, people who are developing web apps right but, you know there there are some complexities, with developing, web applications different. Browsers, have different, rendering, engines different JavaScript engines, etc and.
It Makes them kind of incompatible, so you have to test across all these different browsers. But. You may have heard that. We, have. Rebuilt. Edge our. Browser on chromium, so, we are with kind of majority, of the browser's on the internet now that supports chromium, for rendering, engine in JavaScript, and whatnot to make it much easier for you all to. Build applications that, are compatible with the maximum, number of browsers. If. You haven't tried new edge I encourage you to try it out there, are multiple different channels, so the canary, channel is kind, of for folks who want daily builds and. As soon as things make it from, canary they get into dev and from dev into beta and then, finally into stable right and each of these different channels you can have installed side by side on the same PC, I have multiple channels installed, on that one and. Then. You probably saw this the. New edge logo, all, right so when edge, is released, early. Next year, this. Is the logo that you're gonna see there so I think it's super cool. You. Know when, you're building applications, on the browser one of the primary ways to build those applications, are what are called progressive web apps PWA. S/p, WASR not. A proprietary, technology they, are a technology. That's supported, by all, the major browser vendors, and, have pretty. Close to equal support. Across all of those with. A couple minor differences, on iOS, but, edge is a great, source for a great host for pwace, as our chrome and all these other browsers, here and. I think the best thing to do is to give you a quick demo of how PWA. Is work and what they are. All. Right. So. Let me close. This for a second, close. That. Nose. Thank, you. Close. You all, right so. I have here. Go. Back to that in a second I have here this application, or this website called sound trap right and what, sound trap is is, it's, a digital audio workstation that's. Hosted in your browser right and with, the new version of edge you, can use technology. Like sound trap where it's using Web Audio and web MIDI and a couple other interesting. Technologies, there because. It's all fully supported, in the current browser so, what. I wanted to do or what I want to do is create, a local application. Version of this right and so one of the things that soundtrap, did is they get they went through and they were able to make, this a progressive, web app and they can make it a progressive, web app by. Adding. In some key, features that give, an offline, support and make sure that it works outside, of the browser so. If I go over here, to this pinned application, I have. Here. Is a sound trap application, again. You. See it's not hosted. There. We go it's not hosted, in the browser right, it, looks like an application, because. As far as we're concerned it's, an application, but, it's still, a online, or. Still. An online served, application. With, cached data locally, so all the things that you did to create the website all the things that that you. Had to do to develop this website to begin with come. Right down to the PWA, and then you can add these other couple features in which I'll talk about the, second to make it work again like truly offline and UC and it supports Windows integration, with some other features for example like, if, I go in here in the studio. And. If I go into. Here. We go if. I go into this project. All. Right if I go into this project I can actually record, like, this is something that you would only expect to see in an application that's. Like you know a C++, app on a PC but this all works with this web application here, I can, go and say record. Here, and. Record. And. It's. Gonna count down let's. See if this. Oops. Do I not have my volume up. Well. That's recording, let's see here. No. All right let's try it one more time. See. If my MIDI settings. All. Right. You. Know I hate it when USB goes to sleep let's, try this again. Refresh. All. Right well let's try this in the browser version for a second here not sure what happened with that so. It's the same thing imagine, that worked out of the browser let's try this in the browser. Going. To studio. Alright. Same project, again, this one's hosted in the browser same. Application. Alright, here is. Here's. That roads. And. Let, me let me hit record and see well let me check this settings, video. Settings no. Devices let's. Try this oh I. Think this cable is coming there we go loose, cable that's. Always a problem fresh. This. No. Device is on. Alright, I might have to come back to this one later trust, me it usually does work when you actually have things connected it but, if, you, actually connect, your devices to the PC then your web applications, can read them just fine and, access them just fine do you like you don't have to be building a native application to.
Get Access to these web standards technologies, and one, of the big things that is, important about pwace is these are web, standard, technologies, and all, you need to do is go to PW, a builder comm, and enter. In the URL of, the site that you want to convert if, I hit start here. It's. Gonna analyze, that site for me and it's gonna tell me if I have the things that are needed to make a great PWA, so it's gonna tell me about the web app manifest that, I have there and if that's appropriate it's, gonna tell me if I have a service worker or not and it's gonna make suggestions, based upon its findings, and if, I go into that I say choose. A service worker it. Gives me samples. Here of all the different. Type. Of service workers that I might need to enable this, application, to work offline and it gives you tailored code that are approved that is. Appropriate, to enable that there, are also snippets, for things like enabling, Microsoft graph for adding MIDI support for adding lots of other API, support, that are all built right into this so. If you have a website that you, think would be a great web application. And you want to provide that application. Like experience, for your users then, you know start with PW a builder calm, and and it'll. Help walk you through that process. All. Right. Get. Back to. Yes. I. Always. Picked that wrong one. There. We go all right. So. If you want to learn more so Jeff does a, talk, on I think it's Thursday, where, he goes into you know 45 minutes of detail on how to build PW, A's and he's, one of the guys behind PW, a builder calm so I highly, encourage you to attend that talk and, learn a whole. Lot more about what it takes to build PW, A's. So. Let's talk a little bit about web view so. The web view enables you to host HTML, content, in your native applications, and if you are familiar with that from working with WPF, it, was stuck with Internet Explorer for quite a long time in. Windows 10 we support edge HTML. So your you don't have to use IE for that and. Then we also have the webview 2 for chromium that is in preview, currently. Supporting, 132, C++. Applications. So. Let me go back over here. Show. You a little bit of a web. View on that. Now. If I go over to. Application. Here so, this is the WPF, application, that I had earlier. That we created that's a dotnet core app if, I open up the main windows Amal right. There. We go open up the main windows Amal I'm gonna add in some controls, here that that, render their webview so the first thing I'm going to do is add, a reference. So. Manage and you get packages. Browse. Toolkit. WPF. And. I. Think. Internet's having a bit, of an issue here. Might. Also be what was going on with that app. Hello. Let's. Try again. So. We'll get WPF, there, we go Microsoft. Toolkit WPF, web view that's a control that we want hit.
Install. Okay. I accept that License Agreement and. Now. It's just going to install that. Alright. So now we have this control, installed as part of the new get package or as part of this project if I go back in the wane the main window zamel. I'm. Going to add in a. Using. Statement, here so. XML. And as here. We go XML as. Toolkit. Toolkit. Look. It my, typing is terrible, alright, is. And. I want to actually pull up the right one do, you have this is a double you have PF project I need to make sure I pull up the correct, WPF. One here and not the win32 one and so that's gonna give me access to the web view so, if I type toolkits, :. Web. View now. There are two different ones there's, web view and web view compatible, web, view compatible, is what you use if you also want to run your application on Windows 7 so. I'm gonna say web view compatible, name is. Web view. Just. To confuse. Things. Alright. And. Close. That out. Now. I'm gonna go into the code behind here and what I want to do is when this application loads, up I want it to automatically. Pull up a specific website so I say loaded event. All. Right and I'm gonna navigate on, that so I say webview. Dot. Dots. Oops. Did I mess. Something up on the previous one let's go back over to Maine Maine, when there's mo let's, look at whether you whether, you oh I, see lower case go. Back. And. There, navigate. And. There's. A site called what is my browser comm and. What. That's going to tell us is what browser it detects so, if I run this. Here. Yes. I'm gonna save that solution, that's fine if. I run this here it's going to tell me that we're using, version. Of edge. So, it pulls up and there. Is the browser control in there the, web view controller says it's running edge 44, in Windows 10 now, I, mentioned, that this works on Windows 7 as well so if I go over to my VM for Windows. 7 didn't. Probably didn't expect to see Windows 7 here today but here you go, I'm. Going to run, that same application so. If I go to this Ignite folder demos.
WPF. WPF. App. And, debug. That. Core app 3 there we go there's. A WPF, app if I run that and. Script. Error because it's ie that's why you're gonna get a script error on this no cuz that page is using some stuff that's unsupported, but if you look here it does render it using IE and it says is in fact using Internet. Explorer 11 on Windows 7 I didn't recompile, the application I, didn't change anything it is a dotnet core app that runs across both of those. All. Right let, me close this oh and. Actually because, it's gonna lock that file I'm going to exit. That as well all. Right so. I've got just a couple of minutes here and I want, to talk about a few other things I, think. The easiest thing here to do is just give, you a couple other demos here at the end the. Technology. I talked about called zamel islands, so, zamel islands make it possible for you, to incorporate, functionality. From. Uwp into, your applications. So here. Is a Northwind, trade traders, application, this is a uwp, application, and, if I look here manual, quote this. Application, has been designed. For touch it is the field application, they have it on a tablet, when they're out you. Know getting quotes from people right but. It's designed for touch but I want to be able to reuse this same UI in, the application. That was designed for the people who are sitting in the office at the phone taking. Customer quotes, so. Here is that application, that sits inside the office you see we have actually the same type, of ability. Here for gathering, quotes from people and provide information we've. Also added a little bit of you WP. Sugar. There with this 3d, rotating, a solar panel but, this application. This is a WPF. App, right the, pain on the right is. You, WP host it inside that WPF, app and then. We didn't have to change anything about that you WP code or anything about that to be able to use that inside. Our WPF, application, so it's a great way to use, to, reuse, that UI now. One thing that is weird is because it was optimized, for touch and pen and not, for mouse and keyboard it's, kind of big and chunky in the way it looks right like you want something that's more compact, so, you WP does now have support for more compact, layout of controls, as one of the styles so I just clicked I just turned that on and now we have a more mouse, and keyboard optimized. Version, of that but, again you, WP app uwp code being surfaced, in and reused, in your, WPF, applications. Okay. And that's, the same technology, that's being used to make that. Web, browser control work now. There's one last thing I want to show you here today and that is MSI, X now MSI, X is the, packaging, technology, that we're. Kind of betting on moving in the future it's. Or or. Enhancing, in the future so. I'm gonna add a, new project here. And. This. Is gonna be a packaging, project. Oops. Add a new project come. On. Iterate. Is having a hard something's having a hard time here today, pack. There. We go very bizarre alright so here's a Windows application packaging. Project, I hit. Next I'm, gonna create that and I'm, going to pick the latest SDK all, the same things we would do for you WP and notice, this is in the same solution, with that WPF, dotnet core application, I built and I'm. Gonna add a reference from.
This Application. So, go to. Applications. Add reference. It's. Gonna have, our WPF, app I hit. OK and that's. Gonna now. It is able to package this application, up right and so I can now package, this application, and get application, identity, for this so, that I can use you, know Windows 10 features I can use notifications I can use a lot of the stuff there and. I can also have a really nice way to package, and deploy this that works very much the same as click, once I'm. Going to skip, building, this one out here for, the moment but, you can also use this across, platform, because again, MSI. X is something that we've invested, in to support all, the different operating systems, it's open source it is available, on, github and it works like I said with Linux as well as other. Mac. OS etc, so, I can actually go into. Command. Here, if. I, pull. Up command. Shell and. I. Can, call, our I can package an application, from the from, Linux so, I can say let's say let, me go over to. My. WPF, app. Alright. So there is WPF. Linux which is an application packaging, project that I created earlier or. A student is a application. That I compiled earlier I'm going, to paste in the command line here that is going to. Call. Make MSI ex-excuse. Me tries, one more time. Make. MSI, X. Yeah. All right so I don't know what's going on there make, him make. MSI. X-pac. D. Is WPF. Linux, and. The. Package. Is food on MSI, X so. Now that's packaged there so if I if I look at this I now have food at MSI X one, thing that we are working on that's not supported, yet though is, actually. Signing that here, from Linux. Right. Now you do have to go to Windows and sign that but we do have some stuff that's in progress there so if I go this. WPF, directory. Here inside, windows, I say. Windows V there is a sign tool, call. That I can make. So. There we go so now I have signed that with my certificate. From, Windows, so I built, the pen so I built the application, on Windows I packaged.
The Application, on Linux I have, signed the application back, on Windows again. And if I want to I can go over here to Windows seven and. Looking. For my. PF. There. We go so there's the food MSI, X I can double-click that on, Windows, 7 I hit, yes, install. This WPF, app install, and launch it, and, there. Is our same application. That we were looking at before packaged. On another, operating system so I thought that was pretty cool and something I want to make sure you get a chance to see today, so. To wrap this up. The. Reason we did that with with. MSI X is to make it so that regardless of, the operating system that your tool chain is running on you, are still able to package these applications. You. Know for Windows or for other operating, systems, so if you have a tool chain that's running on Linux you can still call make MSI, X and you can still package those there you can also compile, the applications, using dotnet, core regardless, of the operating system that you're on of, course WPF, and windows forms and those similar ones are gonna be, compiled on Windows first okay. And with. That let me just pull up the list of some. Of the other resources, we have here for you today. They. Pull us up and. Hello. There we go. Don't. Evaluate here we go come. Back. Err. Err, there there. There. You go uh so, thanks so thank you very much sorry for the rush there at the end, but. Here, are the resources that, you'll, need to be able to look further into these applications, or look further into all the technology, I'd said today and do, please I had to kind of boil the ocean with, Microsoft, technology here I encourage. You to please check out some of the other sessions that can, give you much, more in-depth. Views of technologies. Like PWA like edge like. MSI etc. So with, that I'll be outside in the hall afterwards, so thank you very much.
2020-01-18 04:33
