Advertisement

Python from Scratch - Create a Dynamic Website

by

We’ve covered quite a bit of Python in the previous tutorials in this Session. Today, we’re going to combine everything we’ve learned so far to build a dynamic website with Python.


Prefer a Video Tutorial?

So, how do you get started creating websites with Python? Well, you could do it all yourself, and write a program that runs on a web server, accepting page requests and serving up responses in the form of HTML and other resources. However, that’s a lot of work, so why go to all the trouble when there are plenty of existing tools out there to do the job for you? These tools are called frameworks, and they're what we’ll use today to create our website.

Python Frameworks

There are quite a few Python web frameworks, but here are some of the best:

  • Django - We're going to use this today. It has a huge set of features, but remains simple to use. The documentation is also excellent, so if you get stuck, you'll have the easiest time solving your problem with Django.
  • Grok - Another framework with a feature set that comes close to Django. If you decide you don't prefer Django, this is a good alternative.
  • WebPy - A much more lightweight framework. It doesn't have as many features, though it did power Reddit for a period of time!
  • TurboGears - Though previously having a reputation for poor documentation, TurboGears has improved substantially in the last year.

A more comprehensive list can be found on the Python website if you're in need of additional options. Today we’re going to set Django up for development on a local machine, and then build a simple blog. We're also going to review the process of installing it on a remote web server.


Installing Django

We'll be performing most of our work today in the Terminal. This should all work on Mac and Linux; however, if you're running Windows, the process is somewhat different. A familiarity with the command line isn't necessary if you're only writing Python, though, if you're planning on using Django, or running a dynamic website in general, it's worth learning.

Terminal Tutorials

Consider reviewing these tutorials to get yourself up and running with the Terminal.

Here are the commands you need to install Django. It's not compatible with Python 3, so you'll need to install version 2.7 or earlier to get it running.

    wget http://www.djangoproject.com/download/1.3.1/tarball/
    tar xzvf Django-1.3.1.tar.gz
    cd Django-1.3.1
    python setup.py install

Next, we can optionally remove the install files.

    cd ..
    rm Django-1.3.1.tar.gz

That should do it! Let's test it out.

    python
    from django import get_version
    get_version()

You should see '1.3.1'. If you do, everything worked and Django is installed on your system. Congratulations! We're ready to begin creating our site!


Building our Blog

We're going to build a blog system today, because it's an excellent way to learn the basics. First, we need to create a Django project.

cd ~/Documents/Projects
django-admin.py startproject FirstBlog
cd FirstBlog
ls

What do each of these files do?

  • __init__.py tells Python that this folder is a Python package. We learned about these in the third lesson; it allows Python to import all of the scripts in the folder as modules.
  • manage.py isn’t actually part of your website; it’s a utility script that you run from the command line. It contains an array of functions for managing your site.
  • settings.py contains your website's settings. Django doesn’t use XML files for configuration; everything is Python. This file is simply a number of variables that define the setting for your site.
  • urls.py is the file that maps URLs to pages. For example, it could map yourwebsite.com/about to an About Us page.

Django refers to itself an MTV framework, which stands for Model Template View.

Apps

However none of these files on their own make a functional website. For that, we need Apps. Apps are where you write the code that makes your website function, but before we take a look at them, we need to understand a bit about Django’s design principles.

First, Django is an MVC framework, which stands for Model View Controller. Django refers to itself an MTV framework, which stands for Model Template View. It’s a slightly different approach than MVC, but fundamentally, they’re quite similar. Anyhow, MVC is an architectural pattern that provides a method for structuring your projects. It separates the code that’s used to process data from the code that manages the user interface.

Django subscribes to the DRY, or "Don’t Repeat Yourself" philosophy.

Secondly, Django subscribes to the DRY, or Don’t Repeat Yourself philosophy, which means that you should never be writing code that performs a certain task more than once. For example, in our blog, if we wrote a feature that picked a random article from the archive, and implemented this feature on multiple pages, we wouldn’t code it again each time it was needed. We’d code it once and then use it on each page.

