Creating your own corner of the internet is a rewarding experience. A personal blog allows you to share your thoughts, showcase your portfolio, or build a community around a topic you love. While platforms like WordPress are popular, building your blog from scratch gives you complete control and is an incredible learning opportunity. This five-part series will guide you through building and deploying a professional blog using Django, a powerful Python web framework, and hosting it on Heroku.

In this first installment, we will focus on laying a solid foundation: setting up our development environment. We’ll use AWS Cloud9, a cloud-based Integrated Development Environment (IDE), to write our code. This approach means you don’t need to install complex software on your local machine—all you need is a web browser. By the end of this post, you’ll have a ready-to-use Cloud9 workspace with Django installed and a new project prepared for its journey to the web.

Prerequisites

Before we begin, make sure you have the following:

1. An AWS Account: Cloud9 is an Amazon Web Services product. You’ll need an AWS account to use it. If you don’t have one, you can sign up for their Free Tier.
2. A Heroku Account: Heroku is the platform we’ll use to host our live blog. Sign up for a free account on the Heroku website.
3. Basic Python Knowledge: You should be comfortable with Python fundamentals like variables, functions, and data structures.
4. Command-Line Familiarity: We will be using the terminal for installations and commands, so a basic understanding of navigation (cd) and listing files (ls) will be helpful.

With those in place, let’s build our workshop.

Step 1: Creating Your AWS Cloud9 Workspace

Cloud9 provides a complete development environment in the cloud, including a code editor, a terminal, and debugging tools. This setup ensures consistency and lets you code from any computer with an internet connection.

1. Log in to the AWS Console: Navigate to the AWS Management Console and log in.
2. Find Cloud9: In the search bar at the top, type “Cloud9” and select it from the results.
3. Create a New Environment: Click the “Create environment” button.
4. Name Your Environment: Give your environment a descriptive name, like django-blog-project. You can also add an optional description.
5. Configure Settings: On the next page, you’ll configure your environment.
   • Environment type: Choose “New EC2 instance.”
   • Instance type: The t2.micro (or t3.small depending on your region) option is eligible for the AWS Free Tier and is sufficient for our project.
   • Platform: Select “Amazon Linux 2.” This is a stable and widely used operating system.
   • Cost-saving setting: You can set a timeout period (e.g., 30 minutes) to automatically shut down the environment when it’s not in use, which helps manage costs.
6. Review and Create: Review your settings on the final page and click “Create environment.” AWS will take a few minutes to provision and set up your workspace. Once it’s ready, you’ll be redirected to your new, fully-featured cloud IDE.

Your Cloud9 environment is now ready. You’ll see a welcome screen, a file explorer on the left, a code editor in the middle, and a terminal at the bottom.

Step 2: Installing Django and Required Tools

With our environment running, the next step is to install Django and other tools needed to run our project and prepare it for Heroku. We will use a Python virtual environment to keep our project’s dependencies isolated from the system’s Python installation.

1. Create a Virtual Environment: In the Cloud9 terminal at the bottom of your screen, run the following command. This creates a virtual environment named venv.

   >python3 -m venv venv

2. Activate the Virtual Environment: To start using the virtual environment, you need to activate it.

   >source venv/bin/activate

   You’ll know it’s active because your terminal prompt will change to show (venv) at the beginning. From now on, any Python packages you install will be placed inside this isolated environment.
3. Install Django: Now, we can install the star of our show, Django.

   >pip install django

4. Install Heroku-Specific Packages: Heroku requires a few specific packages to understand and run a Python application.
   Install all of them with a single command:

   >pip install gunicorn dj-database-url psycopg2-binary

   • Gunicorn: A production-ready web server that Heroku will use to run our Django application.
   • dj-database-url: A utility to help us parse database URLs provided by Heroku.
   • psycopg2-binary: A driver that allows Django to connect to the PostgreSQL database that Heroku provides.

Step 3: Creating Your Django Project

Now that our tools are installed, we can create the boilerplate for our Django blog project.

1. Start a New Django Project: The django-admin command is a powerful utility for managing projects. Use it to create a new project. We’ll call our project blog_project. The dot (.) at the end tells Django to create the project in the current directory.

   >django-admin startproject blog_project

   After running this, use the ls command to look at your file tree. You should see a manage.py file and a new folder named blog_project.
2. Run the Development Server: Let’s verify that everything is working. Django comes with a lightweight web server for development.

   >python manage.py runserver 0.0.0.0:8080

   We use 0.0.0.0:8080 specifically for Cloud9. This tells the server to listen on port 8080, which Cloud9 can access.
3. Preview Your Application: Once the server is running, Cloud9 will display a link. Alternatively, you can click on the “Preview” menu at the top and select “Preview Running Application.” A new tab will open inside your IDE, showing the default Django welcome page with a rocket taking off.

Congratulations! You have a running Django project. You can stop the server for now by pressing CTRL + C in the terminal.

Handling the “django.core.exceptions.DisallowedHost” Error

If you encounter the django.core.exceptions.DisallowedHost error while running your Django project, it means that the host attempting to access your application is not listed in the ALLOWED_HOSTS setting in your project’s settings.py file. This behavior is a security feature to prevent HTTP Host header attacks.

To resolve this issue:

1. Update the ALLOWED_HOSTS Setting:
   Open the settings.py file in your Django project and look for the ALLOWED_HOSTS setting. By default, it may look like this:ALLOWED_HOSTS = []
   Add the hostname or IP address you are using to access your application. For example:

   ALLOWED_HOSTS = ['your-cloud9-url.c9users.io', '127.0.0.1']

   Replace 'your-cloud9-url.c9users.io' with the specific URL or domain provided by your Cloud9 environment.
