SaltyCrane Blog — Notes on JavaScript and web development

Django Blog Project #7: Adding a simple Atom feed

Setting up a basic Atom feed for my new blog was not too difficult. I followed the instructions in the Django documentation and created a basic Atom feed for my 10 latest posts. There were a couple of things I couldn't figure out: 1) how to create a feed for a specific tag, and 2) how to redirect my feed to FeedBurner. I know these things are not that hard, but I want to get my new blog working as soon as possible so I can start using it. If anyone knows how to do these things, I'd be grateful for your feedback. Regarding item 1, I plan to replace my tagging functionality hack with the django-tagging application so maybe I will wait until then to add tag-specific feeds. Regarding item 2, I read about using .htaccess to do redirects, but I couldn't figure out how to do a feed redirect at Webfaction.

Anyways, here are the steps I took to create a basic feed of my latests posts. Refer to the Django syndication feed framework documentation for more details.



Modify the URLConf
Per the documentation, I modified my ~/src/django/myblogsite/urls.py:
from django.conf.urls.defaults import *
from iwiwdsmi.myblogapp.views import *
from iwiwdsmi.feeds import *

feeds = {
    'latest': LatestPosts,
}

urlpatterns = patterns(
    '',
    (r'^site_media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': '/home/sofeng/src/django/myblogsite/media'}),

    (r'^admin/', include('django.contrib.admin.urls')),
    (r'^feeds/(?P<url>.*)/$', 'django.contrib.syndication.views.feed', 
     {'feed_dict': feeds}),    
    
    (r'^blog/$', frontpage),
    (r'^blog/(\d{4,4})/(\d{2,2})/([\w\-]+)/$', singlepost),
    (r'^blog/(\d{4,4})/$', yearview),
    (r'^blog/(\d{4,4})/(\d{2,2})/$', monthview),
    (r'^blog/tag/([\w\-]+)/$', tagview),
)


Create a feeds.py file

I created the following file at ~/src/django/myblogsite/feeds.py. Note, I factored out my main title, "Sofeng's Blog 0.0.6", into the variable MAIN_TITLE in my views.py file and used it here. The class attributes, title and description are strings describing the feed.

from django.contrib.syndication.feeds import Feed
from django.utils.feedgenerator import Atom1Feed
from iwiwdsmi.myblogapp.models import Post
from iwiwdsmi.myblogapp.views import MAIN_TITLE

class LatestPosts(Feed):
    title = MAIN_TITLE
    link = "/blog/"
    description = MAIN_TITLE + ": Latest posts"
    feed_type = Atom1Feed
    
    def items(self):
        return Post.objects.order_by('-date_created')[:10]


Create feed templates

I created two feed templates which are used to display the title and body for each post. They each only contain one line.

~/src/django/myblogsite/templates/feeds/latest_title.html:
{{ obj.title }}

~/src/django/myblogsite/templates/feeds/latest_description.html:
{{ obj.body }}


Display a link to the new feed

I added a link to my new feed in my base.html template.

Excerpt from ~/src/django/myblogsite/templates/base.html:
        <h4>FEEDS</h4>
          <a href="/feeds/latest/" rel="alternate" type="application/rss+xml"><img alt="" style="vertical-align:middle;border:0" src="http://www.feedburner.com/fb/images/pub/feed-icon16x16.png"/></a>
        <a href="/feeds/latest/">Subscribe to Atom feed</a><br>


Change site name

When I first created my Django project, I installed the django.contrib.sites app (by default), but I did not change my site name, so my feed used the site example.com instead of my real site. Here is how I changed my site name:

  1. I went to the admin page at http://127.0.0.1:8000/admin/
  2. I clicked on "Sites", then on "example.com".
  3. I changed "example.com" to "saltycrane.com" and clicked the "Save" button.


Deploy and Test

I pushed my changes to the Webfaction server, updated my repository, and restarted the Apache server. Then I pointed Firefox at http://saltycrane.com/blog/ and clicked on my new "Subscribe to Atom feed" link. I subscribed to the feed using "Google" and chose "Add to Google Reader" and saw my new feed in Google Reader.
Here is a screenshot of my feed in my Google Reader:


Extra links on redirection for my reference:
Webfaction knowledgebase article on redirection
Blog article on redirecting feeds to FeedBurner

Related posts:
  Django Blog Project #1: Creating a basic blog
  Django Blog Project #2: Deploying at Webfaction
  Django Blog Project #3: Using CSS and Template Inheritance
  Django Blog Project #4: Adding post metadata
  Django Blog Project #5: YUI CSS and serving static media
  Django Blog Project #6: Creating standard blog views
  Django Blog Project #8: Adding basic comment functionality with Django Free Comments

Django Blog Project #6: Creating standard blog views

My last django post actually got a little bit of publicity-- a mention on Python reddit, and a mention in the Yahoo User Interface blog In the Wild for June 20 article. So I feel a little pressure to produce intelligent, engaging content so as not to disappoint the hordes of new readers I must now have. Unfortunately, the topic of this post is pretty dry. Goodbye, new readers. I'll try to find you another time.

The topic of this post is creating standard blog views. So far, I've created a simple blog application that allows me to log in to an Admin interface and enter blog posts, I added some post metadata such as date and tags, and, last time, I added YUI stylesheets to create a cross browser layout solution. However, until now, my trying-so-hard-to-be-a-real website only had a single front page view with a list of all the blog posts. I needed to add other views, such as a single post view, an archive view, and a tag view. Here are the changes I made to implement these views.

Warning: I am a newbie to Django and web development. I've created this blog series to document my journey in creating a blog application using Django. It does not necessarily represent Django best practices. To the extent of my knowledge, I try to follow Django conventions and philosophies, but I know I must still have a number of violations, particularly in this latest revision. Hopefully, as I learn better ways of doing things, I can post corrections. If you have corrections, please leave a comment.

For a much better example of a Django blog application, see Adam Gomaa's Django blog site source code repository. Though I don't understand everything in there, I've referenced it a number of times while creating my blog site. Update 2008-06-29: I just discovered that James Bennett, a Django contributer, also has blog application source code available online. Seeing as he has written a book on Django, this <sarcasm>might</sarcasm> be a good place to look as well.



models.py

In my models.py file, I added a slug field to store the last part of the url and a method called get_tag_list to return the tags for the post as a list.

~/src/django/myblogsite/myblogapp/models.py:
import re
from django.db import models

class Post(models.Model):
    title = models.CharField(maxlength=200)
    slug = models.SlugField(maxlength=100)
    date_created = models.DateTimeField()
    date_modified = models.DateTimeField(auto_now=True)
    tags = models.CharField(maxlength=200)
    body = models.TextField()

    def get_tag_list(self):
        return re.split(" ", self.tags)

    def __str__(self):
        return self.title

    class Meta:
        ordering = ["-date_created"]

    class Admin:
        pass


views.py

In my views.py file, to the frontpage view, I added a single post view, an archive view by year, an archive view by month, and a tag view. I also added a couple functions to create an archive index and a tag index.

