How To Host a Vue.js Static Website on Azure
A step by step guide with an example project
There are a number of ways you can build a website with Vue.js such as Java with Vue, NodeJS with Vue, NGINX serving Vue, 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 Vue library kicks in and do the rest of the job like loading components, calling API calls, etc. What if there are no backend calls and you want to build a static website with Vue.js?
Azure CDN with blob storage is one of the options which provides a 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 Vue and host that on Azure.
- Example Project
- Prerequisites
- Host Static Website With Azure Blob Storage
- Deliver With Azure CDN
- Uploading With Azure CLI
- 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.
