💸 Django Tutorial: Set up Media files in Deployment for FREE

In this tutorial, you will learn to manage your media files during deployment, (and even production) for free.

Cloudinary

We will use cloudinary, for that purpose. It will allow us to manage our media (Uploaded files), in Django, with just a few modifications in our settings file.

Differences between Static Files and Media Files

In web development, static files are those files that stay "static", which means that those files aren't modified at any moment of the user interacting with the site.

The main three static files are CSS, Javascript, and images, which are served in our templates.

In Django apps deployment we use, whitenoise for managing static files. Since Django by itself is not able to manage static files during development (Because of performance issues).

Media Files

On the other hand, media files are files uploaded by the users of your application. That means that these files are constantly changing, and therefore require their own way to be served.

Cloudinary storage

To use the Cloudinary storage API, we're going to create a free account, here.

Hit in create an account, and verify your account with your email.

You will get a Dashboard with your Credentials, We'll use them later 😉.

Modifying the settings:

First of all, we will need the Cloudinary packages, to be able to use it as a media manager. So let's install some packages.

pip install cloudinary django-cloudinary-storage

Now let's import, a couple of modules

# At the top of the settings
import cloudinary
import cloudinary_storage

And modify the installed apps

INSTALLED_APPS = [
    # Other apps ...

    # Media Cloudinary
    'cloudinary',
    'cloudinary_storage',
]

Last but not least, paste the following code after, these comments

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.1/howto/static-files/

Like this.

# Cloudinary stuff
CLOUDINARY_STORAGE = {
    'CLOUD_NAME': <your cloud name>,
    'API_KEY': <your api key>,
    'API_SECRET': <your secret api>,
}

DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.MediaCloudinaryStorage'

But somebody would tell me: Hey, are you crazy? we are putting our credentials in an unprotected settings.py file.

And yeah, that's right!

So the idea is to protect our credentials, with Environmental Variables. That means that we're going to put all of our keys in the server, that we are going to deploy our code, and not in the source files.

You could use os.environ.get("Key"), but as I'm going to deploy my app to Heroku, I'll use Python Decouple.

If you want to learn, how to use Python decouple on Heroku, you definitely take a look at this tutorial.

In that case, our Cloudinary settings would be like this

from decouple import config

CLOUDINARY_STORAGE = {
    'CLOUD_NAME': config('CLOUD_NAME', default=""),
    'API_KEY': config('API_KEY', default=""),
    'API_SECRET': config('API_SECRET', default=""),
}

DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.MediaCloudinaryStorage'

Thanks for your time hopefully this tutorial will be useful for you 🤗.

Any doubts, or problems? Let me know in the comments.

Comments

[Daniel Diaz]

Let me know your thoughts, here!

[Yair Dorantes]

muchaaaaaaas gracias, me estaba rompiendo la cabeza lo de los media files y gracias a este post he conseguido mostrarlos en la página, me has salvado la vida, mil graciassss!!!!

[Daniel Diaz]

Dale, me alegra mucho que te haya servido

[Mohammad Abdul Ahad]

This app broke my rest framework app(settings was somehow setting into defaults).

[Mohannad Abusaif]

Hello Daniel,
How can I contact you ?

[Daniel Diaz]

Ping me on Linkedin, Twitter, or GitHub

[segestic]

Kudos, nice tutorial.