{"id":1807,"date":"2024-06-05T23:41:15","date_gmt":"2024-06-06T03:41:15","guid":{"rendered":"https:\/\/www.craigperler.com\/blog\/?p=1807"},"modified":"2024-06-07T10:17:04","modified_gmt":"2024-06-07T14:17:04","slug":"setup-django-docker-postgresql-react","status":"publish","type":"post","link":"https:\/\/www.craigperler.com\/blog\/2024\/06\/05\/setup-django-docker-postgresql-react\/","title":{"rendered":"How to Set up Django with Docker, PostgreSQL and React"},"content":{"rendered":"\n

Figuring out how to set up Django with Docker, PostgreSQL, and React can be a complex task, especially if you, like me, don’t really code much nowadays<\/a>. The boilerplate effort around configuring these technologies is often the first thing I forget with each re-immersion. This article serves as a reminder for how to kickstart a Python web project using Django, PostgreSQL, Docker, and React. So you don’t have to figure it out each time you just want to build a simple website. <\/em>While tools like cookiecutter-django<\/a> offer a solid alternative, there is something invaluable about the hands-on approach that truly cements how these pieces fit together.<\/p>\n\n\n\n

We\u2019ll take an iterative approach, introducing new components with each section. First, we\u2019ll set up a basic Django project using a virtual environment. We will then containerize the project with Docker, integrate PostgreSQL as a robust database solution, and finally, incorporate React to build a dynamic frontend. This step-by-step guide ensures a comprehensive understanding of how to set up Django with Docker, PostgreSQL, and React, creating a modern web application.<\/p>\n\n\n\n

Prerequisites<\/strong><\/h3>\n\n\n\n

Before diving into setting up your Django project, make sure you have the following prerequisites in place:<\/p>\n\n\n\n

    \n
  1. Python<\/strong>: Ensure you have Python installed on your system. Download it from the official Python website<\/a>.<\/li>\n\n\n\n
  2. PyCharm (or another IDE)<\/strong>: We\u2019ll be using PyCharm in this tutorial, but you can use any other integrated development environment (IDE) of your choice.<\/li>\n\n\n\n
  3. Pipenv<\/strong>: This tool helps manage project dependencies and virtual environments. Install Pipenv by running:<\/li>\n<\/ol>\n\n\n
    \npip install pipenv\n<\/pre><\/div>\n\n\n
    Setting Up the Project<\/strong><\/h3>\n\n\n\n
    With the prerequisites in place, let\u2019s start setting up our Django project.<\/p>\n\n\n\n
    Set up Django<\/strong><\/h2>\n\n\n\n
    When starting a new Django project, the first step is to set up a solid foundation using a virtual environment. This isolates your project\u2019s dependencies, ensuring that packages required for one project don\u2019t interfere with others. We\u2019ll use Pipenv, a tool that combines package management and virtual environment handling, to streamline this process.<\/p>\n\n\n\n
    Create a New PyCharm Project<\/strong><\/h3>\n\n\n\n
      \n
    1. Name Your Project<\/strong>: Start by naming your project. This is the initial setup where you define your project\u2019s identity.<\/li>\n\n\n\n
    2. Select the Python Virtual Environment Tool<\/strong>: Choose Pipenv. This helps in managing dependencies and creating isolated environments.<\/li>\n\n\n\n
    3. Choose the Base Interpreter<\/strong>: Select the Python version you want to use for your project.<\/li>\n<\/ol>\n\n\n\n
      \"Set<\/figure>\n\n\n\n
      About Pipenv<\/strong><\/h3>\n\n\n\n
      Your project will include a base Pipfile, which contains all the packages needed to run the project. Pipenv is a powerful tool that combines the functionality of virtual environments with dependency management, making it easier to maintain consistent development environments.<\/p>\n\n\n\n
      Install Django<\/strong><\/h3>\n\n\n\n
      With the virtual environment ready, the next step is to install Django. Open the terminal within PyCharm and run the following command:<\/p>\n\n\n
      \npipenv install django\n<\/pre><\/div>\n\n\n
      This command installs Django within the virtual environment, ensuring that your project has access to the necessary libraries.<\/p>\n\n\n\n
      Create a Django Project<\/strong><\/h3>\n\n\n\n
      Now, let\u2019s set up the initial structure of our Django project. Run these commands in the terminal:<\/p>\n\n\n
      \ndjango-admin startproject config .\n.\/manage.py migrate\n.\/manage.py runserver\n<\/pre><\/div>\n\n\n
      By default, Django uses SQLite as the database backend. After running migrations, you\u2019ll see a db document in your project folder, indicating that the database is set up and ready to use. You can now access your locally running website at http:\/\/127.0.0.1:8000\/<\/a>.<\/p>\n\n\n\n
      \"Shows<\/figure>\n\n\n\n
      Next, we\u2019re going to build on this project by using Docker, defining a container within which our project will deploy and run.<\/p>\n\n\n\n
      Set up Django with Docker<\/h2>\n\n\n\n
      While Pipenv is great for managing dependencies and virtual environments, Docker takes things a step further by providing complete isolation for your application, ensuring it runs consistently across different environments. Docker allows you to package your application with all its dependencies, including the operating system, into a single container. This is particularly useful for development, testing, and deployment, as it eliminates the \u201cit works on my machine\u201d problem.<\/p>\n\n\n\n
      Install Docker<\/strong><\/h3>\n\n\n\n
      First, we need to install Docker:<\/p>\n\n\n\n
        \n
      1. Download Docker<\/strong>: Get Docker from its official website<\/a>.<\/li>\n\n\n\n
      2. Follow the installation instructions<\/strong>: Install Docker based on your operating system.<\/li>\n\n\n\n
      3. Ensure Docker is running<\/strong>: Docker should be running as a background process on your computer.<\/li>\n<\/ol>\n\n\n\n
        Create a Dockerfile<\/strong><\/h3>\n\n\n\n
        A Dockerfile is a script that contains a series of instructions on how to build a Docker image for your application. Create a file named Dockerfile<\/em> at the root of your project with the following content:<\/p>\n\n\n
        \n# Use the official Python image from the Docker Hub\nFROM python:3.11\n\n# Prevents Python from writing .pyc files to disk\nENV PYTHONDONTWRITEBYTECODE 1\n\n# Ensures that the output of the Python application is sent straight to the terminal\nENV PYTHONUNBUFFERED 1\n\n# Set the working directory inside the Docker container\nWORKDIR \/app\n\n# Install pipenv for managing dependencies and virtual environments\nRUN pip install pipenv\n\n# Ensure pipenv uses the specified Python version (Python 3.11) for the virtual environment\nRUN pipenv --python \/usr\/local\/bin\/python3.11\n\n# Copy the entire project directory to the working directory in the Docker container\nCOPY . \/app\n\n# Install pipenv and then use it to install the dependencies defined in the Pipfile\nRUN pipenv install --system --deploy\n<\/pre><\/div>\n\n\n