This is the Master Thesis of Qiwen Gu, a student of INFOTECH, University of Stuttgart, Germany.
A web-based tool for assisting the developers to guide their architectural refactoring process based on specific scenarios.
Terms: micro-services, monolithic migration, architectural refactoring, web demo.
- Getting Started
- Installing on Local Machine
- Deployment on Microsoft Azure
- Running the web-based tool
- Built With
- Author
The following instructions will enable you to build a local environment for development and running purposes. See deployment for notes on how to deploy the project on a live system.
In order to use and rest the web-based tool, the following prerequisites should be fulfilled, and detailed set up processes are illustrated in "Installing on local machine" section.
- Windows Operation System
- A web browser
- PHP scripting language for web development
- MySQL Database
- Apache HTTP Server
In this section, a step by step series of process will show you how to set up a development and running environment to use the web-based tool.
Download XAMPP for Windows, a free and easy to install Apache distribution containing PHP and MySQL.
After the installer is downloaded from official website, you can run the installer as an administrator.
In some cases, alert windows may pop up to inform you that an antivirus software is running, or an activated User Account Control (UAC) may restrict some functions of XAMPP. It is fine to ignore these alerts and continue the installation process.
In next step, you can select the components to install. In this case, Apache, MySQL, PHP and phpMyAdmin are included as major components in order to build a complete running environment.
Necessary components in XAMPP installation
Then, a installation folder is selected, and it is recommended to use the default folder in system disk to avoid user authorization problems in the future.
Select installation folder for XAMPP
Finally, click "Next" button until the installation and configuration processes are finished. And the running environment is successfully set up.
Start Apache and MySQL module in the XAMPP Control Panel.
You can start the installed XAMPP Control Panel and you can see many action buttons for different modules. Here, we can start Apache and MySQL module by clicking "Start" button for each module.Then you can see the activated modules and their connecting ports.
XAMPP Control Panel
If there are errors encountered during the starting process of Apache, the possible reasons may be as following:
- The service is not yet started.
- Solution: Run "Services" as administrator on Windows, find Apache (Here "Apache2.4") and click "Start" to start the service.
Start Apache service
- The port is occupied by other applications.
- Solution: Click "Config" button for Apache module, select "Apache (httpd.conf)" file and open with Notepad. Next, search "Listen" in the file, and you can change the port to another free port and avoid conflict.
Change Apache listening port
Import "migration.sql" schema and data into MySQL.
The "migration.sql" is a database which contains a table called "contribution". It includes both schema and data.
The XAMPP contains phpMyAdmin, which is a free and open source administration tool for MySQL. You can click "Admin" button for MySQL module in XAMPP Control Panel, and use it with a web browser.
Open the phpMyAdmin window
In the phpMyAdmin page, first a new "migration" database should be created by clicking the "New" link on the left. Then, you can click the "Import" section, and choose the local "migration.sql" file to import the data table "contributions" into MySQL.
Create new migration database
Import sql file to MySQL server
Specifically, the database allows a normal user (shown in the red box) to select data from the table. This is the only privilege assigned to the user, which is enough for the application and therefore can prevent data from unintended update. The developer can update, add or delete data using phpMyAdmin administration tool directly with a web browser, having the full privileges for operations.
User's privilege
If you want to add a new user, you can click "Add user account" link in "Privileges" section. Then you can set user name, host name, password and privileges you want to assign to the new user. The following picture is an example of the existing "user" for this web-based tool.
Add a new user
User's setting example
Coding capability error may encountered during the import process of phpMyAdmin, the possible reasons may be:
- The sql file is encoded with a different coding format.
- Solution: Open the sql file with Notepad, and save it as another coding format which is consistent with phpMyAdmin setting (Here "utf8mb4_general_ci" is used).
Put the project (repository) folder into XAMPP htdocs folder.
In order to make the code files runnable in local environment, the project (repository) folder should be places in XAMPP htdocs folder (Here "C:\xampp\htdocs"). XAMPP treat this folder as local host and its code file is accessible by web browser. Specifically, the php code as well as HTML, Javascript can be executed by web browser and they act as a web application locally, enabling us to test and use the web based tool early and intuitively.
In this section, a option to deploy the completed web-based tool on Microsoft Azure will be illustrated, so that public users can have access to the tool and utilize the tool from external IP addresses. The steps for deployment refers basically to HOWTO - Deploy a PHP Application on Azure by Mark Reha.
Register or log in Microsoft Azure.
Microsoft Azure is a cloud computing service created by Microsoft for building, testing, deploying, and managing applications and services through Microsoft-managed data centers. After log in , you can create a new resource for the web-based tool and online database.
Create an App container and corresponding online MySQL database.
In the Microsoft Azure Home Portal, we can click "Create a resource" in "Azure services". Then, we input "Web App + MySQL" in search bar and create a container that can be configured to support PHP and MYSQL.
Create new service
Next, we can set the App name (here I named it "microservicewebbasedtool"), Subscription, Resource group, Service plan, Server location, and other settings to create a new App container. After the "Create" button is clicked, Microsoft Azure will start deployment process, which may last several minutes to deploy new resources.
New service setting
Configure the App and migrate database.
The created App resources are accessible via Microsoft Azure Home Portal in "Recent resources" section. If we click the corresponding App service "microservicewebbasedtool", a new App service page will be shown.
Microsoft Azure Home Portal
In this App service page, we can see various information such as URL, service status and so on.
App service page
At the lift hand side of the page, we can see a list of options which are used for functionalities such as App configuration, Activity log, Access control and so on. Particularly, in "Settings - Configuration", the PHP version, HTML version, Platform and other applied techniques can be configured straightforwardly.
App configuration page
In addition, in "Settings - MySQL In App", we can manage the online database, after turn the database service on, the database sql file can be imported into the online database. If we click "Manage" link on the top of the page, we can go to online phpMyAdmin portal. This portal is same as previous local one, and the import process is also same. We can refer to the previous section and complete the database import easily.
MySQL In App page
Import the App source code into container.
After database is imported, we can import the web-based tool source code in to the container. By click "Development tools - Advanced Tools - Go", we come to KUDU environment. Here, we use the CMD debug console, because it is common and only simple command coded is required. Also, operations can be done graphically in directory system easily.
KUDU for deployment
In KUDU environment, the web page files should be located at the "home\site\wwwroot" directory. There exists default APP code and should be deleted completely. After that, we can create a new App directory called "myapp", and the source code ZIP file can be dragged into the directory. The KUDU will automatically unzip and copy the source code files into this directory.
Code import in KUDU
Configure MySQL database configuration and adapt App code.
The code and database, which are developed in local environment, should be adapted so that they can fit the online environment. In this step, we will use the console with command code. First, we start in "home\data\mysql" directory, and the code example is given as following:
D:\home\data\mysql>ls
D:\home\data\mysql>type MYSQLCONNSTR_localdb.txt
By executing "ls" command, all files within the target directory will be listed, and we use "type"command to dump the content of "MYSQLCONNSTR_localdb.txt", and the information about database connection, such as server name, database name, user name, and password will be printed out in the console. Then, for each source code file which uses methods for database connection, their parameters should be changed according to these information. In our project, the "search.php" and "result.php" should be changed. This can be done in directory system by clicking the edit icon and changing the source code online.
Online database connection parameter change
Finally, in the App overview page, the URL is available in the top right corner. We can copy and share this URL to other users, so they can visit this web-based tool by the URL externally. For instance, my public URL is https://microservicewebbasedtool.azurewebsites.net
In this section, the introduction about the use of web-based tool is introduced.
The web-based tool enable users to select different properties and search for guidelines to choice refactoring techniques and approaches based on their specific system.
First, open the web browser (e.g. Chrome) and input the public URL
https://microservicewebbasedtool.azurewebsites.net
or input the following local URL:
http://localhost/MasterThesis/index.php
As mentioned before, "localhost" indicates "C:\xampp\htdocs", and "MasterThesis" here is the project (repository) name. The "index.php" is the php file containing scripts and html page, which should be run as a web page in the web browser.
Index page
In index page, you can select radio button for each property, and decide whether to include this property or not. you can also exclude or leave it as neutral. This selection is based on your own situation, in detail, what is your desired process strategy, decomposition strategy, technique type, validation type about the approach/ framework; what is your available resources of the monolithic application as input; what is your expected outcome type generated by the approach/ framework; what is your intension and quality requirement for the micro-service migration; what is your migration scenario... "Include" button means you want to have it in the migration approach, and vice versa. Additionally, "Neutral" means that you do not care about this specific parameter and leave it free to the approach/ framework. You can move your cursor onto each section title and wait for a while, then an explain of the terminology will pop out to aid your selection.
After selection, you can click "Search" button to perform searching. Additionally, you are also allowed to select nothing and leave all parameters as neutral, then the web-based tool will provide you a whole list of contributions from database. Besides, the "Reset" button in the bottom right corner can clear all previous selections and reset the whole web page.
After the search is conducted, a new search page will be shown. The search page shows the included and excluded properties decided by user, and number of results retrieved from database. The results are listed in "Recommendation(%)" order as default, and you can also change the order according to "ID", or "Year" , in ascend or descend order, by clicking the sorting buttons.
The "Score" indicates the quality of each contribution result and "Recommendation" indicates the degree of matching according to user's input. The result list also shows the missing string, where each contribution does not include specific properties chosen by user.
Moreover, for the contributions which are excluded by the user's search, the web-based tool also composes them as an excluded list and shows them after the search result list. So user can see what approaches/ frameworks do not fit his/ her requirement.
Search page
If you click one title in the result list, the web browser will open a new window and jump to the result page. It will show all information about this specific contribution. You can read the migration approach, including "Process Strategy", "Decomposition Strategy", "Technique Type", etc., and you can also click "Link to website" to jump to the original source website for further information. This page can provide you detailed knowledge about the migration information within its specific scenario, and provide you guideline whether it is also applicable to your system.
Result page
- XAMPP Version 7.4.8(PHP7.4.8) - The web-based tool local running environment
- Visual Studio Code Version 1.47.3 - Source-code editor
- Chrome Version 84.0.4147.105 - Used to run the web-based tool
- Microsoft Azure - Online server for deployment
- Qiwen Gu - Initial work - INFOTECH - University of Stuttgart - Germany
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent