Migrating a Full Stack MySQL Web App from Google Cloud to Microsoft Azure: Step-by-Step Guide

This post has been republished via RSS; it originally appeared at: New blog articles in Microsoft Community Hub.

Introduction

Migrating a full-stack application can be an intricate job, even if you are using the same technologies on different clouds. Some things need to be done in order to have a fully functional application. If both platforms support the programming language and version, then that's one thing to put aside and start working on figuring out how to connect the database. Databases differ in the language they speak. You can use a universal dialect like SQLAlchemy that facilitates communication with multiple databases like MySQL. The last problem is to provide the application with the credentials it needs in a way it understands to establish a connection. Once you are done and the database is up and running. Here, comes the part where you look for a tool to import your data. Luckily, mysql CLI provides a command that you can use to import your data.

 

In this blog, you will go through a step-by-step guide, from preparing your Full-stack web application to be deployed to Azure and exporting your data from Google Cloud SQL to deploying your application to Azure App Service, migrating your MySQL database to Azure Databases for MySQL and connecting it to your application.

 

We have got you covered whether you already have a full-stack application working on Google or looking to bring your first full-stack application to the Internet. You'll learn everything you need to do to deploy your website to Microsoft Azure.

 

What will you learn?

In this blog, you'll learn to:

  • Export a database from Google Cloud SQL to Cloud Storage and save it locally.
  • Create an Azure Web App to host your application and a MySQL database to store your data.
  • Fork a GitHub repository and configure continuous deployment from GitHub to Azure App service.
  • Modify the application environment variables to bind the app with the database.
  • Import data to MySQL database using mysql CLI inside Azure App service SSH session.

 

What is the main objective?

Migrating a Full stack application from Google Cloud to Microsoft Azure including a Python web app and MySQL database.

blog-thumbnail-mysql.png

 

Prerequisites

  • An Azure subscription.
  • Web Application Source Code from GitHub.

 

Summary of the steps:

Step 1: Export your Data from Google Cloud SQL.

Step 2: Create an Azure Web App and a MySQL Database.

Step 3: Fork the Code and Configure Azure App Service Deployment.

Step 4: Configure Azure App Service with your Relational Database.

Step 5: Import your Data into Azure MySQL using Azure App Service.

 

Step 1: Export your Data from Google Cloud SQL

Google Cloud SQL provides you with the ability to export your database as a SQL dump file which can be used to recreate the whole database with all its tables and data anywhere you want.

 

In this step, you export your data from Cloud SQL to have a potable and reusable copy from your entire database.

 

Complete the following steps to export your data from Cloud SQL in Google Cloud:

1. Visit the Google Cloud Platform console.cloud.google.com in your browser and sign in.

google-cloud-console.png

 

2. Type cloud sql in the search bar at the top of the console page and select SQL from the options that appear.

search-cloud-sql.png

 

3. Select the Instance ID of the Cloud SQL instances that you want to export.

select-db-mysql.png

 

4. Select Export from the top navigation menu to export your database.

select-export-mysql.png

 

5. Perform the following tasks to export data to Cloud Storage:

What Value
File format Select SQL.
Data to export Select the name of the database that has your tables and data.
Destination Select Browse to choose a cloud storage bucket. Currently, the only supported destination is Google Cloud Storage 

 

export-data-to-storage.png

 

6. Select the + icon to create a new bucket. 

select-create-bucket.png
7. Enter a globally unique name for your bucket followed by selecting CREATE. Leave all the other options to the default values as you will delete this bucket later.
create-temp-bucket.png

 

8. Select CONFIRM to proceed with the creation process. This prompt asks if you want to make the bucket open for public access or private, private will work for you.

confirm-create-bucket.png

 

9. Select the SELECT button to select the newly created bucket to save your data inside.

select-bucket-save.png

 

10. Select EXPORT to confirm your selection and initiate the data export process.

select-button-export.png

 

11. Select the name of the file from the notification pane at the bottom right of the screen to redirect you to the storage bucket that has the exported file.

select-file-name.png

 

12. Select the DOWNLOAD button to download the data locally to your device.

download-bucket-file.png

 

13. Select DELETE to delete the bucket after the download finishes as you no longer need it.

 

Congratulations! You successfully exported your database from Google Cloud SQL. The application source code is available on GitHub so, there is no need to do anything from the Application side. In the next step, you'll create an Azure Web App and a MySQL database.

 

