Everything About Deploying a PHP + MySQL Web Application to AWS EC2

Photo by Matt Brett on Unsplash

Introduction

I recently wrote a PHP + Vue.js application as part of the coding assessment from a company, as a simple CRUD app it’s honestly not that hard, but when it comes to deploying it on AWS EC2, it did take some time for me to figure it out, and that’s the reason I’m writing this blog to help anyone might looking for a tutorial about deploying a PHP application to EC2 with MySQL database.

The App and Database

The web app is quite simple, I’m not using any framework such as Laravel, as you can see from above: An HTML file and Vue.js as front-end framework, insert.php to initiate the database with some data I fetched from https://www.dhhs.vic.gov.au/victorian-coronavirus-covid-19-data, and process.php to handle all the CRUD request, and that’s it.

To deploy this application to Amazon EC2, what we need to do is simply:

  1. Create an EC2 instance with Elastic IP and HTTP access
  2. Set up a LAMP environment on your EC2 instance
  3. Move your source code to EC2
  4. Export your db and import it to your new database on EC2
  5. Profit

Now let’s start from the basic.

Start & Configure an EC2 Instance

  1. Launch an Ubuntu instance first

2. Associate an Elastic IP to the new instance

3. In security group setting, add HTTP as inbound rule

4. Now use anyway you prefer to connect to the EC2 instance

If you get a “Host key verification failed” error, try modify the access permission with chmod command:

Set up LAMP on your EC2 instance

LAMP is short for Linux + Apache + MySQL + PHP, basically everything you need to run a php application. What I am using on windows is XAMPP, for the same purpose.

You can choose to install XAMPP on you Ubuntu instance or either install them separately:

1. Update your instance:

2. Switch to root:

3. Install Apache 2:

4. Once it’s done, you can also use following command to check the status of your apache server

5. At this point, you should be able to access the Apache testing page through your IP address, something like this:

6. Now, install other packages: php, php-mysql, and mysql-server

You will need to set up your database name and password during the installation. Write them down as you will need them later to login visa myphpadmin

7. Use the same command to test your mysql server

8. Enter mysql comman line and set up the username and pwd:

Once the mysql console shows up, you will need to configure a little bit like this:

9. Now install phpmyadmin and restart apache server:

10. Try access myphpadmin through http://your-ip-address/myphpadmin/

If you got an error of

“The requested URL /phpmyadmin was not found on this server”,

try use the following command:

which I shamelessly stole from here:

Migrate source code to EC2

If you take a look at /var/www/html, you will find the html file used to display the Apache testing page:

What we need to do is quite simple: move your source code to the same location and replace index.html with your own web page.

I used Winscp to transfer my source code folder via SMTP, you can download it here:

  1. After connecting to the same instance, you can simply drag-n-drop your project folder to /var/www/html

2. Now simply move all the files outside of the folder:

3. Now you should be able to access your web application through the same IP address used before

Migrating your data

At this stage, you will only need to migrate your database to cloud.

  1. Export your local MySQL database:

2. Log in your phpadmin on EC2, simply import the sql file you just exported.

3. Now as MySQL is up and running with your data on EC2, try access your app and see if it’s working.

If you get error similar to this “CORS: PHP: Response to preflight request doesn’t pass.”, I would suggest check your front end API request, because its very likely that you are still calling from localhost, which is not accessible in the new EC2 environment.

What I did to resolve this problem is to change all the URL to the IP address of the new instance:

Before (When run locally):

After:

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store