So how does this relate to apps? Well, apps allow you to write your website in a DRY style. Each project, like the one we have here, can contain multiple apps. Conversely, each app can be part of multiple projects. Using the example from earlier, this means that if we made another site in the future that also needed a random page feature, we wouldn’t have to write it all over again. We could simply import the app from this project. Because of this, it’s important that each app serves one distinct purpose. If you write all the functionality of your site within one app, and then need to use part of it again later, you have to import it all. If you were making an eCommerce website, for example, you wouldn’t want to import all the blog features. However, if you make one app for the random feature and one app for the blog publishing system, you could pick and choose the bits that you require.

This also means that within the site, the code is well organized. If you want to alter a feature, you don’t have to search through one massive file; you can instead browse to the relevant app and change it without worrying about interfering with anything else.

python mangage.py startapp blog
cd blog
ls

Again, we’ve got an __init__.py file to make it a package, and three other files: models, tests and views. We don’t need to worry about tests for now, but the other two are important. Models and Views are the M and V parts of MVC.

In models, we define our data structures.

If you’ve ever worked with PHP before, you might have used PhpMyAdmin to create your MySQL tables, and then written out your SQL queries manually in your PHP scripts. In Django, it’s much easier. We define all the data structures we need in this models file, then run a command and all the necessary databases are made for us.

When you wish to access that data, you go via these models by calling method on them, instead of running raw queries. This is very helpful, because Django can use several database programs. We’re going to use MySQL today, because it’s the most powerful, and is what most hosts provide, but if we needed to switch to a different database in the future, all of the code will still be valid! In other languages, if you wanted to switch to SQLite or something similar, you would need to rewrite the code that accesses your database.

In the views file, we write the code that actually generates the web pages. This ties all the other parts together. When a user types in a URL, it is sent by the urls script we saw earlier to the views script, which then gets relevant data from the models, processes it and passes it into a template, which finally gets served up as the page the user sees. We’ll take a look at those templates shortly. They’re the easiest part - mostly HTML.

For a blog, we’ll need a table of posts, with several fields for the title, body text, author, the time it was written, and so on. A real blog would have comments, but that’s beyond the scope of today's demo.

from django.db import models

class posts(models.Model):
    author = models.CharField(max_length = 30)
    title = models.CharField(max_length = 100)
    bodytext = models.TextField()
    timestamp = models.DateTimeField()

MySQL

These models are just a description. We need to make an actual database from them. First, however, we need MySQL running on our system. On an actual web server, this wouldn’t be a problem, because they usually have it preinstalled. Luckily, with a package manager, it’s easy to install. First, you need to install Homebrew and Easy Install

brew install mysql
easy_install mysql-python

mysqld_safe --skip-grant-tables #let anyone have full permissions
mysql -u root
UPDATE mysql.user SET Password=PASSWORD('nettuts') WHERE User='root'; #give the user 'root' a password
FLUSH PRIVILEGES;

mysql -u root -p #log in with our password 'nettuts'
CREATE DATABASE firstblog;
quit

python2.6 manage.py runserver

When you reboot, MySQL won't be running, so every time you need to do this in the future, run mysqld to start the server. You can then run python2.6 manange.py runserver in a new tab to start the development server.

This command won't run the server yet, it will just return an error. That's because we need to configure our settings. Let's take a look at settings.py.

You need to change the database settings first. These begin on line twelve.

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql', # Add 'postgresql_psycopg2', 'postgresql', 'mysql', 'sqlite3' or 'oracle'.
        'NAME': 'firstblog',                      # Or path to database file if using sqlite3.
        'USER': 'root',                      # Not used with sqlite3.
        'PASSWORD': 'nettuts',                  # Not used with sqlite3.
        'HOST': '',                      # Set to empty string for localhost. Not used with sqlite3.
        'PORT': '',                      # Set to empty string for default. Not used with sqlite3.
    }
}