2. For Development Mode (Optional):
   If you’re in a development environment and do not want to specify hostnames, you can temporarily allow all hosts by setting:ALLOWED_HOSTS = [‘*’]
   However, this is not recommended for production as it poses a significant security risk.
3. Save and Restart the Server:
   After making the changes, save the file, and restart your server by running the following command in the terminal:python manage.py runserver 0.0.0.0:8080

Your application should now display without triggering the DisallowedHost error. Always ensure your ALLOWED_HOSTS configuration is appropriately restricted when deploying your application to a production environment.

Step 4: Preparing the Project for Heroku and Backing Up with GitHub

The final step in our setup is to create a few files that Heroku needs to deploy our application correctly—and to add project backup using GitHub. Keeping your code backed up on a remote repository makes collaboration and recovery seamless.

Heroku Deployment Files

1. Create a requirements.txt File: This file lists all the Python packages your project depends on. Heroku uses it to install the exact same dependencies in its environment. The pip freeze command automatically generates this list from your virtual environment.

   >pip freeze > requirements.txt 

2. Create a Procfile: This file tells Heroku what command to run to start your web application. Create a new file in your root directory (the same level as manage.py) named Procfile (with a capital “P” and no extension).
   In the Cloud9 file explorer, right-click the main folder and select “New File.” Name it Procfile. Add the following line to it:web: gunicorn blog_project.wsgi
   This command instructs Heroku to start a web process using the Gunicorn server and points it to the wsgi.py file inside your blog_project directory, which is the entry point for a Django application.
3. Create a runtime.txt File: This file specifies the exact version of Python you want Heroku to use, which prevents potential version conflicts. First, check your Python version:python –version
   Let’s say it returns Python 3.7.10. Create a new file named runtime.txt and add the following line, formatted exactly as shown:python-3.7.10

Your project’s root directory should now contain manage.py, Procfile, requirements.txt, runtime.txt, and the blog_project folder.

Backing Up Your Project with GitHub

It’s essential to regularly back up your project as you develop. Integrating Git and GitHub provides version control and a secure online backup.

1. Initialize a Git Repository:
   Open your terminal (make sure you’re in your project’s root folder) and run:

   >git init

2. Add All Files to the Repository:
   Stage all your project files:

   >git add .

3. Commit Your Work:
   Save a snapshot of your project:

   >git commit -m "Initial commit of Django blog project"

4. Create a New Repository on GitHub:
   Go to GitHub and, after logging in, click the “+” icon in the top right corner and select “New repository”.
   Give your repository a name (e.g., django-blog-project), add a description if you like, and click “Create repository”. Do not add a README, .gitignore, or license from GitHub, as your local repository already contains your files.
5. Connect Your Local Repository to GitHub:
   Copy the URL of your new GitHub repository (it will look like https://github.com/yourusername/django-blog-project.git). In your Cloud9 terminal, run:

   >git remote add origin https://github.com/yourusername/django-blog-project.git

6. Push Your Project to GitHub:
   Upload your local repository to GitHub:

>git branch -M main
>git push -u origin main

Troubleshooting Permission Denied (publickey) Error

If you encounter the Permission denied (publickey) error while attempting to push your project to GitHub, it indicates that GitHub cannot verify your identity because your SSH key is not correctly configured. To resolve this issue, follow these steps:

1. Check for an Existing SSH Key:
   Run the following command in your terminal to check if an SSH key already exists on your machine:

   >ls -al ~/.ssh

   If you see files like id_rsa or id_ed25519, it means an SSH key is already present.
2. Generate a New SSH Key (if needed):
   If no key exists, generate a new one using:

   >ssh-keygen -t ed25519 -C "your_email@example.com"

   Replace your_email@example.com with the email associated with your GitHub account. Follow the prompts to save the key to the default location and optionally set a passphrase.
3. Add the SSH Key to the SSH Agent:
   Start the SSH agent:

   >eval "$(ssh-agent -s)"

   Add your SSH key to the agent:

   >ssh-add ~/.ssh/id_ed25519

4. Add the SSH Key to Your GitHub Account:
   Copy the SSH key to your clipboard:

   >cat ~/.ssh/id_ed25519.pub

   Go to your GitHub account SSH and GPG keys settings and click New SSH key. Paste your key in the “Key” field, give it a title, and save it.
5. Test the SSH Connection:
   Verify your SSH setup by running:

   >ssh -T git@github.com

   If configured correctly, you should see a success message.
6. Push Your Changes Again:
   Once your SSH key is correctly configured, try running the push command again:

   >git push -u origin main

This should resolve the Permission denied (publickey) error and allow you to push your project to GitHub using SSH.

Now your Django project is safely backed up on GitHub. Any future changes can be committed and pushed in the same way.

Conclusion and Next Steps

You’ve successfully laid the groundwork for your blog. You have a fully configured cloud development environment, a fresh Django project, and all the necessary files for a smooth deployment to Heroku. This setup ensures that you can focus on building your application without worrying about local machine configurations.

In Part 2 of this series, we will dive into the heart of Django. We’ll design our first database models for blog posts, learn about Django’s powerful Object-Relational Mapper (ORM), and get acquainted with the admin interface, which gives you an out-of-the-box content management system. Stay tuned!