The internet’s simplest introduction to writing a facebook application with Google App Engine, in Python, with Django.

So let’s start with an easy introduction to writing a facebook app with app engine. First of all, you need to sign up for an application with Facebook. You can do this here, just click “set up new application” once you’ve added the facebook developer application, and give them your preferences. You should then come to a page full of settings, with titles like “Essential Information”, and “Basic Information”. Use the navigation on the left to edit the “canvas” settings. Keep this page open.

Now you must sign up for a new application with Google App Engine. That can be done here. Next, you need to write your standard app.yaml file (To illustrate the process, I’m going to be making a simple counter, to count how many times an application “canvas” is viewed). I’m going to call my application “fbstcntr” (as in “facebook stat counter”) The app.yaml file is going to look like this (the stylesheets director is for you to use later when designing your canvas):

application: fbstcntr
version: 1
runtime: python
api_version: 1
handlers:
- url: /stylesheets
static_dir: stylesheets
- url: /.*
script: main.py

Now go back to the facebook settings page, and where it says “Canvas Callback URL”, enter http://(your-application-name).appspot.com. Also, enter the name of your application in “Canvas Page URL”.

Next, you’ll need to make your canvas.html file (this is the one that facebook will use for your application’s canvas). Mine just looks like this (remember I’m using Django, but that’s by no means essential for this tutorial):

<html>
<body>
{{ stat }}
</body>
</html>

Save this file in the same folder as your app.yaml file (the folder I’m using is just called “fb”). Next, we’ll make our main.py file – this is where things get slightly more complicated, but I’ll keep it simple yo.

import cgi
import os
from google.appengine.ext import webapp
from google.appengine.ext.webapp.util import run_wsgi_app
from google.appengine.ext.webapp import template
from google.appengine.ext import db
# this is a file we'll make next
import facebook
# just a little datastore model
class Stat (db.Model):
visit = db.IntegerProperty(default = 0)
class Canvas(webapp.RequestHandler):
def get(self):
#these are found in facebook's 'My Applications' page
_FbApiKey = 'your api key'
_FbSecret  = 'your secret key'
# Add an element to your datastore
visit = Stat()
visit.put()
# find out how many elements there are in the datastore
query = db.GqlQuery("SELECT __key__ FROM Stat")
results = query.fetch(1000)
stat = str(len(results))
# put this value in your template values
template_values = {"stat": stat}
path = os.path.join(os.path.dirname(__file__), 'canvas.html')
self.response.out.write(template.render(path, template_values))
application = webapp.WSGIApplication([('/', Canvas)], debug=True)
def main():
run_wsgi_app(application)
if __name__ == "__main__":
main()

Save this file as “main.py”. Next, visit this page, and save all of that code straight into a file called “facebook.py”, and make sure that file is in the same folder as the rest of your application. Well done! You’ve just made the skeleton of your facebook application! Now, run your command prompt, and make it go to where your application is stored (its directory). For me it looks like this:

D:\Graeme\Work and Fun\Python\GAE\fb:

Type in “appcfg.py update ” and the name of the file that is holding your application files. Fire this off and it will update your application!

Every time you visit this application’s page at apps.facebook.com/your-app-name/, it will update the datastore and display the amount of visitors that have been there previously. You can grow this application more by working on your canvas.html file, and including more functions that are available with facebook.py. There are so many possibilities still for facebook apps, and now you can make them and host them for free off Google’s servers – so best of luck!