Skip to content
A to do list webpage created using django
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Learning Django Templates

Welcome to the backend... not! For this assignment, you will be providing the frontend of a todo list app. Think Todoist or Wunderlist. However, this is a different kind of frontend than you have been writing. No javascript is required!

For this application you will write django templates (similar to the Book Store and BaseBook assignments). Here are some screenshots of your goal.

Getting started

python3 migrate
python3 runserver

What do you do?

Remember, the purpose of a frontend is to sit between a backend and a user. So you need to know two things: - How do I interact with the user? - How do I interact with the backend?

The Backend

Interacting with the backend involves sending requests to the endpoints it exposes. This backend exposes the following endpoints:


Name: app:todos

Method: GET


  • filter - Specifies which todos are shown. Can be ALL, ACTIVE, or COMPLETED.


Name: app:create

Method: POST

Form data:

  • title - The title of a new todo. Any string < 31 characters long.


Name: app:toggle_editing

Method: POST

Toggles whether or not the post is being editted.


Name: app:toggle_completed

Method: POST

Toggles whether or not the post is being editted.


Name: app:new-title

Method: POST

Form data:

  • title: The new title of the todo. Any string < 31 characters long.

Sets the title of the Post to the new title.


Name: app:delete

Method: POST

Deletes the todo.

The frontend

Your templates should produce a page that looks like the images included below.

When the user clicks the "Don't Forget" button, you should post entered title to the todo/create endpoint.

When the user clicks one of the filter buttons, you should direct them to the todo/ route with the appropriate query parameters.

When the user clicks on the edit button, you should post to the appropriate todo/<id>/toggle_editing/ url.


With Todos

Todo list with todos

Without Todos

Todo list without todos

Editing a title

Editing a title

More Requirements

You must split your implementation up into two templates:

  • todo.html
  • todos.html

todos.html will be responsible for rendering the "whole page". todo.html will be responsible for rendering an individual Todo. The {% include ... %} tag will be important here.

You must use the following django helpers:

  • for
  • if
  • include
  • url
  • csrf_token


You can’t perform that action at this time.