~/src/django/myblogsite/myblogapp/views.py:
import re
from datetime import datetime
from django.shortcuts import render_to_response
from myblogsite.myblogapp.models import Post

MONTH_NAMES = ('', 'January', 'Feburary', 'March', 'April', 'May', 'June', 'July',
               'August', 'September', 'October', 'November', 'December')

def frontpage(request):
    posts, pagedata = init()
    pagedata.update({'subtitle': '',})
    return render_to_response('listpage.html', pagedata)

def singlepost(request, year, month, slug2):
    posts, pagedata = init()
    post = posts.get(date_created__year=year,
                            date_created__month=int(month),
                            slug=slug2,)
    pagedata.update({'post': post})
    return render_to_response('singlepost.html', pagedata)
    
def yearview(request, year):
    posts, pagedata = init()
    posts = posts.filter(date_created__year=year)
    pagedata.update({'post_list': posts,
                     'subtitle': 'Posts for %s' % year})
    return render_to_response('listpage.html', pagedata)

def monthview(request, year, month):
    posts, pagedata = init()
    posts = posts.filter(date_created__year=year)
    posts = posts.filter(date_created__month=int(month))
    pagedata.update({'post_list': posts,
                     'subtitle': 'Posts for %s %s' % (MONTH_NAMES[int(month)], year),})
    return render_to_response('listpage.html', pagedata)

def tagview(request, tag):
    allposts, pagedata = init()
    posts = []
    for post in allposts:
        tags = re.split(' ', post.tags)
        if tag in tags:
            posts.append(post)
    pagedata.update({'post_list': posts,
                     'subtitle': "Posts tagged '%s'" % tag,})
    return render_to_response('listpage.html', pagedata)

def init():
    posts = Post.objects.all()
    tag_data = create_tag_data(posts)
    archive_data = create_archive_data(posts)
    pagedata = {'version': '0.0.5',
                'post_list': posts,
                'tag_counts': tag_data,
                'archive_counts': archive_data,}
    return posts, pagedata

def create_archive_data(posts):
    archive_data = []
    count = {}
    mcount = {}
    for post in posts:
        year = post.date_created.year
        month = post.date_created.month
        if year not in count:
            count[year] = 1
            mcount[year] = {}
        else:
            count[year] += 1
        if month not in mcount[year]:
            mcount[year][month] = 1
        else:
            mcount[year][month] += 1
    for year in sorted(count.iterkeys(), reverse=True):
        archive_data.append({'isyear': True,
                             'year': year, 
                             'count': count[year],})
        for month in sorted(mcount[year].iterkeys(), reverse=True):
            archive_data.append({'isyear': False,
                                 'yearmonth': '%d/%02d' % (year, month),
                                 'monthname': MONTH_NAMES[month], 
                                 'count': mcount[year][month],})
    return archive_data

def create_tag_data(posts):
    tag_data = []
    count = {}
    for post in posts:
        tags = re.split(" ", post.tags)
        for tag in tags:
            if tag not in count:
                count[tag] = 1
            else:
                count[tag] += 1
    for tag, count in sorted(count.iteritems(), key=lambda(k, v): (v, k), reverse=True):
        tag_data.append({'tag': tag,
                         'count': count,})
    return tag_data


Templates
I made the following template changes:
  • I modified the sidebar in base.html to display an archive index and a tag index.
  • I replaced frontpage.html with a more generic listpage.html template used for displaying the frontpage, archives, and tag views.
  • I added a singlepost.html template for displaying a single post view.
  • In all the templates, I created links to navigate among the different views.
~/src/django/myblogsite/templates/base.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/reset-fonts-grids/reset-fonts-grids.css">
  <link rel="stylesheet" type="text/css" href="/site_media/css/mystyle.css">
  <title>{% block title %}Sofeng's Blog {{ version }}{% endblock %}</title>
</head>

<body>
  <div id="doc" class="yui-t4">

    <div id="hd">
      <h1>
        <img align="center" src="/site_media/image/crane.jpg">
        {% block header1 %}Sofeng's Blog {{ version }}{% endblock %}
      </h1>
      <h2>{% block header2 %}{% endblock %}</h2>
    </div>

    <div id="bd">
      <div id="yui-main">
        <div class="yui-b">
          {% block main %}{% endblock %}
        </div>
      </div>
    
      <div class="yui-b" id="sidebar">
        {% block sidebar %}
        <h4>ABOUT</h4>
        <p>This is my new blog created using <a href="http://www.djangoproject.com">Django</a>,
          a <a href="http://www.python.org">Python</a> web framework. This site is under 
          construction. My current blog is located at: 
          <a href="http://iwiwdsmi.blogspot.com">http://iwiwdsmi.blogspot.com</a>.
        </p>
        <br>
        <h4>TAGS</h4>
        {% for line in tag_counts %}
            <a href="/blog/tag/{{ line.tag }}/">{{ line.tag }}</a> ({{ line.count }})<br>
        {% endfor %}
        <br>
        <h4>ARCHIVE</h4>
        {% for line in archive_counts %}
          {% if line.isyear %}
            {% if not forloop.first %}
              <br>
            {% endif %}
              <a href="/blog/{{ line.year }}/">{{ line.year }}</a> ({{ line.count }})<br>
          {% else %}
                <a href="/blog/{{ line.yearmonth }}/">{{ line.monthname }}</a> ({{ line.count }})<br>
          {% endif %}
        {% endfor %}
        <br>
        {% endblock %}
      </div>
    </div>

    <div id="ft">
      Created with <a href="http://www.djangoproject.com/">Django</a>.<br>
      Hosted by <a href="http://www.webfaction.com/">Webfaction</a>.
    </div>
  </div>

</body>
</html>
~/src/django/myblogsite/templates/listpage.html:
{% extends "base.html" %}

{% block title %}
  Sofeng's Blog {{ version }}
  {% if subtitle %}:{% endif %}
  {{ subtitle }}
{% endblock %}

{% block header1 %}
  {% if subtitle %}
    <a href="/blog/">Sofeng's Blog {{ version }}</a>
  {% else %}
    Sofeng's Blog {{ version }}
  {% endif %}
{% endblock %}

{% block header2 %}
  {{ subtitle }}
{% endblock %}

{% block main %}
  {% for post in post_list %}
    <h3><a href="/blog/{{ post.date_created|date:"Y/m" }}/{{ post.slug }}/">
        {{ post.title }}</a>
    </h3>
    {{ post.body }}
    <hr>
    <div class="post_footer">
      {% ifnotequal post.date_modified.date post.date_created.date %}
        Last modified: {{ post.date_modified.date }}<br>
      {% endifnotequal %}
      Date created: {{ post.date_created.date }}<br>
      Tags: 
      {% for tag in post.get_tag_list %}
        <a href="/blog/tag/{{ tag }}/">{{ tag }}</a>{% if not forloop.last %}, {% endif %}
      {% endfor %}
    </div>
    <br>
  {% endfor %}
{% endblock %}
~/src/django/myblogsite/templates/singlepost.html:
{% extends "base.html" %}

{% block title %}
  Sofeng's Blog {{ version }}: {{ post.title }}
{% endblock %}

