AiA 144 Azure and Angular with Shayne Boyer

On today’s episode of Adventures of Angular we’ve got panelists Ward Bell, Joe Eames, Alicia Michael, John Papa, Charles Max Wood, and our special guest Shayne Boyer. Shayne is a Senior Developer Advocate at Microsoft and on the Azure team. The last time he was on the show was Episode 082 of Adventures in Angular and we talked about getting started with Angular 2. Today we are going to talk a bit about Angular and Azure. Stay tuned.

[3:12] Talk about offerings with Azure.

• There is a connotation that if you want to use Azure you have to use .NET
• That is not the case.
• Large part of Azure runs linux.
• There are over 170 type products that Azure offers.
• noSQL databases, postgres, mongolDB, Azure Cosmos, Azure functions
• It’s more than .NET and VMs.
• Things you can do this type application are things like - Deployment to web front end, putting apps in Docker container and pushing to container service, scaling those apps etc etc.

[5:23] Put your app in Docker container?

• Talking about just front end. Just the web application.
• Putting it into a container and deploying the container into a linux instance or web app on Azure.

[6:13] Why is it a good thing to use Docker for this kind of thing?

• Example. NGX for front end services, you can’t NGbuild using ClI do an NGBuild get the disc folder and throw that to a web application service like IAS or Node and have that application just service. Deep linking wouldn’t work.
• Instead you would want to package something like an express server that requires NodeJS. Then something to handle deep linking. You can easily package that in a container and push it to the cloud and be able to control it without worrying about infrastructure.
• Essentially it’s the app that has been written as well as the server that serves that app.
• You can choose the base it runs on. I.e. Node 6 instead of 8. Etc etc.
• Control those in the container so any time you pull it down it has those same settings.
• Often developers assume versions of services are the same between the developer and the services used like a cloud service and when it’s not, things break.
• The concept of “works on my machine” is actually true now. How it works for you, will be exactly how it works where ever you push it.
• You can set up the version of Node you want, the settings how you’d like, test it on your own machine and when you push it to providers like Azure, Heroku, AWS, etc, it will run the same on all those providers.
• Takes away complexities when testing.

[9:39] Outside of Docker, what other things does cloud bring to the table?

• Serverless offerings.
• Takes away issues with - worry about building a node server to serve my app. Building API to serve the data. Building Infrastructure behind the server and deploying it.
• Building and deploying pains reduced as well.

[10:57] “Wait wait, serverless?”

• It’s the new buzzword.
• There are servers underneath.
• Don’t have to worry about infrastructures or the servers themselves.
• Just write the function.
• Function will return the data to controller service built in Angular. Just have to build the Javascript (or python, and C#, java is coming) in the portal or in Github, and it’s just the code to run the function.
• No need to worry about the types of servers, VMs, operating systems, patching or scaling.
• It will scale based on what the capacity demand it needs.
• Event driven - event queues, message queues, etc.

[13:20] Simple endpoints

• Scalability at endpoint level.
• Previously when writing APIs on the backend, typically you’re concerned with scaling that API application.
• Endpoints typically scale at the same level.
• Serverless functions scale at that typical API level.
• Paying only for usage.

[15:30] How do you orchestrate between the services?

• Just because you spread things around doesn’t mean it’s better.
• It’s important to realize that breaking assembly or dll files down into smaller dll files don’t change things much.
• Minimizing what it takes to think about when it comes to handle and configure a server running the services.
• It’s easy as “Here it is, go run it for me Azure!”

[20:12] How does this relate to angular developers?

• Be careful about over complicating the ‘concept count’ Having too many systems, front end, back end, VMs, Docker, etc. To many things to learn or to know to get it done.
• Easier to write API and serverless. So then it’s just Javascript on the front end. Much easier.

[21:58] Someone brand new to Azure, what should they try out?

• Azure functions is a great place for Javascript or Angular.
• Typescript is coming as well.
• Understanding it’s just a backend.
• Learning to connect to a database, or have a static file.
• Routing, proxies, etc are all built in Azure.

[23:13] What JavaScript engine does it support?

• Chakra Engine.
• ES 5
• ES 6
• Support for TypeScript recently announced. Coming up.
• Node 8 is now available on Azure service platform.

[25:04] More on the portal.

• The portal is one of the largest typescript platforms available right now.
• The portal is not the only option.
• Strong CLI experience.
• Making VMs and web applications and all products can be done with CLI.
• If you like CLI then start there.

[26:54] Creating a quick web app

• If you want to create a new web application.
• Simple as AZ web create
• Pass the name of application
• pass the location
• in a few commands you can create an app
• Set it up to deploy from the GitHub Repo
• From there it’s just checking in code and it’s getting the deployment from the CLI pipeline.
• Write it, check it in, deploy.

[27:32] Do you have articles or videos that people can jump to?

• Did a course in deploying an angular app using GitHub git Azure
• Talks about how to hook up Azure web app instance to a GitHub repo.
• It’s easy as checking in code, no worries about the concept count and complicated setup.

[28:45] Integrates with Docker and Visual Studio Code

• There is an Azure extension for VS Code that allows you to push all of your code.
• Demos available to learn
• Has great extensions for Angular too.

[29:28] Simplifies or eliminates complications on the back end, does it also help on the front end.

• Don’t have to worry about scaling my static site. Data is what makes it scalable.
• Serverless experience - hitting databases, doing computations, working on triggers or WebHook from other parts of your business.
• Azure function can listen to WebHooks
• Azure can aggregate backend in serverless functions.
• Has database offerings to store data.
• Infrastructure for hosting Node applications and Node APIs
• Azure does not = .NET

[31:19] How does someone get involved and try it out?

• Go to Azure.com and try it free.
• Try the Azure functions portal free as well.
• Plenty of free experiences from the platform.
• The tuts and walk-throughs for almost any of the platforms or languages for Azure.

Picks Joe

John Papa’s course on Angular CLI course.
NG Doc.

Ward

Troy Hunt used Azure functions to fight DDOS attacks article.
Alexa

Charles

Serverless framework. NPM serverless.
Angular Dev Summit (Now free)

Shayne

Keyvo Smartlock
Angular 2 app to Azure using Git play by play course.
Docs.microsoft.com

Links

Azure