If you don't have a database on Google Cloud and want to follow along you can use my data export file Cloud_SQL_Export_2023-10-15 (22_09_32).sql from john0isaac/flask-webapp-mysql-db . (github.com).

 

Step 2: Create an Azure Web App and a MySQL Database

Azure App Service is an HTTP-based service for hosting web applications, REST APIs, and mobile back ends. You can develop in your favorite language, be it .NET, .NET Core, Java, Node.js, PHP, and Python. Applications run and scale with ease on both Windows and Linux-based environments.

 

In this step, you create an Azure App service to host your Python application and a MySQL database to store the migrated data.

 

Complete the following steps to create an Azure Web App and a MySQL database in the Azure portal:

1. Visit the Azure portal https://portal.azure.com in your browser and sign in.

JohnAziz_0-1697401049018.png

 

2. Type app services in the search bar at the top of the portal page and select App Service from the options that appear.

search-app-services.png

 

3. Select Create from the navigation menu followed by selecting Web App + Database.

select-create-webapp-database.png

 

4. Perform the following tasks:

In the Project Details section,

What Value
Subscription

Select your preferred subscription.

Resource group

Select the Create new under (New) Resource group to create a new resource group to store your resources. Enter a unique name for the resource group followed by selecting OK.

Region

Select a region close to you for best response times.

 

In the Web App Details section,

What Value
Name

Enter a unique name for your applications. This is the same subdomain for your deployed website.

Runtime stack Select Python 3.8.

 

create-webapp-database-1.png

 

In the Database, Azure Cache for Redis, and Hosting sections,

What Value
Engine Select MySQL - Flexible Server.
Server name Enter a unique name for your server. This is the place that will host your different database instances
Database name Enter a unique name for your database. This is the instance that will store your tables and data
Add Azure Cache for Redis? Select No. Azure Cache for Redis is a high-performance caching service that provides in-memory data store for faster retrieval of data but will incur more charges to your account.
Hosting Plan

Select Basic. You can scale it up later the difference between the two plans is their different capabilities and the cost per service you are receiving.

 

create-webapp-database-2.png

 

5. Select Review + create.

 

6. Save the Database details in a safe place as you need them to connect to your database. This is the only time that you have access to the database password.

save-parameters-select-create.png

 

7. Select Create to initiate the deployment process.

 

8. After the deployment finishes, select Go to resource to inspect your created resource. Here, you can manage your resource and find important information like the Deployment center and configuration settings for your website.

select-go-to-resource-app-db.png

 

Congratulations! You successfully created a web application and a database with a single button this enables you to deploy your code and migrate your data later to them as the website and database are initially empty. In the next step, you will get the website code and deploy it to Azure App service.

 

Step 3: Fork the Code and Configure Azure App Service Deployment

The sample code you are using is an Artists Booking Venues Web Application powered by Python (Flask) and MySQL Database.

 

In this step, you'll:

  • Fork a GitHub repository on GitHub.
  • Configure continuous deployment from the Deployment center on Microsoft Azure.

 

1. Visit the following GitHub repository john0isaac/flask-webapp-mysql-db . (github.com) in your browser and sign in.

 

2. Select Fork to create a copy from the source code to your own GitHub account.
fork-github-repo.png

 

 

3. Navigate back to your newly created deployment on Microsoft Azure. Select Deployment Center.

select-deployment-center.png

 

 

4. To link your GitHub repository with the Web App, Perform the following tasks:

What Value
Source Select GitHub.
Signed in as

Select your preferred Account.

Organization

Select your Organization. This is your GitHub username if you haven't forked the repository to an organization.

Repository Select the name of the forked repository flask-webapp-mysql-db.
Branch Select main.

 

configure-deployment-center.png

 

5. Select Save to confirm your selections.

 

6. Wait for the deployment to finish. You can view the GitHub Actions deployment logs by selecting the Build/Deploy Logs.

 

view-deployment-logs.png

 

7. Once the deployment is successful, select the website URL from the deploy job to view the live website.

view-live-website.png

 

Congratulations! You successfully deployed a website to Azure App Service and as you can see the website works as expected.

fyyur-live-website.png

 

But if you try to navigate to any page that needs to make a call to the database you get the following error.

db-error-website.png

Let's go ahead and solve this error by configuring the database.

 

Step 4: Configure Azure App Service with your Relational Database