{% block header1 %}
  <a href="/blog/">Sofeng's Blog {{ version }}</a>
{% endblock %}

{# to fix IE #}
{% block header2 %} {% endblock %}

{% block main %}
    <h3>{{ post.title }}</h3>
    {{ post.body }}
    <hr>
    <div class="post_footer">
      {% ifnotequal post.date_modified.date post.date_created.date %}
        Last modified: {{ post.date_modified.date }}<br>
      {% endifnotequal %}
      Date created: {{ post.date_created.date }}<br>
      Tags: 
      {% for tag in post.get_tag_list %}
        <a href="/blog/tag/{{ tag }}/">{{ tag }}</a>{% if not forloop.last %}, {% endif %}
      {% endfor %}
    </div>
    <br>
{% endblock %}


urls.py

As the last step in my bottom-up approach, I modified my urls.py and urls_webfaction.py.

~/src/django/myblogsite/urls_webfaction.py:
from django.conf.urls.defaults import *
from myblogsite.myblogapp.views import *

urlpatterns = patterns(
    '',
    (r'^admin/', include('django.contrib.admin.urls')),
    (r'^myview1/$', myview1),
    (r'^blog/$', frontpage),
    (r'^blog/(\d{4,4})/(\d{2,2})/([\w\-]+)/$', singlepost),
    (r'^blog/(\d{4,4})/$', yearview),
    (r'^blog/(\d{4,4})/(\d{2,2})/$', monthview),
    (r'^blog/tag/([\w\-]+)/$', tagview),
)


Finish

I uploaded, updated, and restarted the Apache server as usual.


Here is a snapshot screenshot of the site:

The live site is located at: http://saltycrane.com/blog/

Related posts:
  Django Blog Project #1: Creating a basic blog
  Django Blog Project #2: Deploying at Webfaction
  Django Blog Project #3: Using CSS and Template Inheritance
  Django Blog Project #4: Adding post metadata
  Django Blog Project #5: YUI CSS and serving static media
  Django Blog Project #7: Adding a simple Atom feed
  Django Blog Project #8: Adding basic comment functionality

How to get the current date and time in Python

Here is an example of how to get the current date and time using the datetime module in Python:

import datetime

now = datetime.datetime.now()

print
print "Current date and time using str method of datetime object:"
print str(now)

print
print "Current date and time using instance attributes:"
print "Current year: %d" % now.year
print "Current month: %d" % now.month
print "Current day: %d" % now.day
print "Current hour: %d" % now.hour
print "Current minute: %d" % now.minute
print "Current second: %d" % now.second
print "Current microsecond: %d" % now.microsecond

print
print "Current date and time using strftime:"
print now.strftime("%Y-%m-%d %H:%M")

print
print "Current date and time using isoformat:"
print now.isoformat()

Results:
Current date and time using str method of datetime object:
2014-09-26 16:34:40.278298

Current date and time using instance attributes:
Current year: 2014
Current month: 9
Current day: 26
Current hour: 16
Current minute: 34
Current second: 40
Current microsecond: 278298

Current date and time using strftime:
2014-09-26 16:34

Current date and time using isoformat:
2014-09-26T16:34:40.278298

Directly from the time module documentation, here are more options to use with strftime:

DirectiveMeaningNotes
%aLocale's abbreviated weekday name.
%ALocale's full weekday name.
%bLocale's abbreviated month name.
%BLocale's full month name.
%cLocale's appropriate date and time representation.
%dDay of the month as a decimal number [01,31].
%HHour (24-hour clock) as a decimal number [00,23].
%IHour (12-hour clock) as a decimal number [01,12].
%jDay of the year as a decimal number [001,366].
%mMonth as a decimal number [01,12].
%MMinute as a decimal number [00,59].
%pLocale's equivalent of either AM or PM.(1)
%SSecond as a decimal number [00,61].(2)
%UWeek number of the year (Sunday as the first day of the week) as a decimal number [00,53]. All days in a new year preceding the first Sunday are considered to be in week 0.(3)
%wWeekday as a decimal number [0(Sunday),6].
%WWeek number of the year (Monday as the first day of the week) as a decimal number [00,53]. All days in a new year preceding the first Monday are considered to be in week 0.(3)
%xLocale's appropriate date representation.
%XLocale's appropriate time representation.
%yYear without century as a decimal number [00,99].
%YYear with century as a decimal number.
%ZTime zone name (no characters if no time zone exists).
%%A literal "%" character.


See also:

Django Blog Project #5: YUI CSS and serving static media

I wrote about adding some CSS to my new blog in my post #3. However, I got the CSS layout code from a book that was a couple of years old (CSS Cookbook, 2006). I created a 2 column fixed width layout, but it was not centered. It turns out creating a robust, cross-browser solution to centering a page layout is not trivial, even in 2008.

I happened to notice that the Django Book used YUI style sheets for styling its online book. The Yahoo User Interface Library (YUI) consists mostly of a Javascript Library, but it also includes "several core CSS resources". Doing a search among Django blogs using django blog search revealed that YUI was a pretty popular choice for CSS among Django users. Watching the 42 minute YUI CSS introductory video gave me a better understanding of the current state of CSS and browser compatability and how to use YUI to easily create consistent layouts across a variety of browsers.

So in this post I'll touch on how I used the YUI CSS library to restyle my slowly-getting-to-be-a-fledgling site. I'll also note how I setup Django and Webfaction to serve the static CSS media files. (What, I need a special setup to use external CSS stylesheets? you ask. I know, it suprised me too.) Finally, I made some small updates to my model to use more reasonable model attribute field types.


Setup YUI-based template

In my base.html template file, I removed all the CSS in between the <style></style> tags and replaced it with a link to the YUI concatenated, minified reset+fonts+grids aggregate file. I also added a link to my to-be-described-later local CSS stylesheet, mystyle.css. In the body section, I added a number of div blocks to create the required structure for the YUI library. The following code creates a fixed 750 pixel total width layout with a 180 pixel side column on the right and a full width header and footer. Not coming from a web background, I had thought this type of thing would be easier. I guess this complexity contributes to the demand for tools such as Dreamweaver.

~/src/django/myblogsite/templates/base.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/reset-fonts-grids/reset-fonts-grids.css">
  <link rel="stylesheet" type="text/css" href="/site_media/css/mystyle.css">
  <title>{% block title %}Sofeng's Blog Version {{ VERSION }}{% endblock %}</title>
</head>

<body>
  <div id="doc" class="yui-t4">
    <div id="hd">
      <h1>Sofeng's Blog Version {{ VERSION }}</h1>
    </div>
    <div id="bd">
      <div id="yui-main">
        <div class="yui-b">
          {% block main %}{% endblock %}
        </div>
      </div>
      <div class="yui-b" id="sidebar">
        {% block sidebar %}
        <h3>ABOUT</h3>
        <p>This is my new blog created using <a href="http://www.djangoproject.com">Django</a>,
          a <a href="http://www.python.org">Python</a> web framework. This site is under 
          construction. My current blog is located at: 
          <a href="http://iwiwdsmi.blogspot.com">http://iwiwdsmi.blogspot.com</a>.
        </p>
        {% endblock %}
      </div>
    </div>
    <div id="ft">
      A <a href="http://www.djangoproject.com/">Django</a> site.
    </div>
  </div>
</body>
</html>

Create local mystyle.css stylesheet

mystyle.css contains the CSS code to customize the style (fonts, colors, spacing, etc.) of my site. Currently it is just a copy of YUI's Base library with a few minor modifications. (YUI's Reset library removes all browser specific styling (located in browser.css or similar). Then the YUI Base library adds back the common element styles that we are familiar with. This provides consistency across browsers.) I saved this file at ~/src/django/myblogsite/media/css/mystyle.css.


