Creating your first pycommunicate app

Alright, now we can actually start.

The tutorial project will be quite simple:

  • will serve up a todo-file
  • will allow adding and removing of entries to it

As you can see, this is very simple, but using other libraries might require lots of ajax processing. In pycommunicate, none of this is needed! All we use is some pretty simple python code–server-side!

Let’s get started by making the simplest example: serving up a static page.

Setting up our app

Let’s start by making an empty directory called tutorial somewhere on your system. Inside this directory should be one file and one folder: main.py and templates.

Making our page

First of all, let’s create a simple page for our app in html. Some of it might not make sense right now, but just roll with it. For now just put this into templates/home.html:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Tutorial Checklist</title>
    {{ add_includes() }}
</head>
<body>
<h1>Welcome to the TODO!</h1>
<div id="todo">
    <p id="loadingBar">Please wait... loading todos</p>
</div>
<br />
<input type="text" id="next" /><button id="add">Add</button>
</body>
</html>

Serving up the page statically

First of all, we will need a CommunicateApp instance before we even start writing anything, so lets add that now to main.py, and while we’re at it, lets import everything we’ll need:

1
2
3
4
5
6
import eventlet
from pycommunicate.server.bases.views import View
from pycommunicate.server.bases.controller import ControllerFactory
from pycommunicate.server.app.communicate import CommunicateApp

app = CommunicateApp()  # main app instance

Now, lets create a view called TodoView, and have it display the content inside home.html.

1
2
3
class TodoView(View):
    def render(self):
        return self.controller.templater.render("home.html")

Alright, let’s break this down:

class TodoView(View):

This defines our view, as all views are subclasses of View.

Next, we have the render() method. This is called to get the base page to serve when requested. It is the only thing you actually have to override. Views have references to their parent controllers, which have templaters. A Templater can render templates from the file system, the default location is at templates/, but this can be changed. See CommunicateApp for how to change it.

Note

The templater, and all of pycommunicate use jinja2, a templating engine. For more info on what we provide in jinja2, and how to use the templater, go look at its page.

Anyways, now that we have a view, we should create a controller:

1
2
controller = ControllerFactory().add_view(TodoView).set_default_view(TodoView)
app.add_controller('/', controller)

This one is pretty simple, we create a ControllerFactory and call its methods (which are chainable) to add the TodoView view, and set it as the default (initial) one.

We’re almost done, now, and all we have to add is the secret key and the call to run.

Danger

Remember, the secret key must be kept secret. For a truly random secret key, use os.urandom()

Note

You need to include a secret key for pycommunicate to work.

1
2
app.set_secret_key('secret!')
app.run()

And that’s it! You should be able to simply run it and see a static, lifeless page. On the next page, we’ll get to adding some event handlers. Here’s the full source right now for copying:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
import eventlet

from pycommunicate.server.bases.views import View
from pycommunicate.server.bases.controller import ControllerFactory
from pycommunicate.server.app.communicate import CommunicateApp

app = CommunicateApp()


class TodoView(View):
    def render(self):
        return self.controller.templater.render("home.html")

controller = ControllerFactory().add_view(TodoView).set_default_view(TodoView)
app.add_controller("/", controller)

app.set_secret_key("secret!")
app.run()