This web application uses SQLAlchemy ORM (Object Relational Mapping) capabilities to map Python classes defined in models.py to database tables.

 

It also handles the initialization of a connection to the database and uses the create_all() function to initiate the table creation process.

setup-db-create-all.png

 

But how do you trigger this function to make all of that happen?

 

If you navigate to the beginning of the app.py you will find that in order for the application to call the setup_db() function it needs an environment variable called DEPLOYMENT_LOCATION.

 

check-deployment-location.png

 

You may wonder, why are we using this? The answer is quite simple, different deployment locations require different database configurations.

Feel free to check out the difference in the environment folder.

 

Let's go ahead and define this environment variable to start the database creation process.

 

1. Navigate back to your web app on Azure and select Configuration from the left side panel under the Settings label.

select-configuration-left-side.png

 

2. From the Configuration window, select + New application setting to add a new environment variable.

select-new-application-setting.png

 

3. Add the following name and value in the input text fields followed by selecting Ok.

Name Value
DEPLOYMENT_LOCATION azure

 

add-deployment-location.png

 

4. Confirm that DEPLOYMENT_LOCATION is in the list of Application settings then, select Save followed by selecting Continue.

select-save-application-setting.png

 

5. Wait a couple of seconds then, refresh the website to see the update.

view-live-website-empty.png

 

Congratulations! It works but wait a minute... Where is the data? Everything is blank!
You haven't imported the database yet but now the website is connected to the database and the tables have been created, which means that you can insert new data from the website, update, and delete it but you don't have access to the old data yet. In the next step, you will work on importing your data using the SSH feature from Azure App service.

 

Step 5: Import your Data into Azure MySQL using Azure App Service

This application and database are deployed to a virtual network so, you can't access them unless you use a virtual machine deployed to the same virtual network and that's why you are going to make use of the SSH feature in your web app to access the database through the web app and import your data.

virtual-network.png

 

To import the data you need a database dump or a .SQL file uploaded to your GitHub repository. If you don't have that you can use my database export from the repository that you forked from here.

 

Let's go ahead and SSH into the website.

 

1. Navigate back to your web app and select SSH from the left side panel under the Developer Tools label.

select-ssh.png

 

2. Select Go -> to open the SSH session in a new window.

 

Inside the ssh session, perform the following tasks:

3. Execute this command to update the installed packages.

apt-get update

 

4. Execute this command to install mysql as it doesn't come preinstalled. If prompted Do you want to continue? type y and press Enter.

apt-get install default-mysql-server

 

apt-get-commands.png

 

5. Execute this command to import your .SQL file data to the MySQL database. The file referred to in this command was uploaded with the website data from GitHub.

mysql --host=$AZURE_MYSQL_HOST --user=$AZURE_MYSQL_USER --password=$AZURE_MYSQL_PASSWORD $AZURE_MYSQL_NAME<'Cloud_SQL_Export_2023-10-15 (22_09_32).sql' --ssl

 

Note that I had to clean up the exported SQL from Google Cloud a little bit but I didn't add anything to it I just removed the unnecessary to avoid errors in the ssh session.

 

6. Navigate back to the website, refresh any page and you'll find all the data there.

live-website-data.png

 

Congratulations!!! you have come a long way taking the data and web application from Google Cloud to Microsoft Azure through all the steps in this blog.

 

Clean Up

You can now safely delete the Google Cloud SQL database and disable your App Engine or even delete the whole project.

 

Once you finish experimenting on Microsoft Azure you might want to delete the resources to not consume any more money from your subscription.

You can delete the resource group and it will delete everything inside it or delete the resources one by one that's totally up to you.

 

Conclusion

Congratulations, you have learned and applied all the concepts behind taking an existing Python web application and a MySQL database and migrating them to Microsoft Azure.

This gives you the ability to build your own web applications on Azure and explore other databases like Azure Cosmos DB or Azure Databases for PostgreSQL as you will find that at the end you just need a connection string to connect with a different database and a dialect to translate your code to a language that the database understands. You have also learned that you can deploy your website to Microsoft Azure by selecting your website's programming language, no extra configuration is needed or creation of any file.

Feel free to share your comments and/or inquiries in the comment section below.
See you in future demos!

Leave a Reply

Your email address will not be published. Required fields are marked *

*

This site uses Akismet to reduce spam. Learn how your comment data is processed.