Serve static CSS media files (development server)

Django doesn't serve static media files such as CSS, JavaScript, and images by default. The reason is that Django is meant to create dynamically generated webpages and serving static media is best left to a tool designed for this task such as Apache. However, during development, it is convenient to have the Django development server (python manage.py runserver) serve the static media files. To do this, I used these instructions from Django. This amounted to adding a new line to my URLConf (urls.py).

~/src/django/myblogsite/urls.py:
from django.conf.urls.defaults import *
from myblogsite.myblogapp.views import *

urlpatterns = patterns(
    '',
    (r'^admin/', include('django.contrib.admin.urls')),
    (r'^myview1/$', myview1),
    (r'^blog/$', frontpage),
    (r'^site_media/(?P.*)$', 'django.views.static.serve', {'document_root': '/home/sofeng/src/django/myblogsite/media'}),
)

Serve static CSS media files (Webfaction server)

To serve my static CSS file at Webfaction, I followed these Webfaction knowledgebase instructions:

  1. I went to the Webfaction Control Panel
  2. Under the ">Domains/websites" menu, I selected "Applications"
  3. I selected the icon with the plus to add a new App.
  4. I filled in the following fields:
    "Name": myblogsite_media "App type": Symbolic link "Extra info": /home/sofeng/webapps/django/myblogsite/media
  5. Under the ">Domains/websites" menu, I selected "Websites"
  6. I clicked on the pencil icon to edit my website
  7. Under "Site apps", I selected the icon with the plus to add a new site app.
  8. I selected "myblogsite_media" as the App and entered /site_media as the "URL path".

In my settings_webfaction.py file I updated the MEDIA_ROOT and MEDIA_URL variables. (Did I forget to mention I created a separate settings file for Webfaction. I point to the settings_webfaction.py file in my ~/webapps/django/apache2/conf/httpd.conf.) I also created a new file, urls_webfaction.py that doesn't have the above modification and I point to this URLConf in my settings_webfaction.py. I know there has got to be a better way to do this, but my tired brain hasn't figured it out yet.

In ~/src/django/myblogsite/settings_webfaction.py, I modified the following lines:
MEDIA_ROOT = '/home/sofeng/webapps/django/myblogsite/media/'
MEDIA_URL = '/site_media/'
ROOT_URLCONF = 'myblogsite.urls_webfaction'

Upload project and deploy
On my local machine:
$ pushwebf
On Webfaction machine:
$ hg update -C
$ ~/webapps/django/apache2/bin/restart

Here is a snapshot screenshot of the site:
The live site can be viewed at: http://saltycrane.com/blog/

Related posts:
  Django Blog Project #1: Creating a basic blog
  Django Blog Project #2: Deploying at Webfaction
  Django Blog Project #3: Using CSS and Template Inheritance
  Django Blog Project #4: Adding post metadata
  Django Blog Project #6: Creating standard blog views

Django Blog Project #4: Adding post metadata

I've created a basic blog using SQLite as a backend, deployed it at a shared hosting provider, Webfaction, and added a little CSS for style. Now what? Well, while I say I've created a basic blog, I should say it's a not-quite-yet-basic blog. All it has is some text, which I call Posts, separated by <hr> tags. The next step is to add some post metadata, such as a title, date of creation and tags.


Modify the Post model

To create this new metadata, I first modified the Post model in ~/src/django/myblogsite/myblogapp/models.py:

from django.db import models

class Post(models.Model):
    title = models.CharField(maxlength=500)
    date_created = models.DateField()
    tags = models.CharField(maxlength=200)
    body = models.TextField()

    def __str__(self):
        return self.title

    class Meta:
        ordering = ["-id"]

    class Admin:
        pass

I added new attributes: title, date_created, and tags. The __str__ method is used to identify a Post instance by its title. This is useful when working in the Administration page. The class Meta: is used to reverse sort the Posts by "id".

Correction 7/6/2008: For the Post's body field, I previously used the line: body = models.CharField(maxlength=999999). However, thanks to Myles's comment below, I've changed this to use the more appropriate TextField.


python manage.py syncdb

Whoops, running python manage.py syncdb doesn't actually sync the model with the database. It is only used to initially create the database tables. To add the new columns to my table, I would have to enter the SQL commands directly. Though it is not super difficult, and would be good experience since all those hiring managers seem to want SQL experience, I took the lazy route and just replaced my database. (Not like I had much in there anyways.) For your reference, the section Making Changes to a Database Schema in Chapter 5 of The Django Book describes how to solve my problem without replacing my database.

$ cd ~/src/django/myblogsite
$ rm mydatabase.sqlite3 
$ python manage.py syncdb 
Creating table auth_message
Creating table auth_group
Creating table auth_user
Creating table auth_permission
Creating table django_content_type
Creating table django_session
Creating table django_site
Creating table django_admin_log
Creating table myblogapp_post

