1: Django + AWS Elastic Beanstalk configuration
Your web app should be complete and ready for development! Don't be concerned if you still want to make changes; this tutorial is designed for you to deploy your web app as practice. You will take the project down once you have successfully deployed.
Check your Django web app is functioning correctly
Before anything else, make sure the contact form, pages, and links all work correctly. Login into the admin page and make sure that works as well. With AWS Elastic Beanstalk, your Django web app can be deployed from the AWS EB console or the AWS Command Line Interface (CLI). For this tutorial, we will deploy from the CLI.
Configure your web app for AWS CLI
macOS Terminal
(Ctrl + C)
(env)User-Macbook:mysite user$
Windows Command Prompt
(Ctrl + C)
(env) C:\Users\Owner\desktop\code\env\mysite>
Ctrl + C to stop running your server. You should be in the first mysite folder with the virtual environment still activated.
Create a requirements.txt
macOS Terminal
(env)User-Macbook:mysite user$ pip freeze > requirements.txt
Windows Command Prompt
(env) C:\Users\Owner\Desktop\Code\env\mysite> pip freeze > requirements.txt
Save all of your installed packages in a new file named requirements.txt. The command pip freeze > requirements.txt will automatically compile your installed packages and store them in the new file requirements.txt created in the mysite folder.
View the requirements.txt file
env > mysite > requirements.txt
Django==2.1.15
django-crispy-forms==1.9.0
django-tinymce4-lite==1.7.5
jsmin==2.2.2
Pillow==7.1.0
pytz==2019.3
Open the requirements.txt file in Sublime to view all of the packages we installed. Only edit the file if there is a package with version 0.0.0 and remove that line of code if it exists. Save the file if you made changes.
Make an .ebextensions folder
macOS Terminal
(env)User-Macbook:mysite user$mkdir .ebextensions
Windows Command Prompt
(env) C:\Users\Owner\desktop\code\env\mysite>mkdir .ebextensions
Go back to the CLI and create a new folder called .ebextensions. The command mkdir .ebextensions makes a new directory or folder named .ebextensions in the mysite folder.
Create a new file named django.config in .ebextensions
env > mysite > .ebextensions > (New File) django.config
GIF
Open the new folder .ebextensions in Sublime and create a new file inside named django.config.
Edit the django.config file
env > mysite > .ebextensions > django.config
option_settings:
aws:elasticbeanstalk:container:python:
WSGIPath: mysite.wsgi:application
Place the following configuration settings in the django.config file. Save the file. This short snippet of code allows AWS CLI EB to find the wsgi.py file that handles Web Server Gateway Interface in our Python project.
The WSGI is the standard interface for web servers to forward requests to Python web applications.
Deactivate the virtual environment
macOS Terminal
(env)User-Macbook:mysite user$ deactivate
User-Macbook:mysite user$
Windows Command Prompt
(env) C:\Users\Owner\Desktop\Code\env\mysite> deactivate
C:\Users\Owner\Desktop\Code\env\mysite>
Return back to the CLI and deactivate the virtual environment. Stay in the desktop > code > env > mysite folder.
2: Deploying to AWS EB from the AWS EB CLI
Install AWS Elastic Beanstalk CLI
macOS Terminal
User-Macbook:mysite user$ pip install awsebcli --upgrade --user
Windows Command Prompt
C:\Users\Owner\Desktop\Code\env\mysite> pip install awsebcli --upgrade --user
Install the Elastic Beanstalk Command Line Interface (AWS EB CLI) in the mysite folder with the virtual environment deactivated.
The --upgrade flag installs the latest version of the pip package.
The --user flag installs the package in the user account's local python package install location rather than the system-wide package install location.
Select your region in the AWS EB CLI
macOS Terminal
User-Macbook:mysite user$ 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)
...
20) me-south-1 : Middle East (Bahrain)
(default is 3):
Windows Command Prompt
C:\Users\Owner\Desktop\code\env\mysite>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)
...
20) me-south-1 : Middle East (Bahrain)
(default is 3):
Run the command eb init and select your region.
Provide your AWS credentials in the AWS EB CLI
macOS Terminal
You have not yet set up your credentials or your credentials are incorrect
You must provide your credentials.
(aws-access-id):**********************
(aws-secret-key):**********************
Windows Command Prompt
You have not yet set up your credentials or your credentials are incorrect
You must provide your credentials.
(aws-access-id):**********************
(aws-secret-key):**********************
Open the previously created csv file with your AWS credentials and copy and paste them into the CLI. If you cannot find the file, create a new key pair.
Create your new application in the AWS EB CLI
macOS Terminal
Enter Application Name
(default is "mysite"): django-tutorial
Application django-tutorial has been created.
Windows Command Prompt
Enter Application Name
(default is "mysite"): django-tutorial
Application django-tutorial has been created.
AWS Elastic Beanstalk is comprised of applications and environments. Think of applications as the folders that contain an environment or a Django project. Multiple environments can be within one application. After entering your credentials, AWS CLI asks for an application name. We will call this application django-tutorial.
Specify your programming language
macOS Terminal
It appears you are using Python. Is this correct?
(Y/n): y
Select a platform version.
1) Python 3.6
2) Python 3.4
3) Python 3.4 (Preconfigured - Docker)
4) Python 2.7
5) Python
(default is 1): 1
Windows Command Prompt
It appears you are using Python. Is this correct?
(Y/n): y
Select a platform version.
1) Python 3.6
2) Python 3.4
3) Python 3.4 (Preconfigured - Docker)
4) Python 2.7
5) Python
(default is 1): 1
The CLI will ask if you are using Python. Type y to respond yes. Then it will ask for the platform version. select the default, 1.
Configure SSH security connection
macOS Terminal
Do you want to set up SSH for your instances?
(Y/n): y
Select a keypair.
1) aws-eb
2) [ Create new KeyPair ]
(default is 1): 1
Windows Command Prompt
Do you want to set up SSH for your instances?
(Y/n): y
Select a keypair.
1) aws-eb
2) [ Create new KeyPair ]
(default is 1): 1
Secure Socket Shell (SSH) is a secure connection allowing developers to remotely access a server. This connection allows users to safely access system administration and transfer files without the fear of an insecure network connection. AWS EB CLI allows you to automatically secure a SSH connection with the AWS access keys in your AWS account. Type y for yes.
Then select the keypair. Select 1 to use the same secret keypair already in use.
Create the environment for your project
macOS Terminal
User-Macbook:mysite user$ eb create django-env
Windows Command Prompt
C:\Users\Owner\Desktop\Code\env\mysite> eb create django-env
Run the command eb create django-env to create an new environment named django-env. The environment will initialize and begin to configure itself automatically based on the configuration files we added earlier to the project. This uploading process may take a few minutes. You can Ctrl + C during the process and nothing will be terminated.
Check the status of the environment
macOS Terminal
User-Macbook:mysite user$ eb status
Environment details for: django-env
Application name: django-tutorial
...
CNAME: django-env......elasticbeanstalk.com
...
Windows Command Prompt
C:\Users\Owner\Desktop\Code\env\mysite> eb status
Environment details for: django-env
Application name: django-tutorial
...
CNAME: django-env......elasticbeanstalk.com
...
You can check the status of the environment during or after it has completed initializing. Either way, you need to run eb status to find the Elastic Beanstalk domain AWS has automatically created for your app. Look for the line of code that states the CNAME value. This is the Elastic Beanstalk domain name of your website.
Add your custom EB domain name to settings.py
env > mysite > mysite > settings.py
ALLOWED_HOSTS = [
'django-env.......elasticbeanstalk.com',
]
Go back to your project in Sublime and open the settings.py file. Copy and paste the CNAME given by the eb status command under ALLOWED_HOSTS. Do not forget to place quotation marks around the domain name and save the file.
Change the Django debug settings in the .env file
env > mysite > .env
DEBUG =False
We have left DEBUG =True up until this point so we can still receive the yellow Django debugging page when an error occurs. But in deployment, we do not want users to get the debug page if they type in a nonexistent url, they should just get a 404 error instead.
Go into the .env file and change DEBUG =True to DEBUG =False. Save the file.
Upload the project to AWS EB
macOS Terminal
User-Macbook:mysite user$ eb status
Environment details for: django-env
Application name: django-tutorial
...
Status: Ready
Health: Green
User-Macbook:mysite user$ eb deploy
Windows Command Prompt
C:\Users\Owner\Desktop\Code\env\mysite> eb status
Environment details for: django-env
Application name: django-tutorial
...
Status: Ready
Health: Green
C:\Users\Owner\Desktop\Code\env\mysite> eb deploy
Run eb status again and find the phrases "Status: Ready" and "Health: Green" to make sure the environment initialization is complete. Then run eb deploy to begin uploading your Django project to the AWS EB server. This may take a few minutes.
Open the environment in the browser
macOS Terminal
User-Macbook:mysite user$ eb open
Windows Command Prompt
C:\Users\Owner\Desktop\Code\env\mysite> eb open
Run the command eb open to see your web app in the browser, deployed. You can also copy and paste the CNAME or ALLOWED_HOST in the settings.py file in a browser to view the live site.
3: Accessing Django admin in deployment
As of right now, you can use the Django admin in deployment but the pages lack CSS. We have to change the static files configurations to allow for the Django stylesheets. To do this, we need to gather the static files in a single directory to serve them easily in deployment.
Update the project settings.py
env > mysite > mysite > settings.py
import os
from django.contrib.messages import constants as messages
...
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.1/howto/static-files/
STATIC_URL = '/static/'
STATIC_ROOT = 'static'
# STATICFILES_DIRS = [
# os.path.join(BASE_DIR, "static"),
# ]
...
Go to the settings.py file and add STATIC_ROOT, the new directory serving the files. Comment out STATICFILES_DIRS. Save the file.
Reactivate the virtual environment
macOS Terminal
User-Macbook:mysite user$ cd ..
User-Macbook:env user$ source bin/activate
(env)User-Macbook:env user$ cd mysite
Windows Command Prompt
C:\Users\Owner\desktop\code\env\mysite> cd ..
C:\Users\Owner\desktop\code\env> Scripts\activate
(env)C:\Users\Owner\desktop\code\env> cd mysite
Go back to the env directory and activate the environment then enter the mysite directory.
Collect static in the CLI
macOS Terminal
(env)User-Macbook:mysite user$ python manage.py collectstatic
You have requested to collect static files at the destination
location as specified in your settings:
.../env/mysite/static
This will overwrite existing files!
Are you sure you want to do this?
Type 'yes' to continue, or 'no' to cancel: yes
435 static files copied to '.../env/mysite/static'.
Windows Command Prompt
(env)C:\Users\Owner\desktop\code\env\mysite> py manage.py collectstatic
You have requested to collect static files at the destination
location as specified in your settings:
C:\Users\Owner\Desktop\code\env\mysite\static
This will overwrite existing files!
Are you sure you want to do this?
Type 'yes' to continue, or 'no' to cancel: yes
435 static files copied to 'C:\Users\Owner\Desktop\code\env\mysite\static', 7 unmodified.
Run collectstatic to copy all files from your static folders into the STATIC_ROOT directory. When asked if you want to collect static type yes and wait for the files to be copied.
Redeploy your project
macOS Terminal
(env)User-Macbook:mysite user$ deactivate
User-Macbook:mysite user$ eb deploy
Windows Command Prompt
(env)C:\Users\Owner\desktop\code\env\mysite> deactivate
C:\Users\Owner\desktop\code\env\mysite> eb deploy
Deactivate the environment and run eb deploy to push the static folder update.
Access the Django admin page
GIF
Once deployed, open the browser with your deployed project and go to the admin page. It now has the CSS.
4: (Optional) Taking down your Django web app from AWS
It's time to take down the tutorial web app to make room for your real website.
Open the AWS Elastic Beanstalk console
GIF
Login to AWS and select the region were you deployed your project. Then search for Elastic Beanstalk in the Management Console. Click on Elastic Beanstalk and your environments in that region should appear.
Terminate the django-env environment
GIF
In the Elastic Beanstalk console, select "django-env", click the "Actions" dropdown menu on the right side of the page. Select "Terminate Environment", enter the name of your environment to confirm, and click terminate.
Terminate the django-tutorial application
GIF
Once the environment is terminated, you are brought to the "Applications" page. Select "django-tutorial", click the "Actions" dropdown menu on the right side of the page and select "Delete application". Enter the name of the application to confirm and click delete.