Step-by-Step Guide to Running Your Flask Application on AWS Elastic Beanstalk for Free

Have you ever thought of deploying web app but you found it too difficult?

Then you are not alone. Because I also once thought it to be too complex and struggled to deploy my apps on AWS. However, after trying countless times and not giving up, I successfully deployed my python web app by getting help from some experts.

So, I have simplified the process of deployment on AWS in 3 simple steps that anyone can follow who has some experience in app development.

Pre Requisites:

There are some pre requisites that you should meet before even starting deployment process:

1. Should have AWS Free Tier account.
2. General understanding of AWS console and its services.
3. Should have basic understanding of Python Flask Framework.
4. An IDE preferably PyCharm.

3 Simple Steps:

Here are the 3 easy steps and we will discuss each in detail one by one.

1. Create a Simple Flask Web App:

We are going to create a simple flask web app and it will contains a simple signup web-form. When user submits the web-form, the data will be saved in a database and confirmation message will be displayed on the web page. On every new submission, an email notification will be sent to a designated email address.

a. Here is how the app looks like:

When a user clicks on the "SignUp" button, it will be redirected to the following webpage containing the signup web form:

You can find the complete code in the GitHub repository on this link: https://github.com/ABK007/eb-flask

b. Required libraries and dependencies:

For every python project, python packages and dependencies are extremely important to make the app work properly on the cloud. If any package is not installed properly then the server will not deploy the app.

But before installing dependencies, always remember to create virtual environment for every project.

PyCharm (IDE) creates virtual environment automatically while creating new project. However, you can use commands in command line interface (CLI) after going to main project directory if you want to do it manually. You can read more about it on this link: https://www.geeksforgeeks.org/creating-python-virtual-environment-windows-linux/ .

Following are the packages that are most important for this web app:

• Flask: This is the core python package for flask framework.
• Boto3: This package is used to integrate the AWS services in your app. In our case, these will be Elastic Beanstalk, DynamoDB and SNS.
• AWSCLI: This package is required to configure your AWS account credentials for remote access of AWS services.
• AWSEBCLI: AWS has specifically created this package to simplify the process of uploading and deploying app on Elastic Beanstalk service.

Here is the command to install python packages. Just make sure to install it in virtual environment.

pip3 install {Python package name}

c. Project Files Arrangement:

The files arrangement in the Project directory is very important in Flask framework to make it work correctly.

Lets discuss each folder and file one by one.

• eb-flask-4: It is main project directory containing application files.
• app (Python Package): It is a specialized python package that you can create in PyCharm and it contains folders 'static' and 'templates'. It also contains python files init.py, forms.py, and routes.py file.
• static: This folder contains the .CSS file for the web app.
• Templates: It contains all the .html files for the web app.
• init.py: It is inside the app folder and contains basic app configuration code.
• forms.py: This file contains code for web form in the app.
• routes.py: This file contains code for web routes for web app.
• eb-env: This folder is formed when virtual environment in the project is created. It contains all the installed python package files.
• application.py: This file is not inside app folder but the main project folder. Its should not be named other than 'application' in order to make the app work properly in AWS Elastic Beanstalk.
• requirements.txt: This file contain the python packages version and names required to run the application properly.

Do not change the names of the folders and files as well as their location in project folder to make the app work properly.

2. Configuring AWS Services for Deployment:

The next step is to configure AWS services after creating web app assuming that you have created AWS account and free tier available. We will be using Elastic Beanstalk, Simple Notification Service (SNS) and DynamoDB. Each of these services will be briefly discussed here.

a. Elastic Beanstalk:

AWS Elastic Beanstalk is an high level service offered by Amazon Web Services for deploying applications which automates the deployment, scaling, and management of application infrastructure. It abstracts away the complexity of directly managing each component of the application stack, allowing developers to focus on writing code rather than worrying about the underlying infrastructure.

b. Configuring Elastic Beanstalk (EB):

To configure EB, first, you need to login to AWS console. After logging in, search elastic beanstalk in search bar located at the top right corner of the console.

Select Elastic Beanstalk in the options and it will open the EB web page. From there, click on the button create application.

Step 1: Configure Environment:

After clicking 'create application' button, you will this configuration settings page.

In the environment tier, select the web server environment and in application information, enter application name.

Next, follow the steps as shown in the images below to complete configuration process.

Step 2: Configure service access:

When next button is clicked, step 2 page will appear. In this step, amazon will automatically select or create service access settings required to deploy the web app. We will discuss about service access in AWS later.

Instead of clicking next, click on the button "skip to review" because the step 3, 4 and 5 are optional and AWS will select the default settings in these steps.

Step 6: Review Settings:

The last step is to review the settings for the project and edit them if you need but it is better to not alter them.

When you click the submit button at the bottom of the "Review Page", AWS will start creating EC2 server instance as well as all other settings required to run the web app. You will see this web page and green banner at the top when the process is successfully completed.

This is a project environment of the app that we created. Here, you see the logs, health, monitor the load and traffic and any error or alarms that you have set. AWS will create this environment for every new web app that you will deploy using EB.

You can see the demo web app on the browser by clicking on the link given under domain highlighted in red box in the image above.

Below, is the image of homepage of the web app.

If you go to applications tab, you will be able to see the application name in the table as shown in the image below:

This is a demo python app provided by Elastic Beanstalk. We will deploy a new app on it using AWSEBCLI later in the tutorial.

c. Configuring DynamoDB:

DynamoDB is AWS fully managed NoSQL service. It provides fast and predictable performance with seamless scalability. It allows you to create database tables that can store and retrieve any amount of data and serve any level of request traffic. DynamoDB automatically manages the data traffic across multiple servers to ensure high availability and durability. It offers built-in security, backup and restore, and in-memory caching.

Step 1:

So, lets open the DynamoDB in AWS console by searching it in the search bar. Following webpage will open once you select DynamoDB.

Configuring the DynamoDB is a really simple and straightforward process.

Click on the "Create table" button and new configuration page will open here you will provide the details to create table inside the DynamoDB to store webform data.

Step 2:

Follow the steps and enter details according to the screenshots below:

Step 3:

After you go through all these steps, A new screen will appear and here you will be able to see that the "signuptable" table has been created and active.

When you click on the signup table name as shown in the image above, a new control panel will open and here you will be able to monitor and explore information as well as edit additional settings.

Step 4:

To see the saved data, click on the "explore table items" button.

d. Configuring Simple Notification Service (SNS)

AWS Simple Notification Service (SNS) is a fully managed messaging service for both application-to-application (A2A) and application-to-person (A2P) communication. It enables the sending of messages or notifications by various methods like HTTP/HTTPS, email, SMS messages and many other. SNS supports pub/sub, mobile push, and SMS messaging. SNS is designed to enable scalable, flexible, and cost-effective messaging with high throughput and reliable delivery, making it easy to set up, operate, and send notifications from the cloud.

Step 1:

Open the SNS service page by searching "Simple Notification Service". Then enter topic name in the field "my topic" (you can enter any name) and click on "Next Step" highlighted in the yellow box as shown in the image below:

Step 2:

After clicking the button, you will see "Create Topic" page where you will configure settings to create SNS topic. Just follow the settings and enter details as shown in the following images:

Step 3:

After clicking the "Create Topic" button, you will see a dashboard screen as shown in the image below. Here, you can see the details of the recently created SNS topic. Just click on the "Create Subscription" button and you will be taken into the settings menu.

Step 4:

Enter details in the "Create Subscription" page as shown in the image below. In the "Endpoint" field, enter your real email address where you want to receive the notification email from SNS service.

In "Protocol" field, select "Email" from the dropdown menu. Then click on "Create subscription" button.

Once you click on "Create subscription" button, you will see the following page showing the details of newly created subscription.

e. Configuring Identity and Access Management (IAM):

AWS Identity and Access Management (IAM) is a web service that helps you securely control access to AWS resources. It allows you to create and manage AWS users and groups, and use permissions to allow and deny their access to AWS resources. IAM makes it easy to provide multiple users secure access to your AWS resources without sharing passwords or keys. You can assign policies that control who can access which services and resources within your AWS account. IAM is crucial for managing the security of your AWS environment, ensuring that only authorized and authenticated users can access resources and perform actions.

In AWS (IAM), Users, User Groups, Roles, and Policies are fundamental components to manage the access to AWS resources securely and effectively. Here's a brief overview of these terms:

1. Users: An IAM User represents an individual or service that interacts with AWS. Users can be assigned unique security credentials (like access keys, passwords, and multi-factor authentication devices) and permissions that control their access to AWS resources.
2. Groups: An IAM Group is a collection of IAM Users. Groups make it easier to manage and assign permissions to multiple users at once. Instead of defining permissions for individual users, you can assign a set of permissions to a Group, and then add Users to that Group.
3. Roles: An IAM Role is an entity with permission policies that determine what the identity can and cannot do in AWS. However, unlike Users, Roles do not have standard long-term credentials (password or access keys). Instead, roles are assumed by trusted entities (such as IAM users, applications, or AWS services) which are then provided temporary security credentials to make AWS API calls.
4. Policies: IAM Policies are documents that formally state one or more permissions. Policies can be attached to Users, Groups, or Roles to define their permissions. These documents are written in JSON format and specify the Actions (API calls), Resources, and optional Conditions under which the permissions are allowed or denied.

We are using 4 AWS services to run the Flask web app. These services have to communicate with each other securely to run the app properly. Following schematic Diagram illustrates it:

Follow the steps below to configure the IAM:

Step 1:

Open the IAM dashboard on AWS console by searching it.

Step 2:

In the IAM dashboard, you can see the Users, User groups, Roles and Policies that have been created by you or other AWS services (highlighted in red box).

Step 3:

Select "User Groups" from the side menu on the left side of the dashboard. Here click on the button "Create Group".

Step 4:

Here, enter the name of the user group. I have named it as "Admin_access". In the second box, select the user you want to add in the group that we are creating (assuming you have already created IAM user if not, then create IAM user first).

When you scroll down you will see the "Attach permission policies". Here, search "admin" in the search bar and select "AdministratorAccess" policy by clicking on the checkbox. It will allow the users added in the group to have full administrative to all the services and resources in the AWS.

After that click on the "Create Group" button at the bottom right corner of the page to complete the creation of User group. Now, a user group with name "admin_access" has been created.

Step 5:

Select "Users" on the left side menu and it will open "Users" table will open on the next page. Click on the user name (it is "abubakar_aws_v1" in our case) as directed by red arrow.

Step 6:

On the new page, see the "Permission policies" box (highlighted in red box). Make sure that you the following policies attached to your user:

• AdministrativeAccess
• AdministratorAccess-Amplify
• AdministrativeAccess-AWS ElasticBeanstalk

If these policies are not attached then attach them by searching their name like we did in the previous steps.

Step 7:

Now select "Roles" from the side menu. In the Roles page, make sure the following Roles have been attached to the user:

• aws-elasticbeanstalk-ec2-role
• aws-elasticbeanstalk-service-role
• AWSServiceRoleForApplicationAutoScaling_DynamoDBTable
• AWSServiceRoleForAutoScaling
• AWSServiceRoleForElasticLoadBalancing

Most of these roles are automatically created by AWS when you use any AWS service. However, due to some problem these roles might not be added automatically. In that case, make sure to add them manually.

Step 8:

Now click on the "aws-elasticbeanstalk-ec2-role" and see the following policies attached to it:

• AmazonDynamoDBFullAccess
• AmazonSNSFullAccess
• AWSElasticBeanstalkMulticontainerDocker
• AWSElasticBeanstalkWebTier
• AWSElasticBeanstalkWorkerTier

If any of the policies are not attached then attach them manually.

Step 8:

Similarly, open the "aws-elasticbeanstalk-service-role" and see that the following policies are attached to this role:

• AdministratorAccess-AWSElasticBeanstalk
• AWSElasticBeanstalkEnhancedHealth
• AWSElasticBeanstalkManagedUpdatesCustomerRolePolicy.

Always make sure that the policies and Roles in the IAM are attached properly otherwise the Elastic Beanstalk will give permission errors and it will not deploy the app.

3. Configuring Web App for Deployment on AWS:

a. Configuring Credentials using AWSCLI:

We are using AWSCLI to configure credentials to access other services such as DynamoDb and SNS.

Make sure that you have already installed the AWSCLI package.

Follow the steps to complete the configuration:

Open the CLI in your project folder or you can use built-in CLI in the PyCharm.

Here enter the command: "aws configure"

It will ask you to enter Access Key ID which you can find in the identity and access management center (IAM) at the following location:

IAM > Users > {User name}

If you have not created access key then you have to create it before moving forward.

Next, enter the secret access key.

In default region [us-west-2], enter the region which you can find as shown in the from URL:

https://us-west-2.console.aws.amazon.com/console/home?region=us-west-2#

In this URL, "us-west-2" is the region and it will be different for different locations.

Select table in Default output format.

The configuration process by AWSCLI is complete.

Windows PowerShell
Copyright (C) Microsoft Corporation. All rights reserved.

Try the new cross-platform PowerShell https://aka.ms/pscore6

(eb-env) PS D:\Extreme Commerce\AWS Cloud Practitioner\eb-flask-4> aws configure
AWS Access Key ID [****************ZCNV]: Your ACCESS KEY
AWS Secret Access Key [****************mJV4]: Your SECRET ACCESS KEY
Default region name [us-west-2]: us-west-2
Default output format [table]: table

(eb-env) PS D:\Extreme Commerce\AWS Cloud Practitioner\eb-flask-4>         

It will setup credentials in the project folder which will be used by boto3 package when accessing other services.

b. Deploying App in Elastic Beanstalk Remotely using AWSEBCLI:

We will create new application in Elastic Beanstalk using AWSEBCLI.

But before that, use the command: pip freeze > requirements.txt

This command will create "requirements.txt" file in the project folder containing all the dependencies required to run this project.

You might face errors while deploying the app due to conflict in dependencies. So, I have provided their solution on the following link: https://github.com/ABK007/eb-flask/blob/master/README.md

You should remove following packages from "requirements.txt" file as these can cause errors and conflicts during deployment:

1. AWSCLI
2. pypiwin32
3. pywin32
4. pywin32-ctypes

1. Creating Application Instance in EB:

Now, enter the command: "eb init"

Here is the complete summary of the process:

(eb-env) PS D:\Extreme Commerce\AWS Cloud Practitioner\eb-flask-4> eb init

Select a default region
1) us-east-1 : US East (N. Virginia)
2) us-west-1 : US West (N. California)
3) us-west-2 : US West (Oregon)
4) eu-west-1 : EU (Ireland)
5) eu-central-1 : EU (Frankfurt)
6) ap-south-1 : Asia Pacific (Mumbai)
7) ap-southeast-1 : Asia Pacific (Singapore)
8) ap-southeast-2 : Asia Pacific (Sydney)
9) ap-northeast-1 : Asia Pacific (Tokyo)
10) ap-northeast-2 : Asia Pacific (Seoul)
11) sa-east-1 : South America (Sao Paulo)
12) cn-north-1 : China (Beijing)
13) cn-northwest-1 : China (Ningxia)
14) us-east-2 : US East (Ohio)
15) ca-central-1 : Canada (Central)
16) eu-west-2 : EU (London)
17) eu-west-3 : EU (Paris)
18) eu-north-1 : EU (Stockholm)
19) eu-south-1 : EU (Milano)
20) ap-east-1 : Asia Pacific (Hong Kong)
21) me-south-1 : Middle East (Bahrain)
23) af-south-1 : Africa (Cape Town)
24) ap-southeast-3 : Asia Pacific (Jakarta)
25) ap-northeast-3 : Asia Pacific (Osaka)
(default is 3): 3


Select an application to use
1) eb_flask
2) [ Create new Application ]
(default is 2): 2


Enter Application Name
(default is "eb-flask-4"): eb-flask-4
Application eb-flask-4 has been created.

It appears you are using Python. Is this correct?
(Y/n): Y
Select a platform branch.
1) Python 3.11 running on 64bit Amazon Linux 2023
2) Python 3.9 running on 64bit Amazon Linux 2023
3) Python 3.8 running on 64bit Amazon Linux 2
4) Python 3.7 running on 64bit Amazon Linux 2 (Deprecated)
(default is 1): 1