If you try to run the server again, it should work, provided that you successfully installed MySQL. If you visit 127.0.0.1:8000 in your web browser, you should see the default Django page.

Now let's turn our Django site into a blog. First, we need to use our Models to create tables in the database by running the following command:

python2.6 manage.py syncdb

Every time you change your models, you should run this command to update the database. Note that this can't alter existing fields; it may only add new ones. So if you want to remove fields, you'll have to do that manually with something like PhpMyAdmin. Because this is the first time we've run the command, Django will set up all the default built in tables for things like the administration system. Just type 'yes' and then fill in your details.

Now let's set up the urls.py file. Uncomment the first line in the examples section, and change it to say url(r'^$', 'FirstBlog.blog.views.home', name='home') .

Now, let's create the views file to respond to these requests.

from django.shortcuts import render_to_response

from blog.models import posts

def home(request):
    return render_to_response('index.html')

Templates

This index.html file doesn't exist yet, so let's make it. Create a folder, called templates in the blog app and save a file in it called index.html, which can simply contain "Hello World" for now. Then, we need to edit the settings file so Django knows where this template is located.

Line 105 is where the section for declaring template folders starts; so adjust it, like so:

TEMPLATE_DIRS = (
    "blog/templates",
    # Put strings here, like "/home/html/django_templates" or "C:/www/django/templates".
    # Always use forward slashes, even on Windows.
    # Don't forget to use absolute paths, not relative paths.
)

If you run the server again and refresh the page in your browser, you should see the "Hello World" message. We can now begin laying out our blog. We'll add some boilerplate HTML for the home page.

<!DOCTYPE html>

<html lang="en">

<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="css/style.css">
    <link href="images/favicon.ico" rel="shortcut icon">
    <title>First Blog</title>
</head>

<body>

<div class="container">
    <h1>First Blog</h1>
    <h2>Title</h2>
    <h3>Posted on date by author</h3>
    <p>Body Text</p>

</div>

</body>
    
</html>

If you save and refresh the page, you should see that the page has been updated with this new content. The next step is to add dynamic content from the database. To accomplish this, Django has a templating language that allows you to embed variables with curly braces. Change the middle section of your page to look like this:

<div class="container">
    <h1>First Blog</h1>
    <h2>{{ title }}</h2>
    <h3>Posted on {{ date }} by {{ author }}</h3>
    <p>{{ body }}</p>

</div>

We can then pass in values to these variable placeholders from the views.py file by creating a dictionary of values.

from django.shortcuts import render_to_response

from blog.models import posts

def home(request):
    content = {
        'title' : 'My First Post',
        'author' : 'Giles',
        'date' : '18th September 2011',
        'body' : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam cursus tempus dui, ut vulputate nisl eleifend eget. Aenean justo felis, dapibus quis vulputate at, porta et dolor. Praesent enim libero, malesuada nec vestibulum vitae, fermentum nec ligula. Etiam eget convallis turpis. Donec non sem justo.',
    }
    return render_to_response('index.html', content)

Save and refresh, and you should see that you're now passing in content to a template from your views file. The final step is to get data from our database and pass that in instead. Luckily, we can do this all without SQL queries, using Django's models. We need to add our blog app to our FirstBlog project by changing another setting. Go to INSTALLED_APPS on line 112, and add the

'FirstBlog.blog',

to the list.

Then change views.py so it adds data from the database.

from django.shortcuts import render_to_response

from blog.models import posts

def home(request):
    entries = posts.objects.all()[:10]
    return render_to_response('index.html', {'posts' : entries})

Next, update the template to access this data.

<div class="container">
    <h1>First Blog</h1>
    <hr />
    {% for post in posts %}
        <div class="post">
        <h2>{{ post.title }}</h2>
        <h3>Posted on {{ post.timestamp }} by {{ post.author }}</h3>
        <p>{{ post.bodytext }}</p>
        </div>
        <hr />
    {% endfor %}
</div>

