Django for Designers/Sharing

From OpenHatch wiki

Part 6: Sharing with others

Now that you've built a web app, you might want to enable other people to see it.

With runserver

The first, easiest way to let other people see it is to let other people connect to your computer. (Note that this might not work if your computer has a firewall enabled.)

It also won't work on the conference network due to an aggressive firewall.


Deployment on Heroku

This method of running the code requires that you use your laptop like a server, and keep it running all the time. This isn't how you want to generally share your work with the world.

A more common way to deploy Django code is to copy your code to a hosting service and ask them to run it for you. In this tutorial, we'll do that with Heroku.

Note that when you access a remotely-hosted version of your code, it will typically use a separate database. Any information you store there won't be reflected in the code you run on your own computer.

Make sure you have a Heroku account. Visit https://api.heroku.com/signup and either sign up or login.

Make sure you have the Heroku toolbelt installed on your own computer. You can test if you have them by running, within a terminal or command prompt:

# in django-for-designers/myproject
$ heroku

If you get a command not found error, visit https://toolbelt.heroku.com/ and install their toolbelt. You may need to quit and re-launch your terminal program for the program to become available.

Once you have the heroku tools, make sure you are logged in to Heroku with the following command:

# in django-for-designers/myproject
$ heroku login

To prepare the app to run on Heroku, we need to make a few changes. First, we must instruct Heroku on how to launch your app. Second, we must make your app work with their Postgres database, rather than sqlite like you are using now.

Heroku reads a file called Procfile that tells them how to run your app's runserver command. So, create a file called Procfile with the following contents:

web: bash -c "cd myproject ; exec python manage.py runserver 0.0.0.0:$PORT --noreload"

Make sure to put it at the top of the project directory, namely in django-for-designers, not django-for-designers/myproject.

Be sure to stage this for being committed.

# in django-for-designers
$ git add Procfile

To configure the database, we will employ a trick at the bottom of the settings file: if we detect we are running on Heroku, we change the configuration to the one that Heroku provides.

To do that, you need to open settings.py, go to the end, and add the following lines:

import os
if 'DATABASE_URL' in os.environ:
    import dj_database_url
    DATABASES['default'] =  dj_database_url.config()

You need to also add one line to requirements.txt so that your Python code can communicate with Heroku's databases, which run a database server called postgres. Support for this is not built-in to Python, but it is available by a module. Add that module name to your requirements.txt file:

psycopg2

Since Heroku indicates the configuration through an environment variable called DATABASE_URL, this configuration block will only apply on Heroku. Therefore, it is reasonable to commit this. So we'll do that:

# in django-for-designers
$ git commit -a -m "Adding Heroku database config"

Now you'll need to actually deploy it! To do that, make sure you are logged into Heroku on your computer by running:

# in django-for-designers
$ heroku login

Then create a Heroku URL for your app:

# in django-for-designers
$ heroku create

Take the step of copying your code to Heroku's servers via git:

# in django-for-designers
$ git push heroku HEAD:master

Now Heroku has a copy of your code, and is configured to run it when people visit the URL you saw when you ran heroku create. But there is one more thing to do, which is to configure the database with the syncdb command.

# in django-for-designers
$ heroku run 'cd myproject ; python manage.py syncdb --migrate'

The heroku shell will prompt you for questions that will seem earlier familiar.

After all that -- you are done! Congratulations, and enjoy your new live web app!

Brief discussion of other deployment options

Heroku is not the only way to deploy Python and Django apps to the web. There are a few other ways:

  • If you rent "VPS" or dedicated server space, or connect a machine to the Internet and refuse to turn it off, you can install serve your app out through Apache and mod_wsgi, or any number of ways.
  • If you want other hosting similar to Heroku, we recommend taking a look at OpenShift or CloudFoundry, or any number of other 'Platform as a service' systems.
  • If you want something in the middle, you can use a service like WebFaction.

Sharing on Github

So far, people have been able to interact with your app, but they haven't been able to view its source code. In this section, you will share your app's code publicly on the web.

You'll also be able to browse your app's code yourself on Github!

(One important note: if the security of your app mattered, you would need to hide the SECRET_KEY variable inside settings.py from onlookers. For now, we will carry on without worry about that.)

You've been using git all along, but with Github, you can publish your work too.

First things first, you will need an account on Github. Visit https://github.com/ and create an account, or sign in if you already have one.

Then, click the button to create a new repo. It is in the top-right, and should take you to https://github.com/new .

For consistency, make the repository name django-for-designers. Be sure not to check the box asking to initialize the repo. Then click Create repository. Wait for your new empty Github project page to load in your web browser.

Once you have done that, you will need to reconfigure the git repository on your own computer so it can easily copy data to Github. To do that, we will inform it about a new remote repository. For this to work, you have to visit your Github project page and find the "HTTP" link specific to django-for-designers within your Github account. Copy that to the clipboard, and then type:

# in django-for-designers
$ git remote add theworld __PASTE_HERE__

Once you have added it, you can push there:

# in django-for-designers
$ git push theworld --all

Now just reload that Github page, and you should see the files you have been working on! You'll also see that since we passed --all to git, all the branches are available on Github.

Congratulations! You have completed this tutorial!

Further exercises for the reader