You just installed Django's auth system, which means you don't have any superusers defined.
Would you like to create one now? (yes/no): yes
Username (Leave blank to use sofeng'): sofeng
E-mail address: [email protected]
Password: 
Password (again): 
Superuser created successfully.
Installing index for auth.Message model
Installing index for auth.Permission model
Installing index for admin.LogEntry model
Loading 'initial_data' fixtures...
No fixtures found.

Oh yeah, I forgot gotta recreate my superuser.


Modify views.py slightly

In versions 0.0.1 and 0.0.2 of my new blog, I passed a list of post bodies to my template. But actually, I could have just passed a list of the Post objects and accessed the body attribute of each post in the template. This saves a line of unecessary code, and provides accessiblity to all the attributes of the Post object. (I also factored out my blog version number from the base.html template.)

~/src/django/myblogsite/myblogapp/views.py:
from django.shortcuts import render_to_response
from myblogsite.myblogapp.models import Post

def frontpage(request):
    posts = Post.objects.all()
    return render_to_response('frontpage.html', 
                              {'post_list': posts,
                               'VERSION': '0.0.3'})
Correction 7/6/2008: I previously had from myblogapp.models import Post on the second line. This works, but is inconsistent with my urls.py below and can (and did for me) cause subtle errors in the future. I corrected the line to read: from myblogsite.myblogapp.models import Post.

Modify my frontpage.html template

This is pretty self-explanatory. I access the the Post object's attributes using the "." (dot).

~/src/django/myblogsite/templates/frontpage.html:
{% extends "base.html" %}

{% block main %}
  {% for post in post_list %}
    <h2>{{ post.title }}</h2>
    {{ post.body }}
    <hr>
    <div class="post_footer">Created: {{ post.date_created }} | Tags: {{ post.tags }}</div>
  {% endfor %}
{% endblock %}

A little CSS

In between the <style> tags in ~/src/django/myblogsite/templates/base.html:

.post_footer {
  font-family: Verdana, Arial, sans-serif;
  font-size:70%;
}
hr {
  border: 0;
  color: gray;
  background-color: gray;
  height: 1px;
}

Start development server and add a couple posts

I started the development server and added a couple of posts in the Admin site:

  • $ cd ~/src/django/myblogsite
    $ python manage.py runserver
  • I visited http://127.0.0.1:8000/admin, logged in, and added a couple posts.

Upload to Webfaction server

pushwebf is my alias for hg push --remotecmd /home/sofeng/bin/hg ssh://[email protected]/webapps/django/myblogsite

$ pushwebf
[email protected]'s password:
pushing to ssh://[email protected]/webapps/django/myblogsite
searching for changes
remote: adding changesets
remote: adding manifests
remote: adding file changes
remote: added 7 changesets with 20 changes to 10 files

Deploy
Logged into Webfaction:
$ cd ~/webapps/django/myblogsite
$ hg update -C
9 files updated, 0 files merged, 4 files removed, 0 files unresolved
$ ~/webapps/django/apache2/bin/restart

Here is a snapshot screenshot of version 0.0.3

The live site can be viewed at http://saltycrane.com/blog/



Related posts:
  Django Blog Project #1: Creating a basic blog
  Django Blog Project #2: Deploying at Webfaction
  Django Blog Project #3: Using CSS and Template Inheritance
  Django Blog Project #5: YUI CSS and serving static media

Django Blog project #3: Using CSS and Template Inheritance

Version 0.0.1 of my new blog had no style. For 0.0.2, I added a little CSS to my Django template to make it look a little better.

Create new Django templates

I created two new Django templates, base.html and frontpage.html. base.html contains all the HTML and CSS that is common to all the web pages that will be on this site. frontpage.html is the template for the front page of my new blog. It uses the object-oriented technique of extending my base.html template. It uses the boilerplate code in base.html and then fills in sections with content specific to the front page. It is similar to server side includes, but more powerful because specific content can be inserted anywhere instead of just at the beginning or end. Django does have an include mechanism which acts like server side includes, but the extension method (also called Template Inheritance) is the preferred way of doing things.


Here is the code for frontpage.html:
{% extends "base.html" %}

{% block main %}
  {% for post in post_list %}
    {{ post }}
    <hr />
  {% endfor %}

{% endblock %}
Here is the code for base.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
body {
 margin: 0;
 padding: 0;
 font-family: Georgia, Times, "Times New Roman", serif;
 color: black;
 width: 600px;
 border-right: 1px solid black;
}
#header {
 background-color: #666;
 border-bottom: 1px solid #333;
}
#sidebarLeft {
 float: left;
 width: 160px;
 margin-left: 10px;
 padding-top: 1em;
}
#mainRight {
 padding-top: 1em;
 margin: 0 2em 0 200px;
}
#footer {
 clear: both;
 background-color: #ccc;
 padding-bottom: 1em;
 border-top: 1px solid #333;
 padding-left: 200px;
}
h2.sidebar {
  font-size: 120%;
}
</style>
<title>{% block title %}Sofeng's Blog Version 0.0.2{% endblock %}</title>
</head>
<body>

<div id="header">
  <h1>Sofeng's Blog Version 0.0.2</h1>
</div>
<div id="sidebarLeft">
  {% block sidebar %}
  <h2 class="sidebar">ABOUT</h2>
  <p>This is my new blog created using <a href="http://www.djangoproject.com">Django</a>,
    a <a href="http://www.python.org">Python</a> web framework. This site is under 
    construction. My current blog is located at: 
    <a href="http://iwiwdsmi.blogspot.com">http://iwiwdsmi.blogspot.com</a>.
  </p>
  {% endblock %}
</div>
<div id="mainRight">
  {% block main %}{% endblock %}
</div>
<div id="footer">
  A <a href="http://www.djangoproject.com/">Django</a> site.
</div> 

</body>
</html>

Modify view to use new template

To use the new template, I created a new view called frontpage in ~/src/django/myblogsite/myblogapp/views.py:

from django.shortcuts import render_to_response
from myblogsite.myblogapp.models import Post

def frontpage(request):
    posts = Post.objects.all()
    post_body_list = [post.body for post in posts]
    return render_to_response('frontpage.html', 
                              {'post_list': post_body_list})
Correction 7/6/2008: I previously had from myblogapp.models import Post on the second line. This works, but is inconsistent with my urls.py below and can (and did for me) cause subtle errors in the future. I corrected the line to read: from myblogsite.myblogapp.models import Post.

Map an URL to the new view

To complete the change, I mapped the url /blog to the new frontpage view in ~/src/django/myblogsite/urls.py:

from django.conf.urls.defaults import *
from myblogsite.myblogapp.views import *

urlpatterns = patterns(
    '',
    (r'^admin/', include('django.contrib.admin.urls')),
    (r'^myview1/$', myview1),
    (r'^blog/$', frontpage),
)

Upload project to Webfaction server

I updated my previous post to include a section on installing Mercurial. Here are my steps for pushing my changes to the server. It's a little more complicated than it should be because I was mucking with the repository, but future pushes should be much easier.

$ hg pull -u --remotecmd /home/sofeng/bin/hg ssh://[email protected]/webapps/django/myblogsite
[email protected]'s password:
pulling from ssh://[email protected]/webapps/django/myblogsite
searching for changes
adding changesets
adding manifests
adding file changes
added 5 changesets with 4 changes to 5 files (+1 heads)
not updating, since new heads added
(run 'hg heads' to see heads, 'hg merge' to merge)
$ hg merge
 local changed templates/base.html which remote deleted
use (c)hanged version or (d)elete? c
3 files updated, 0 files merged, 3 files removed, 0 files unresolved
(branch merge, don't forget to commit)
$ hg commit -m 'commit after merge'
$ hg push --remotecmd /home/sofeng/bin/hg ssh://[email protected]/webapps/django/myblogsite
[email protected]'s password:
pushing to ssh://[email protected]/webapps/django/myblogsite
searching for changes
remote: adding changesets
remote: adding manifests
remote: adding file changes
remote: added 3 changesets with 5 changes to 6 files

Deploy

With my cleanup of the mercurial repository, I didn't have to make any file changes. I just updated the working directory of my project using hg update -C and restarted the Apache web server.

$ cd ~/webapps/django/myblogsite
$ hg update -C
5 files updated, 0 files merged, 0 files removed, 0 files unresolved
$ ~/webapps/django/apache2/bin/restart

Now, pointing my browser at http://saltycrane.com/blog/, shows new version 0.0.2 of my blog!

Here is a snapshot screenshot of my blog version 0.0.2:


Related posts:
  Django Blog Project #1: Creating a basic blog
  Django Blog Project #2: Deploying at Webfaction
  Django Blog Project #4: Adding post metadata
  Django Blog Project #5: YUI CSS and serving static media

Mount drives manually on Ubuntu Linux

Since I'm running the wmii window manager instead of Gnome or KDE, devices such as USB drives, external hard drives, and SD card readers don't automatically mount. This can be good or bad depending on your preference. Here are my notes on mounting devices manually. I am no expert at this stuff, so use this at your own risk. There is definitely the possibility of losing data when dealing with this stuff. Read the man pages and use this just as a refresher. As an example, I will mount a SD card.


To see what devices are available:
$ sudo fdisk -l
This gives me the following output:
Disk /dev/sda: 250.0 GB, 250000000000 bytes
255 heads, 63 sectors/track, 30394 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes
Disk identifier: 0x38000000

   Device Boot      Start         End      Blocks   Id  System
/dev/sda1               1           7       56196   de  Dell Utility
/dev/sda2               8         660     5245222+   b  W95 FAT32
/dev/sda3   *         661       30017   235810102+  83  Linux
/dev/sda4           30018       30394     3028252+   5  Extended
/dev/sda5           30018       30394     3028221   82  Linux swap / Solaris

Disk /dev/sdf: 320.0 GB, 320072933376 bytes
255 heads, 63 sectors/track, 38913 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes
Disk identifier: 0x0008bc3c

   Device Boot      Start         End      Blocks   Id  System
/dev/sdf1               1       38913   312568641   83  Linux

Disk /dev/sdd: 512 MB, 512229376 bytes
9 heads, 8 sectors/track, 13895 cylinders
Units = cylinders of 72 * 512 = 36864 bytes
Disk identifier: 0x00000000

   Device Boot      Start         End      Blocks   Id  System
/dev/sdd1               4       13896      500107+   6  FAT16
/dev/sda3 is my main hard disk partition and /dev/sdf1 is an external hard drive formatted for Linux. The last device, /dev/sdd1 is my SD card.

Create a mount point
$ sudo mkdir /media/sdcard

Mount the device
$ sudo mount /dev/sdd1 /media/sdcard
Now you can access the files at /media/sdcard.

List mounted devices
$ mount -l
You should see things such as:
/dev/sda3 on / type ext3 (rw,errors=remount-ro) []
proc on /proc type proc (rw,noexec,nosuid,nodev)
/sys on /sys type sysfs (rw,noexec,nosuid,nodev)
udev on /dev type tmpfs (rw,mode=0755)
/dev/sdf1 on /media/disk type ext3 (rw,nosuid,nodev,uhelper=hal) []
tmpfs on /lib/modules/2.6.24-18-generic/volatile type tmpfs (rw,mode=0755)
/dev/sdd1 on /media/sdcard type vfat (rw) []
The last line shows device /dev/sdd1 mounted at /media/sdcard.

Unmount the device
$ sudo umount /media/sdcard
or
$ sudo umount /dev/sdd1

Django Blog Project #2: Django Webfaction deployment

I mentioned in my previous Django post that I'd write about hosting my new Django blog site on Webfaction. As promised, here it is.

I had some problems deploying my first site at Webfaction. First I got an error about pysqlite. I tried using Postgresql, and then I got an error about something else when trying to do a python2.5 manage.py syncdb. I think that they didn't set me up with a current Django installation. Luckily the support was prompt and helpful. I ended up reinstalling the Django application from the Webfaction Control Panel. Here are the steps I took to deploy my less than fledgling site.


Sign up for a shared hosting plan at Webfaction

I signed up for Webfaction's lowest plan at $9.50/month with no commitment. Here is their pricing plans.


Play with new account

I got a welcome email within 24 hours with the details about my account. sofeng.webfactional.com was a domain name which they provided. Visiting this address in my browser showed my the It worked! Django new project page. I also ssh'd into my shell account by using ssh sofeng.webfactional.com. The OS is CentOS5 which, I think, is based on Red Hat. It was a little different than the Ubuntu that I'm used to. I copied some of my configuration files over to make me feel more at home. On my home machine:

$ scp .bashrc [email protected]:
$ scp .screenrc [email protected]:
$ scp .emacs [email protected]:


Reinstall Django

Note, if your Webfaction account is set up properly with Django, you shouldn't need to take these steps. Like I mentioned earlier, I had some problems with my Django installation. So I ended up reinstalling Django. It's not as hard as it sounds-- just a few clicks in the Control Panel.

  1. In my browser, I went to the Webfaction Control Panel at https://panel.webfaction.com/.
  2. Under "> Domains / websites", I selected "Applications".
  3. I removed my current Django installation by clicking the icon with the minus sign.
  4. I clicked the icon with the plus sign to add a new application.
  5. I filled in the following information:
    "Name:": django
    "App type:": Django 0.96.2/mod_python 3.3.1/Python 2.5
    Then I clicked the "Create" button.
  6. Finally, I needed to specify which URL path I want to use with my Django application.
    Under "> Domains / websites", I selected "Websites".
  7. I selected the icon with the pencil to edit the website settings.
  8. In the "Site apps:" section, I selected the icon with the plus sign to add a new App and path. I selected "django" as my "App:" and entered "/" (without the quotes) in the "URL path" field. Then I clicked "Update".
  9. After a couple minutes, I was able to view the Django It worked! page at http://sofeng.webfactional.com.

Upload my project

  1. The welcome message recommends using sftp, but I used rsync instead because I'm more familiar with it:
    sofeng@home:~ $ rsync -avz ~/src/django/myblogsite [email protected]:webapps/django

Deploy
  1. I ssh'd into my webfaction shell account:
    sofeng@home:~ $ ssh [email protected]
  2. I set the PYTHONPATH. (I actually put this in my .bash_profile)
    sofeng@web36:~ $ export PYTHONPATH=$HOME/webapps/django
  3. sofeng@web36:~ $ cd ~/webapps/django/myblogsite
  4. I tried to do a python2.5 manage.py syncdb, but got a database error:
    Traceback (most recent call last):
      File "manage.py", line 11, in 
        execute_manager(settings)
      File "/home/sofeng/webapps/django/lib/python2.5/django/core/management.py", line 1672, in execute_manager
        execute_from_command_line(action_mapping, argv)
      File "/home/sofeng/webapps/django/lib/python2.5/django/core/management.py", line 1571, in execute_from_command_line
        action_mapping[action](int(options.verbosity), options.interactive)
      File "/home/sofeng/webapps/django/lib/python2.5/django/core/management.py", line 504, in syncdb
        cursor = connection.cursor()
      File "/home/sofeng/webapps/django/lib/python2.5/django/db/backends/sqlite3/base.py", line 58, in cursor
        self.connection = Database.connect(**kwargs)
    sqlite3.OperationalError: unable to open database file
  5. I needed to edit my settings.py file. I changed the following lines:
    DATABASE_NAME = '/home/sofeng/webapps/django/myblogsite/mydatabase.sqlite3'
    TEMPLATE_DIRS = (
        '/home/sofeng/webapps/django/myblogsite/templates',
    )
  6. I tried python2.5 manage.py syncdb again:
    $ python2.5 manage.py syncdb
    Loading 'initial_data' fixtures...
    No fixtures found.
    It worked.
  7. The next step was to set up the Apache configuration.
    $ cd ~/webapps/django/apache2/conf
  8. I edited the following line in httpd.conf:
        SetEnv DJANGO_SETTINGS_MODULE myblogsite.settings
  9. Then I restarted the Apache server:
    $ ~/webapps/django/apache2/bin/restart
  10. In my browser, I went to http://sofeng.webfactional.com/myview1, but got an error:
    ImportError at /myview1/
    No module named blog.models
    Request Method:  GET
    Request URL:  http://sofeng.webfactional.com/myview1/
    Exception Type:  ImportError
    Exception Value:  No module named blog.models
    Exception Location:  /home/sofeng/webapps/django/lib/python2.5/django/core/urlresolvers.py in _get_urlconf_module, line 177
  11. I guess I need my project on the Python path. I edited the following line in httpd.conf:
        PythonPath "['/home/sofeng/webapps/django/myblogsite', '/home/sofeng/webapps/django', '/home/sofeng/webapps/django/lib/python2.5'] + sys.path"
  12. Then I went back to http://sofeng.webfactional.com/myview1 and saw my page. Success!

Install Mercurial

Update 6/7/2008: By default Webfaction doesn't come with Mercurial installed, but they do allow you to do a user installation. I decided it would be useful to have Mercurial so I could pull and merge changes with greater control. Here are my steps.This will do a user-wide (as opposed to system-wide) installation of Mercurial in ~/bin and ~/lib.

  1. sofeng@home:~/incoming $ wget http://www.selenic.com/mercurial/release/mercurial-1.0.1.tar.gz
  2. sofeng@home:~/incoming $ scp mercurial-1.0.1.tar.gz [email protected]:
  3. sofeng@web36:~ $ mv mercurial-1.0.1.tar.gz ~/tmp
  4. $ cd tmp
  5. $ tar zxvf mercurial-1.0.1.tar.gz
  6. $ cd mercurial-1.0.1
  7. $ make install-home
  8. $ export PYTHONPATH=$HOME/lib/python:$PYTHONPATH
    Note: you will need to put this in your .bashrc instead of your .bash_profile because Mercurial only executes .bashrc on a remote hg push by default.
  9. $ hg version
    Mercurial Distributed SCM (version 1.0.1)
    
    Copyright (C) 2005-2008 Matt Mackall  and others
    This is free software; see the source for copying conditions. There is NO
    warranty; not even for MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.

Other Errors
  • No module name django.core.management
    $ python manage.py syncdb
    Traceback (most recent call last):
      File "manage.py", line 2, in ?
        from django.core.management import execute_manager
    ImportError: No module named django.core.management
    You need to set the PYTHONPATH:
    $ export PYTHONPATH=$HOME/webapps/django
    You may get this if you use python manage.py syncdb instead of python2.5 manage.py syncdb.

Related posts:
  Django Blog Project #1: Creating a basic blog
  Django Blog Project #3: Using CSS and Template Inheritance
  Django Blog Project #4: Adding post metadata
  Django Blog Project #5: YUI CSS and serving static media

Django Blog Project #1: Creating a basic blog

It's been a while since my last post on Django. I became very busy but also found the Django tutorial to be somewhat dryand also somewhat lazy*. Luckily, the official Django Book was published during this time and it is more interesting to read. This post will be a very brief summary of the first 6 chapters of the Django Book as I apply it towards the creation of a new blog website. I highly recommend reading the book (I forgot to mention it is available free online). Then after reading the first six chapters, I hope this post can serve as kind of a refresher on how to put everything together.

As I mentioned, I decided to create my own blog site as my first Django project. I know it is not the most original idea in the world, but I thought it would be useful and a good learning experience. The following steps are my first cut at my new blog (dubbed 0.0.1) and basically just document the basic concepts of Django without providing much actual functionality.

I develop a model, a template, and a view in accordance with Django's MTV (see also MVC) development pattern. The model is of a blog post (aptly named Post) and contains only one attribute, the post body data (i.e. the actual text of the post). I should add in other data such as the title, date, tags, etc. But in order to keep things simple this first time around, it just has the post body. The model is connected to a SQLite database and is updated using Django's excellent admin interface. Finally, the model data is combined with a very basic template which just displays a title (My New Blog Version 0.0.1), and all the blog post bodies separated by a <hr>. Like I said, it's not very useful at this point, but I think I understand the basic concepts and how to put everything together much better now. The next step in my Django development will be to create some more interesting templates and views and add more useful data like titles and dates.

I also have a couple of related plans:

  • Set up hosting: I've decided to use WebFaction for my hosting but I need to set up and upload my new, almost-website there. This will probably be the subject of my next Django post.
  • Copy my Blogger posts over to my new site. I've already figured out how to use Beautiful Soup to screen scrape my Blogger posts and import them into SQLite. Likely I will do this further on in the process.

Here are the steps I took for my first cut at my new blog. Note, I'm running on Ubuntu so that's why I have the $ bash prompt and use /home/sofeng paths in my examples.

*Update 2008-10-09: I realize my assessment of the tutorial might have sounded critical-- in actuality, since I was job searching at the time, I was just trying to avoid sounding lazy. For the record, I find the Django documentation to be excellent and one of the highlights of the project.

Create a new project

The first thing to do after installing Django is to create a new project. Luckily, it takes just one command to create the project.

  1. Create a new project
    $ cd ~/src/django
    $ django-admin.py startproject myblogsite
  2. Take a look at the site using the development server
    $ python manage.py runserver
    Then go to http://127.0.0.1:8000

At first I thought the admin interface was kind of boring. However, for my blog site, I will use the admin interface to enter new blog posts.

  1. Edit myblogsite/settings.py to add the admin application to the list of installed apps:
    INSTALLED_APPS = (
       'django.contrib.auth',
       'django.contrib.contenttypes',
       'django.contrib.sessions',
       'django.contrib.sites',
       'django.contrib.admin',
    )
  2. Install database tables for the admin interface:
    $ python manage.py syncdb
    At this point I was asked to create a superuser to log into the admin interface. I answered "yes" and filled in the appropriate information.
    Creating table auth_message
    Creating table auth_group
    Creating table auth_user
    Creating table auth_permission
    Creating table django_content_type
    Creating table django_session
    Creating table django_site
    Creating table django_admin_log
    
    You just installed Django's auth system, which means you don't have any superusers defined.
    Would you like to create one now? (yes/no): yes
    Username (Leave blank to use 'sofeng'): sofeng
    E-mail address: [email protected]
    Password:
    Password (again):
    Superuser created successfully.
    Installing index for auth.Message model
    Installing index for auth.Permission model
    Installing index for admin.LogEntry model
    Loading 'initial_data' fixtures...
    No fixtures found.
  3. Edit myblogsite/urls.py to include the admin url.
    from django.conf.urls.defaults import *
    
    urlpatterns = patterns('',
       (r'^admin/', include('django.contrib.admin.urls')),
    )
  4. Run the development server:
    $ python manage.py runserver
    Then go to http://127.0.0.1:8000/admin Log in and take a look around.
Set up the SQLite3 database

I chose SQLite because it is a lightweight, simple alternative to MySQL or PostgreSQL. This makes it great for a development website.

  1. Edit the following section in the myblogsite/settings.py file:
    DATABASE_ENGINE = 'sqlite3'
    DATABASE_NAME = '/home/sofeng/src/django/myblogsite/mydatabase.sqlite3'
    The rest of the DATABASE_ variables are not used with SQLite.
  2. Test out the database configuration: Run the shell:
    $ python manage.py shell
    Then type these commands:
    >>> from django.db import connection
    >>> cursor = connection.cursor()
    If nothing happens, all is good. See Table 5-2 in Chapter 5 of the Django Book common database configuration error messages.
Create an App

I think of an "app" as a piece of specific functionality of a website, whereas a project corresponds to a particular website. There can be many apps in a project. Also, apps can be used in more than one project. For more information about the differences between projects and apps see Chapter 5 of the Django Book.

  1. Create an app
    $ cd ~/src/django/myblogsite
    $ python manage.py startapp myblogapp
Create a Model

I created one model, the Post model. A model roughly corresponds to a SQL table. And each attribute in that model corresponds to a table row. I added the class Admin: so that my Post model would show up in the Admin interface (where I can insert the data).

  1. Edit myblogsite/myblogapp/models.py to look like the following:
    from django.db import models
    
    class Post(models.Model):
       body = models.TextField()
    
       # in the future I will add these other attributes
    #    title = models.CharField(maxlength=500)
    #    timestamp = models.CharField(maxlength=50)
    #    tags = models.CharField(maxlength=200)
    
       class Admin:
           pass
    Correction 7/6/2008: For the Post's body field, I previously used the line: body = models.CharField(maxlength=999999). However, thanks to Myles's comment in my post #4, I've changed this to use the more appropriate TextField.
Install the Model

After writing the Python model code, I needed to create the actual tables in the SQLite database. The following steps include a couple of checks, then I create the tables in the last step.

  1. Edit myblogsite/settings.py file again and add the blog app to the list of installed apps:
    INSTALLED_APPS = (
       'django.contrib.auth',
       'django.contrib.contenttypes',
       'django.contrib.sessions',
       'django.contrib.sites',
       'myblogsite.myblogapp',
    )
  2. Try validating the model:
    $ python manage.py validate
    Which gives the following message:
    0 errors found.
  3. Check the CREATE TABLE statements that Django will generate. Note, the database won't be modified.
    $ python manage.py sqlall myblogapp
    Which yields the following:
    BEGIN;
    CREATE TABLE "myblogapp_post" (
       "id" integer NOT NULL PRIMARY KEY,
       "body" text NOT NULL
    );
    COMMIT;
    Correction 7/6/2008: I've updated the results here to reflect the correction I made to the model above.
  4. Now, actually create the tables in SQLite:
    $ python manage.py syncdb
    Which yields something like this:
    Creating table blog_post
    Loading 'initial_data' fixtures...
    No fixtures found.
Create some new data using the admin interface

Now that I created the models and tied them to the admin interface, I can start adding data using the admin interface.

  1. Start the development server again:
    $ python manage.py runserver
    Go to http://127.0.0.1:8000/admin and log in.
  2. Under the "Blog" heading, click "Posts", then add some new posts using "Add post" and the "Save" links. This will add data to the SQLite database.
Create a template

Now I will display the data I just created using a template and a view. The template holds all the HTML code and some simple Django template code which the view's Python code uses to customize the page.

  1. Create the file myblogsite/templates/mytemplate.html and put the following inside:
    <html>
     <head><title>Post</title></head>
     <body>
       <h1>My New Blog Version 0.0.1</h1>
    
       {% for post in post_list %}
       {{ post }}
       <hr />
       {% endfor %}
    
     </body>
    </html>
  2. Edit myblogsite/settings.py again to instruct Django where to find the template files.
    TEMPLATE_DIRS = (
       '/home/sofeng/src/django/myblogsite/templates',
    )
    Be sure to include the comma at the end.
Create a view

The view is where I will grab the data from my model and insert it into my template.

  1. Create a new file myblogsite/myblogapp/views.py and put the following inside:
    from django.shortcuts import render_to_response
    from myblogsite.myblogapp.models import Post
    
    def myview(request):
       posts = Post.objects.all()
       post_body_list = [post.body for post in posts]
       return render_to_response('mytemplate.html',
                                 {'post_list': post_body_list})
    Correction 7/6/2008: I previously had from myblogapp.models import Post on the second line. This works, but is inconsistent with my urls.py below and can (and did for me) cause subtle errors in the future. I corrected the line to read: from myblogsite.myblogapp.models import Post.
Map an URL to the new view

Finally, I map an URL to my newly created view.

  1. Edit myblogsite/urls.py so that it looks like:
    from django.conf.urls.defaults import *
    from myblogsite.myblogapp.views import myview
    
    urlpatterns = patterns('',
       (r'^admin/', include('django.contrib.admin.urls')),
       (r'^myview/$', myview),
    )
  2. Take a look at the new page: Run the server:
    $ python manage.py runserver
    Then go to http://127.0.0.1:8000/myview Visiting the url shows all the posts I entered through the admin interface. Nice. Here is a snapshot screenshot of my new blog:

That's it for now. I tried to map out the basic steps for using Django's MTV development pattern. Hopefully, in the future, I'll be able to add more useful features to my new Django-powered blog.


Related posts:
  Install Django on Ubuntu
  Django Blog Project #2: Deploying at Webfaction
  Django Blog Project #3: Using CSS and Template Inheritance
  Django Blog Project #4: Adding post metadata
  Django Blog Project #5: YUI CSS and serving static media
  Django Blog Project #6: Creating standard blog views
  Django Blog Project #7: Adding a simple Atom feed
  Django Blog Project #8: Adding basic comment functionality

How to paste in Cygwin bash using CTRL-V

I come from a Windows background where Cut/Copy/Paste are almost always CTRL+X/C/V respectively. I like this consistency, so adjusting to Cygwin's (or other *nix environments') use of SHIFT+INSERT or the middle mouse button for pasting in terminals is a little annoying. After a bit of googling, I found a mailing list thread that solved my problem.

This method uses a modification to readline's ~/.inputrc configuration file, so it should work in rxvt, xterm, or even the default cmd.exe shell. Here is what to do:

Add the following line to your ~/.bashrc:
stty lnext ^q stop undef start undef
And add the following line to your ~/.inputrc:
"\C-v": paste-from-clipboard

These modifications will unmap stty's lnext (literal next-character) and readline's quoted-insert settings which are normally mapped to CTRL-V. For more details, see this cygwin mailing list thread.

Note, this appears to be a Cygwin-specific solution. Linux users could use custom key bindings in gnome-terminal or konsole, or translation tables with xterm.


Useful commands for reference:
$ bind -p
$ stty -a