One of the more frustrating aspects of programming for the web is managing the development and deployment of static assets. Everything is fine until your site goes live… then you have to deal with images, CSS, and JavaScript staying in sync and being called correctly from either the dev or production instance.

Here in the Labs we host all of our production static content on Amazon S3. Updating an existing site involves either changing static files on the production site before the code is launched or changing script and link URLs to point locally during development… remembering to change everything back when the code is pushed out. This process causes much frustration among developers and designers as people often lose track of where things are pointing and the current state of content.

To make life easier on everyone, we’ve developed django-mediasync to manage the deployment of our media content. Develop locally, then when the code is ready for production run mediasync to push static media to S3. mediasync will take care of:

• running gzip+jsmin on JavaScript files
• running gzip+cssmin on CSS files
• adding expires headers to everything (default of 1 year)
• rewriting the CSS files to use the S3 media URL instead of the local development URL

Templates that reference JavaScript and CSS files use media template tags to reference the files in the correct location. When DEBUG = True, media is served locally; in production media is served from S3.

{% load media %}
{% js "jquery.js" %}
{% css "screen.css" %}
{% css_ie "iefix.css" %}

There are many more details in the project’s README file. Take a look, use it, contribute back.

django-mediasync!