An Introduction to Bower

7, Nov 2015

Contents

Lets start a Django project using virtualenv and Bower

I've written about virtualenv before, so I won't go that much into detail about it this time. Suffice to say that virtualenv allows you to work in isolated Python environments where your project will not be influenced by any Python packages that exist on your system. This makes dependencies much easier to resolve when it omes time to deploy to production, as you know exactly what your project requires.

Lets get started

Making a virtual environment is absurdly simple:

mkvirtualenv <project_name>
pip install django
django-admin startproject <project_name>

Getting bower setup is equally easy:

npm install -g bower
pip install django-bower

The first Bower dependency that we're going to bring into our project is Bootstrap, which is an awesome base style for an application. Once the django-bower install has completed our Django project needs a couple changes to the settings file so that it can begin tracking Bootstrap and other Bower resources. Edit /settings.py and add 'djangobower' to the INSTALLED_APPS list. While you're in that fi le, add the following as well:

STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
    'djangobower.finders.BowerFinder',
)

BOWER_COMPONENTS_ROOT = '/%s/components/' % BASE_DIR
BOWER_INSTALLED_APPS = (
    'bootstrap',
)

Making use of it

Done! Run ./manage.py bower install to download the Bootstrap components. Now, let's make a template that uses it! In your base.html file add the following:

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

That's all there is to it!

Comments

This space intentionally left blank.

Have Something to Say?

Questions? Comments? Concerns? Let me know what you’re thinking.

  • You can use Markdown formatting here.