Managing Static and Media Files in Django

Tutorial 5 of 5

1. Introduction

In this tutorial, we will learn how to manage both static and media files in Django. Static files are all your CSS and JavaScript files. Your Django application will use these files in a static manner, hence the name. Media files, on the other hand, are uploaded by the user.

By the end of this tutorial, you will understand:
- How to organize your static and media files
- How to serve these files
- How to link these files in your templates

Prerequisites:
- Basic knowledge of Python
- Familiarity with Django's basic concepts
- Django installed on your computer

2. Step-by-Step Guide

Concept Explanation

In Django, static files are stored in a directory named static in each application. Django will look for static files there, similarly for templates.

Media files are not necessarily tied to an application, hence they are stored in a directory named media at the root of your project.

Django's STATICFILES_FINDERS setting contains a list of finders that know how to discover static files from various sources.

Best Practices

  • Always use Django's static template tag to refer to your static files as it's platform-independent and won't break if the STATIC_URL setting changes.
  • Don't serve your static files in the same directory as your media files as it's a security risk.

3. Code Examples

Serving Static Files

First, we need to tell Django where our static files are. In your settings.py file:

STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static'),]

In your template:

{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}">

Serving Media Files

In your settings.py file:

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

In your views.py file, you can use FileResponse:

from django.http import FileResponse

def download(request, path):
    file_path = os.path.join(settings.MEDIA_ROOT, path)
    return FileResponse(open(file_path, 'rb'))

4. Summary

In this tutorial, we've learned how to organize, serve, and link static and media files in Django.

For further learning, you could explore topics like:
- How to use Django's collectstatic command
- How to optimize static files delivery

Additional resources:
- Django's official documentation on managing static files
- Django's official documentation on managing files

5. Practice Exercises

  1. Create a Django application and include a CSS file. Make sure your web page is using the styles defined in this CSS file.

  2. Add the capability for users to upload a file in the application you created in the first exercise. Make sure you can download the file through a URL.

Solutions:

  1. Create a new Django app, add a static directory, and within that a css directory. Then, add the CSS file to this directory. Link to this file in your template using the {% static %} template tag.

  2. Add a FileField to one of your models. Then, in your template, you can use a form to allow users to upload files. In your view, handle this information and save it to your model. You should now be able to access these files through the URL you've defined.