Here, we can access all the data in our table in the views.py file, then select only the first ten entries. We pass this data into the template, loop through the entries and display the data with the HTML of our site. This won't work just yet, because there's nothing in the database. Stop the server and run:

python2.6 manage.py syncdb

This will add the new table for our posts to the database. Then, open a new tab and type:

mysql -u root -p

...type your password, hit enter, and execute:

INSERT INTO blog_posts (author, title, bodytext) values ('Bob', 'Hello World', 'Lorem Ipsum');

Return to the previous tab and run the server again. Refresh the page and you should see a blog post with the dummy content you just added. If you run the MySQL command a few more times, you should see more posts appear on the page when you refresh.

Django's Admin System

The last thing we need to do today is review Django's administration system. This is a really powerful feature of Django that lets you manage your site without writing any more code, as you would have to if you were creating a site from scratch. To enable it, we need to change a few settings. First, uncomment lines 4, 5, 13 and 16 within urls.py, so that you can actually access the admin page. Next, go to the INSTALLED_APPS section of settings.py and uncomment 'django.contrib.admin', and 'django.contrib.admindocs',. To let the admin control your posts table, create a new file called admin.py in the blog folder, and add the following lines:

from django.contrib import admin
from blog.models import posts

admin.site.register(posts)

Run python2.6 manage.py syncdb again to add the tables for the admin section, and restart the server.

If you visit 127.0.0.1:8000/admin now in your browser, you should see a login page. Use the details you chose earlier when you first ran the syncdb command to log in. You should see a section, called Blog, with a subtitle for the posts table. You can use this to create, edit and remove blog posts with a simple interface.

That's all there is to do. You've just created a fully functioning, albeit simple, blog. To finish this lesson, we're going to look at installing Django on a web server.


Installing on a Web Server

There are two types of web hosting, and which one you have will affect whether you can use Django. If you have shared hosting, you're entirely at the mercy of your host.

Many cheap web hosts don’t support Python. While PHP is nearly guaranteed, support for other languages often isn’t. You'll have to check the control panel to determine if Python (and Django) are available. Obviously the process is slightly different with every host. Almost all hosting runs on Apache, and we can use it to host Django, using the mod_wsgi or mod_python Apache modules.

Most web hosts run scripts in several languages using CGI. Django can run on FastCGI, and also, theoretically, on CGI, but this is not officially supported and would be far too slow for an actual production website. You’ll need to check if these are installed. They’re usually found under a heading, like “CGI and Scripting Language Support”.

If you have VPS hosting, or are lucky enough to have a dedicated server, your life is much easier. Usually these come with Python preinstalled, and from there, you only need to follow the same steps we went through to get a local copy of Django running. If you don't have Python, you can install it with a package manager. Your system may even come with Django.

ssh root@example.com

wget http://www.djangoproject.com/download/1.3.1/tarball/
tar xzvf Django-1.3.1.tar.gz
cd Django-1.3.1
python setup.py install

Once you've installed Django on your server, upload the site you just made using any file transfer client. You can put the files anywhere, but keep them out of the public folder, or anyone will be able to see the source code of your site. I use /home for all my projects.

Next, create a MySQL database, called 'firstblog' on your server and run syncdb again. You'll have to create your account for the admin control panel again, but this is a one-time thing.

If you try and run this, you might receive an error, and that's because the settings for the server are different those on your local computer. You may need to change the database password within settings.py, but depending on your server configuration, you may also encounter other issues. Google is your friend in these situations!

To run the server this time, the command is slightly different. You have to specify an IP address and port so that you can access the site over the internet.

python manage.py runserver 0.0.0.0:8000

If you visit your site in a web browser, on port 8000, you should see your site!


Conclusion

That's it for this lesson...and our series. I hope you've learned a number of useful skills over these past five lessons, and that you're ready to go on and learn even more Python in the future. If you like the look of Django, and wish to continue increasing your knowledge of the framework, here's some additional tutorials on the subject.

As always, I’m happy to discuss any questions about this tutorial or Python in general within the comments. Thanks for reading.