How To Host an Angular Static Website on Azure

A step by step guide with an example project

Bhargav Bachina
Bachina Labs

--

Photo by William Iven on Unsplash

There are a number of ways you can build a website with Angular such as Java with Angular, NodeJS with Angular, NGINX serving Angular, etc. For the single-page applications, all you need to do is to load the initial index.html. Once you load the index.html the Angular framework kicks in and do the rest of the job like loading component, calling API calls, etc. What if there are no backend calls and you want to build a static website with Angular?

Azure CDN with blob storage is one of the options which provides low cost and highly reliable static website hosting solution. These static sites have only CCS, HTML, JS files, fonts, etc. In this post, we can see how we can build a static website with Angular and host that on Azure.

  • Example Project
  • Prerequisites
  • Host Static Website With Azure Blob Storage
  • Deliver With Azure CDN
  • Summary
  • Conclusion

Example Project

Here is an example project which we can put in the Azure blob storage for static website hosting. This is a simple profile page with a header and some sections.

--

--