This blog is about creating a CI-CD pipeline for a WordPress website that is deployed on Azure App Service. We will use Azure DevOps as our CI-CD pipeline tool, Docker for the portability of the WordPress website for the different environments (Local, Dev, Production), and Azure for the web app, Container registry, and database. This whole procedure is divided into two main parts:

1. Setting up the Azure infrastructure, WordPress, Docker container, and CI part.

2. Setting up the CD part.

The architecture will look like this:

Setting up the Azure infrastructure, WordPress, Docker container, and CI part.

Objective:

• Here we are using a single environment setup for the CI-CD which includes a local setup of WordPress which is going to be used for development and a staging environment on which the WordPress site will be deployed.
• We will setup the Azure Infrastructure by creating an app service for WordPress and create an Azure MySQL database for the WordPress web app.
• Creating an Azure Container Registry (ACR) to store the latest docker image of the WordPress site.
• After this, will setup a CI pipeline to build and push docker images.

Note: You can use this sample source code for Worpdress setup (Step 1 and Step 2.) and for Dockerfile (Step 3)

html folder: It is simply a WordPress folder that can be downloaded from WordPress official site.

Dockerfile: It is the docker file to build the image.

Step 0. Prepare and Configure the Azure Infrastructure.

• Create an Azure web app for WordPress (for containers).
• Create an Azure Mysql Database for WordPress.
• Allow Azure web app to make the connection with Azure Mysql Database.
• Create an Azure Container Registry (ACR).

Step 1. Setup WordPress on your local system.

You can check this link to setup WordPress on your local system.

Step 2. Push the WordPress folder on Azure Repos (Azure DevOps) or other distributed version control tools (Github or Gitlab).

Step 3. Create Docker File

Create a docker file to make the image for deployment in different environments.

Or you can use the docker file of the source code.

 FROM WordPress:4.9.1-apache
 
 COPY html /var/www/html
 
 RUN chown -R www-data:www-data /var/www/html/
 
 ENTRYPOINT
 ["apache2-foreground"] 

Push this dockerfile to the same repo used in Step 2.

Step 4. Create pipeline in Azure DevOps

Choose the docker template while creating the pipeline or simply add two docker steps in the CI pipeline to Build and Push the docker image.

1^st task is to build the docker image with the following values:

• Container Registry Type: Choose the Azure Container Registry (ACR)
• Azure Subscription: Choose the Azure Subscription
• Azure Container Registry: Choose the ACR created earlier.
• Action: Select Push an image
• Docker File: Select the Dockerfile
• Build Arguments: Check the box “Use Default Build Context”
• Image Name: can use the existing name or can modify as desired.
• Check Qualify Image Name box

2^nd task is to push the docker image to ACR.

• Container Registry Type: Choose the Azure Container Registry (ACR)
• Azure Subscription: Choose the Azure Subscription
• Azure Container Registry: Choose the ACR created earlier.
• Action: Choose to Push an image.
• Image Name: same as the previous task.
• Check the Qualify Image Name box.

Step 4. Enable Continuous Integration (Optional)

This step can be implemented later after we have checked that pipeline is working fine.

To enable CI, check the Enable continuous integration box.

Now, you can run the pipeline and check if its working fine.

This is the first half of the complete setup. You can check the rest of the setup here that has the CD part.