Containerize Django app with docker and deploy using Nginx

In the ever-evolving landscape of web development, Django stands as a robust and versatile framework for building web applications. Our journey today takes us one step further as we explore the exciting realm of deploying a Django-based Notes App using an Nginx server and Docker containers. If you're ready to embark on this technical voyage, you're in the right place.

In this blog series, we'll guide you through the entire process, from the initial setup to the final deployment. By the end of it, you'll have a comprehensive understanding of how to harness the power of Docker containers and Nginx to host your Django Notes App, making it accessible to the world.

So, fasten your seatbelts and get ready to dive into the world of containerization, web server configuration, and seamless Django deployment. Whether you're a seasoned developer or just starting out, we'll ensure that you have all the tools and knowledge to make this project a resounding success. Let's begin our journey into the world of Django, Nginx, and Docker.

Step 1: Creating and accessing EC2 Instance with HTTP, HTTPS, and SSH Access: Building the Deployment Environment

To deploy our Django Notes App, we need a robust and scalable infrastructure. We'll begin by setting up an Amazon EC2 instance and configuring its security group to allow HTTP, HTTPS, and SSH access. This is a crucial step in ensuring our application is accessible securely via the web.

Follow these steps to create your EC2 instance and set up the necessary inbound rules:

Log in to the AWS Console: Go to the AWS Management Console (https://aws.amazon.com/), and log in to your AWS account.
Launch an EC2 Instance:
- Click on the "Services" menu and select "EC2" under the "Compute" section.
- Click the "Launch Instance" button to create a new EC2 instance.
Choose an Amazon Machine Image (AMI)*:*
- Select an AMI here we will select t2.micro Ubuntu image.
Configure Instance Details:
- Configure the instance settings, such as the number of instances we will create only 1 instance here, and network, and subnet settings keep it to default. Ensure that you select a public subnet to enable internet access.
Add Storage:
- Keep storage setting to default.
Add Tags (Optional)*:*
- You can add tags for better organization and management.
Configure Security Group:
- Create a new security group or select an existing one.
- In the security group settings, add the following inbound rules to allow HTTP (port 80), HTTPS (port 443), and SSH (port 22) access:
  - HTTP (port 80) - Source: 0.0.0.0/0 (Allow incoming web traffic)
  - HTTPS (port 443) - Source: 0.0.0.0/0 (Allow secure web traffic)
  - SSH (port 22) - Source: Your IP or a specific IP range (Allow SSH access)
- Review and confirm your security group settings.
Review and Launch:
- Review your instance configuration to ensure it matches your requirements.
- Click the "Launch" button.
Key Pair:
- If you don't have an existing key pair, create a new one. This key pair will be used for SSH access to your instance. Download and store it in a secure location.
Launch the Instance:
- Click the "Launch Instances" button to create your EC2 instance.
Access created EC2 Instance:
- SSH into Instance using the EC2 Instance connect so you will get the terminal in handy.

Step 2: Updating the EC2 Instance: Preparing the Deployment Environment

Update the ec2 instance

  #Command to update the server
  sudo apt-get update

Install Nginx

  #Command to install nginx
  sudo apt-get install nginx -y

Nginx status check, restart commands for your information

  #Check nginx status
  sudo systemctl status nginx

  #Restart nginx 
  sudo systemctl restart nginx

Installing the docker

  #Installing the docker
  sudo apt install docker.io

The docker might give the permissions error if you try to execute the docker commands without using root(sudo) permissions. To avoid using sudo for every docker command add the current user in the docker group.

Command to add user to docker group is:
```
  #Command to add user to docker group
  sudo usermod -a -G docker $USER

  #Reboot the instance
  sudo reeboot
```

Step 3: Cloning the GitHub Repository: Setting the Stage for Deployment

Before we can embark on our journey of deploying the Django Notes App, we need to set up our development environment. The first step in this process is to clone the GitHub repository containing the source code for our Notes App.

This is my GitHub repository you can clone this or you can fork this into your GitHub account.

https://github.com/shubzz-t/nginx_django_notes_app

git clone https://github.com/shubzz-t/nginx_django_notes_app

Now after cloning the git repository go inside the nginx_django_notes_app and you can list the files present there using:-

  #Go inside the cloned project folder
  cd nginx_django_notes_app

  #List the files inside nginx_django_notes_app
  ls

Step 4: Building a Docker Image and Container

You must have seen the Dockerfile in your application directory when you used the "ls" command in the previous step, it has the specifications defined for your Docker image. To build a docker image from that file use :
```
  #Docker command to build the image from the dockerfile
  docker build -t notes-app .
```

Here above the " -t " is used to tag the image notes-app is the tag name and the " . " says that dockerfile to build is present in the current directory.

You can see your notes-app is built using the docker command:-

   # This command will list all the docker images
  docker images

After the image is built we have to run the image specifying the port for it to run on it can be done using the following command :
```
  #Docker command to run container from image on specified port
  docker run -d -p 8000:8000 notes-app:latest
```

Here above -d is to run the container in the background, -p is to specify the port to open ie: port 8000 of the server is mapped to port 8000 of the container, notes-app is the image name and the latest is the tag for the image.

To check whether the container is running or not you can simply use the following command and you will see the status as up :
```
  #This command will list the running containers with container information
  docker ps
```

To ensure that the container is serving the request, you can use:-

  #To check if the container is serving on port 8000
  curl -L http://127.0.0.1:8000

The above command must give the output similar to the below output:-
Till here we are all set with the docker.

Step 5: Configuring Nginx to Make the Notes App Accessible From Everywhere

With your Docker container up and running, the next crucial step is to configure Nginx to act as a reverse proxy and make your Django Notes App accessible from anywhere on the internet.

Nginx configuration files are located in the /etc/nginx directory. You can use any text editor(vim), to edit the Nginx configuration file.

  #Command to go inside the sites-enabled directory
  sudo cd /etc/nginx/sites-enabled/

  #Command to see the files present in sites-enabled directory
  ls

Here we will edit the default file present inside the /etc/nginx/sites-enabled directory which contains the nginx configuration.

To edit a file using the Vim editor use the command:-

  #Command to open default file to edit using vim editor
  sudo vim default

Add the below line inside that file in the " location / " section :

proxy_pass http://127.0.0.1:8000;

Also, add the new location section as " location /api " for backend configuration:

location /api {

proxy_pass 127.0.0.0:8000/api;

}

Restart the nginx server so that the changed configuration will be in the picture.
```
  #Command to restart the nginx server
  sudo systemctl restart nginx
```

Till here we are setup with the nginx reverse proxy the request will point to our app, but it will not serve the frontend pages as we don't have any frontend pages present in the /var/www/html directory.

To copy and paste the frontend pages of the notes app present in nginx_django_notes_app/mynotes/build use commands:-

  #Command to go inside the nginx_django_notes_app/mynotes/build directory
  cd nginx_django_notes_app/mynotes/build

  #Command to copy all the files from build directory to /var/www/html/
  sudo cp -r * /var/www/html/

After the above step you just have to go to the browser tab and simply enter your ec2 instance ip for eg:- 10.23.23.22 and hit enter guess what you will be redirected to your notes app.

At this point in our deployment journey, we've achieved a significant milestone. We've set up our EC2 instance, installed Nginx to serve as a reverse proxy, and containerized our Django Notes App using Docker.

If you have any questions, encounter challenges, or wish to explore specific topics related to Django, Docker, Nginx, or web application deployment, please feel free to reach out. Your feedback and engagement are invaluable to us.

Thank you for joining us on this exciting journey of deploying a Django Notes App.

Unlocking the Power of Django: Deploying Our Notes App with Nginx and Docker

Step 1: Creating and accessing EC2 Instance with HTTP, HTTPS, and SSH Access: Building the Deployment Environment

Step 2: Updating the EC2 Instance: Preparing the Deployment Environment

Step 3: Cloning the GitHub Repository: Setting the Stage for Deployment

Step 4: Building a Docker Image and Container

Step 5: Configuring Nginx to Make the Notes App Accessible From Everywhere