Project 1

This assignment is to write a Flask application that enables the user to browse books about Queen Elizabeth I. It is due on March 1, 2016.


This is a team assignment, so you must complete and submit it with your team.

Revision Log

February 24
Add hint for formatting author bios.
February 23
Actually include number of books and editions
Document the img tag needed for book images
February 22
Add explicit name of null to author without a name
Document the number of books and editions
February 19
Add instructions on computing cover URLs


The purpose of this assignment is to create a browser for books on a particular topic. I am providing you with data on 970 books about Elizabeth I.

You will reuse a number of techniques from Assignment 1, as well as some new technologies:

  • CSS
  • Jinja template inheritance

Getting Started

  1. Create a new Flask application, using your virtual environment, and set it up (Git repository, .gitignore, according to the setup instructions.

  2. Create a repository on your team's GitHub account so that you can share your code, and upload the basic project to that repository.

  3. Download the data files, and add and commit them to your repository:

Overview of Data

I am giving you two data files:


This file contains information on books, as a list of dictionaries, each of which describes a book. Each book has several fields, as well as several editions (the editions key contains a list of editions for that book).

Each book and edition also has an ID (an alphanumeric string identifying it).

One field of particular note: both book and edition objects have an authors key, containing a list of author IDs.

This file contains information on authors, again as a list of dictionaries. Each author has an ID and a name, as well other information as available.

Explore the data files to find out what all keys they have. They are small enough that it is reasonable to open them in PyCharm.


It will likely be useful to create dictionaries mapping author IDs to their information, and book IDs to their information.


Your program should load the data files on startup, like it did in A1. This time it's a little easier, because you don't need to loop or use glob; just open the two data files and load them into data structures in your program.

There are several types of page you need to make.

Every page should be styled using CSS. In particular, change the default fonts, and adjust the layout to be more readable. Narrow page widths are (generally) more readable than using the entire page. We will talk in class more about how to do this.

Also, while you can write entirely separate templates for each page, it is useful to use Jinja's template inheritance feature so that things like styles are defined once, and the other page templates reuse those definitions.

Index Page

The front index page should have a suitable header/title, and display the following:

  • The number of books in the data set
  • The total number of editions in the data set
  • The number of authors in the data set
  • A link to a ‘List of Authors’, with the URL /authors/.
  • A link to a ‘List of Books’, with the URL /books/.


The data set has 970 books with 3218 editions.

List of Authors

The URL /authors/ should display a list of all authors, sorted by name.

Each author's name should be a link to an author page for them, with the URL /authors/‹aid› (where ‹aid› is the author's ID).

List of Books

The URL /books/ should display a list of all books, sorted by title.

Each books's title should be a link to a book page for that book, with the URL /books/‹bid›/ (where ‹bid› is the book's ID).

Author Page

If ‹aid› is a valid author ID, then the URL /authors/‹aid› should result in an author page for the author. It should display:

  • The author's name (as a heading)
  • Additional relevant information. For example, some authors have a bio, and that should be displayed. When displaying the bio, insert paragraph breaks where there are blank lines. Blank lines will arise when 2 or more \n characters (or \r\n sequences) appear in a row.
  • A list of the books by that author, sorted by title; each title should be a link to that book.

The author view function should fail with HTTP error 404 if it is given an unknown author ID.


You can insert <br> tags with the following code:

{% autoescape off %}
{{|escape|replace("\r\n\r\n", "<br>") }}
{% endautoescape %}

This turns off auto-escaping, which replaces HTML special characters such as < with code to make them render as the raw characters instead of HTML tags (a generally useful feature), and then uses the replace Jinja filter to replace newlines with <br> tags. It also uses the escape filter to manually escape the author bio (necessary in case it contains special characters, since auto-escaping is turned off).

The code will generally look a little bit better if you wrap each paragraph block in a <p> tag. You can do this in Python by using the split method of the str class to split it on consecutive newline characters.

Book Page

If ‹bid› is a valid book ID, then the URL /books/‹bid›/ should result in a page that displays information about the book with that ID.

This information needs to include, at a minimum:

  • Title
  • Author(s), by name; each author's name should be a link to their author page.
  • Subject(s), if available
  • List of editions, sorted by publication date; each edition should be a link to an edition page with a URL of the form /books/‹bid›/editions/‹eid›
  • A cover image

Individual editions may have cover images (as the cover field). For the book, search the editions for one that contains a cover and use that (if available). It does not matter which edition's cover you pick; you might want to pick the most recent.


Use an <img> element to display the image. The image element does not have a closing tag.


The cover field contains a cover ID. This can be used to produce a cover URL; if the cover ID is ‹cover›, then the cover URL is‹cover›-M.jpg for a medium cover image. Replace M with S for a small image, if you want to display an image with each edition in the book's edition list.

See the OpenLibrary Cover API for more details.

The book view function should fail with HTTP error 404 if it is given an unknown book ID.

Edition Page

The URL /books/‹bid›/editions/‹eid› should result in a page that displays information about that particular edition of the specified book. This should include:

  • Title
  • Subtitle
  • Author(s), by name; each author's name should be a link to their author page.
  • Subject(s), if available
  • lc_class, the Library of Congress call number(s), if available
  • ISBN numbers (isbn_10, isbn_13)
  • Publishers
  • A link back to the Book page for the book


Prepare your submission using package.

Only one team member should submit.