Do you wish to continue with CodeCommit? (Y/n): n
Do you want to set up SSH for your instances?
(Y/n): n
(eb-env) PS D:\Extreme Commerce\AWS Cloud Practitioner\eb-flask-4>        

2. Create Application Environment Instance in EB:

We have just create application in the previous step and in this step we will create application environment.

Note: You can have more than one application environment i-e one for development and one for deployment.

To start the process, enter command: eb create --single

Here is the complete summary of the process

(eb-env) PS D:\Extreme Commerce\AWS Cloud Practitioner\eb-flask-4> eb create --single

Enter Environment Name
(default is eb-flask-4-dev): {Enter your own name or press enter}   
        
Enter DNS CNAME prefix (default is eb-flask-4-dev): {press enter}

Would you like to enable Spot Fleet requests for this environment? (y/N):N

Creating application version archive "app-1b44-240206_180939268170".
Uploading eb-flask-4/app-1b44-240206_180939268170.zip to S3. This may take a while.
Upload Complete.
Environment details for: eb-flask-4-dev
  Application name: eb-flask-4
  Region: us-west-2
  Deployed Version: app-1b44-240206_180939268170
  Environment ID: e-kfc3xaacnbd
  Platform: arn:aws:elasticbeanstalk:us-west-2::platform/Python 3.11 running on 64bit Amazon Linux 2023/4.0.8
  Tier: WebServer-Standard-1.0
  CNAME: eb-flask-4-dev.us-west-2.elasticbeanstalk.com
  Updated: 2024-02-06 13:09:46.781000+00:00
Printing Status:
2024-02-06 13:09:45    INFO  createEnvironment is starting.
2024-02-06 13:09:46    INFO  Using elasticbeanstalk-us-west-2-936668792450 as Amazon S3 storage bucket for environment data.
2024-02-06 13:10:06    INFO  Created security group named: awseb-e-kfc3xavydb-stack-AWSEBSecurityGroup-XBOZWKZI86B
2024-02-06 13:10:21    INFO  Created EIP: 54.000.172.000
2024-02-06 13:10:37    INFO  Waiting for EC2 instances to launch. This may take a few minutes.
2024-02-06 13:11:34    INFO  Instance deployment successfully generated a 'Procfile'.
2024-02-06 13:11:39    INFO  Instance deployment completed successfully.
2024-02-06 13:12:45    INFO  Successfully launched environment: eb-flask-4-dev

(eb-env) PS D:\Extreme Commerce\AWS Cloud Practitioner\eb-flask-4>        

To see that the application is successfully deployed, open Elastic Beanstalk dashboard in AWS console.

You will be able to see the application name as well as environment name that we created in the previous steps.

Click on the environment name to see more details about the application environment. You can see the deployed app by clicking on the link under the domain (highlighted in red box).

Here is the link: https://eb-flask-4-dev.us-west-2.elasticbeanstalk.com/

3. Verify Web App Working:

The last step is to verify that the web app is working properly. To do that, let's fill a signup form together.

Click on the "Signup button".

The webform page should appear without any errors. Now, fill the form by entering details in it.

Click on the "Submit" button. You will be redirected to the home page with a green banner confirming the web form is successfully submitted.

4. DynamoDB Validation:

To check that the data is successfully saved in DynamoDB, open it in the AWS console and go to the "signuptable" that we created in it previously.

There you should be able to see the new row containing that we added in the previous step.

5. SNS Validation:

To verify that the AWS SNS service that we used for email notification when a user submits webform is working correctly. To do that, open your email which you added as endpoint while creating SNS Subscription previously.

You should be able to see a new email from MagicMail. Open the email and you will be able to see the data from webform.

Conclusion:

Finally, we have successfully deployed a simple Flask Web App on AWS. Deploying apps on AWS is a little bit more complex than many other deployment options available. However, once you understand that how things work in AWS, then it is the most scalable and powerful cloud platform available today.

Thank you so much for completing the tutorial till the end.

If you face any issues while following this tutorial, feel free to contact me on my LinkedIn profile, I will be more than happy to help you.