Translated from 日本語 • View original Hello, this is Akiyama, an Azure engineer. In this article, we'll show you how we hosted a static site with Azure Web App.
Premise
- Uses the site generator Jekyll
- Partially using PHP
- Users who update the site don't know or want to be aware of Jekyll
Composition
The configuration is simply to use the Web App as a website. If you only have static files, you don't need to use Web App, which is the PaaS of your website, but some of them have a requirement to use PHP, so we have adopted Web App.
Deployment Flow
We will explain it step by step.
This time, we will use a service called CloudCannon as a CMS. This service allows you to update and fine-tune pages without being aware of Jekyll and without being an engineer. (Step 1)
CloudCannon is compatible with GitHub. You can preview the 'jekyll build' content in real-time on CloudCannon and update each page. (Step 2)
I want to upload the updated content here to Azure Web App, and I'm using Travis CI as the build engine for that. Travis Ci's role is to 'jekyll build' the repository on GitHub and push the resulting content to Azure Web App. (Step 3-6) Azure Web App provides the ability to deploy Git , so we take advantage of it.
Effects
I built this deployment flow at the beginning of site creation. This allows you to see how it behaves in production from an early stage.
You can check the design on CloudCannon, but the web server may be different from the web app, so in these cases, you want to check it in production as soon as possible. As a result, there were no major problems, and we came to the publication of the site.
Conclusion
We often see examples of building static sites using AWS S3, but we don't see many examples of creating static sites in Azure, so we wrote an article. I wrote it as an example configuration using a web app, but there are other patterns that use Azure Function + Azure Blob Storage. If I have the opportunity to apply it as an example, I will introduce it again. If you would like a static site with a DevOps environment on Azure, please feel free to contact us.