Skip navigation

Tag Archives: web development

Django Quickstart

(You’ll find lots of this online. I’m just putting this up here for my personal reference.)

Hi there. I’m writing this with a Linux/Unix/OS X environment in mind. Basically, any OS that has a pretty powerful terminal. Don’t know how this goes for Windows…Cygwin maybe?

First off, make a virtualenv to work on and install Django. You need virtualenv and virtualenvwrapper. If you do not have them installed yet, do not despair. You can use virtualenv-burrito (and I do recommend that you use virtualenv-burrito). The readme of the GitHub repo linked is pretty self-explanatory so I won’t dwell much on that. I’ll just say that…

…if, after following the instructions for virtualenv-burrito, you still can’t invoke virtualenv commands, you might have to do

$ source /home/username/.venvburrito/startup.sh

Or, better yet, just put that line in your .bashrc file (or equivalent).

And also, if you are a Python 3.x fan, Django does not work yet with Python 3.x .

So, make and work on a virtualenv by

$ mkvirtualenv env_name
$ workon env_name

While inside a virtualenv, install Django (note that, being in a virtualenv, you need to be in a virtualenv to use Django):

(env_name)$ pip install Django

Create new projects by invoking

(env_name)$ django_admin.py startproject project_name

This will create a directory named project_name . This directory has some Django-related files. Go to this directory. Start the server by

(env_name)$ python manage.py runserver

And your set to create your web apps!

I’ve heard of Django long ago but what really got me started with it is PyCon Philippines. Here are Daniel Greenfeld’s notes on the PyconPH Django talk by Marconi Moreto, which was my primary reference in setting up my Django installation. However, I had a few deviations and personal discoveries, hence this blog post.

Magically Fix Webpage Layout in IE

Ok. Not really magic and I bet other people got this figured out and it’s just me because I’m not following standards. Anyway…

My portfolio website was the first time I ever did table-less layout. So, it was also the first time I discovered what a pain in the ass IE is when it comes to CSS handling. See for yourself.

This is how the home page looks with Chrome and, with some minor differences, in Firefox:

kode.skytreader.net in Google Chrome

My portfolio website rendered in Google Chrome.

Exactly how I intended it.

Now take a look at what happens when you give it to IE 9, which, as of this writing, is supposed to be the best stable build of IE.

kode.skytreader.net in IE9

My insides repulsively retch at this FrankenstIEn (sic) of a page.

I wasted spent countless hours experimenting with CSS so that IE may render it well. But, as you may have surmised looking at that screen shot, I ended up with my arms raised in frustrated surrender and just put up that message (which, yes, only appears for IE users) suggesting that they download either Chrome of Firefox.

It looked like that for a long time until I discovered−wait for it, drum roll please−doctypes and quirks mode.

Doctypes are, to oversimplify, comments at the beginning of HTML documents. It is like the hashbang line they always tell you to put at the beginning of your shell/Perl/Python scripts. They don’t really affect your code though they tell the executing environment (in this case, the browser) additional info about your code.

So, I put the following doctype declaration in my pages

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

And behold how IE renders my portfolio homepage (another drum roll please):

kode.skytreader.net in IE9, post DOCTYPE

TADAAA!!!!

Despite that it now renders as expected in IE, I chose to keep that little banner/taunt because really, world, we shouldn’t be using a browser that is as standards compliant as any 1990’s browser in the year 2012.

And I know that this isn’t the magic panacea of this wretched IllnEss. I’m sure it isn’t difficult to make IE break when your using CSS layers and positions even with quirks mode. But for sites with simple layouts, this one is definitely my life saver.