Skip to content
Browse files

Hook up to a template

  • Loading branch information...
1 parent ba4ebf1 commit 274814e789a51184e9bec9c79377be8ce49edbb5 @eleddy eleddy committed Jan 11, 2012
Showing with 95 additions and 6 deletions.
  1. +74 −3 README.rst
  2. +3 −3 src/noiselist/
  3. +18 −0 src/noiselist/templates/hello.html
77 README.rst
@@ -4,29 +4,100 @@ Introduction
This is the second installment of our tour of web frameworks. This will
be a simple TODO list.
+Up and Running
Just like in the last class, you want to run bootstrap and buildout::
- > git clone <location to repo here>
+ # TODO: use noisebridge url
+ > git clone git://
> cd flask-noiselist
> python
> ./bin/buildout
To get the server running in foreground mode, do::
> bin/flask-ctl debug fg
Your app will be running at with a simple hello world
Take a minute to notice the differences between this app and web2py. There is
no admin console and no formatting by default. Flask is really a micro framwork.
Notice as well that starting we are in foreground more, and that you don't
-have to kill a process or terminal to restart. Simply Ctl-C.
+have to kill a process or terminal to restart. Simply Ctl-C to restart.
+Modifying These Instructions
+Since this is written by a human, please feel free to update the instructions in this
+file itself and commit back. If you need permissions, feel free to contact me or just
+fork and I will merge back. If there is interest in class we will discuss how this
+works with github.
+Folder Structure
+Unlike web2py, you can not edit the application through the web (TTW). All the files
+you will be editing will be in flask-noiselist/src. Take note that the app itself
+should be in egg format.
+ has a bunch of stuff you don't need to worry about in the moment. This
+basically just sets up the app for running and testing. You should never have to
+modify this.
+The only python file we will be working with is Because the app we are
+doing is small, this will be sufficient for all of our code, although it is not
+really considered to be best practice.
+Note that unlike web2py, you are presented with a completely blank slate. We will be
+touching a few different files in this exercize than the previous one because of this.
+Let's get a few pretty things ironed out first so we know what we want the end result
+to look like.
+First, notice that we don't have any templates yet. Flask uses Jinja2, a "standalone"
+templating engine. Most modern frameworks should be integrating with 1 or more different
+templating engines. This is beneficial to you because you can learn one framework and
+not have to learn a new templating language every time (web2py has its own templating
+language). Jinja2 is very popular and widely used (and more importantly that means it
+is well supported).
+First we need to create a directory for holding our templates::
+ > mkdir templates
+And lets take our Hello page and make it into a template by adding a template::
+ > touch hello.html
+In that file, let's add a few lines to show how our list will look in the end::
+ XXX: Link to that changeset
+And then in, we will connect the index page with that tempalte by
+adding a decorator::
+ from flask import render_template
+ ...
+ @app.route('/')
+ def index():
+ return render_template('hello.html')
+Flask is run under WSGI. We will discuss what that means in other classes, but
+more importantly you just need to know that routing occurs outside of the app itself***
More Info
-For more info on this buildout itself, please see
+ * Flask Documentation:
+ * About Jinja2:
+ * For more info on this buildout itself, please see
6 src/noiselist/
@@ -1,5 +1,6 @@
# -*- coding: utf-8 -*-
from flask import Flask, request
+from flask import render_template
class _DefaultSettings(object):
@@ -21,6 +22,5 @@ def init_db():
def index():
- if request.args:
- BREAK (with_NameError)
- return 'Hello %s!' % app.config['USERNAME'].title()
+ return render_template('hello.html')
18 src/noiselist/templates/hello.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+ <head>
+ <title>TODO at Noisebridge</title>
+ </head>
+ <body>
+ <h1>My Personal TODO List</h1>
+ <ul>
+ <li>Finish evaluating pull requests</li>
+ <li>Finish writing up class work</li>
+ <li>Swim and enjoy the sun</li>
+ <ul>
+ <form action="" method="POST" id="add_to_todo_list">
+ <input type="text" name="todo_item"/>
+ <input type="submit" name="add_todo_submit" value="Add to List!"/>
+ </form>
+ </body>

0 comments on commit 274814e

Please sign in to comment.
Something went wrong with that request. Please try again.