CSci 284 - Homework 6
Due: Thursday, April
9th, 2026
This assignment is worth 50 points. For full credit:
- post homework submissions to BrightSpace by 11:59pm on the due date
- the Final Project Proposal is also due then
Resources:
- Web Forms in Flask Tutorial
- Flask Quickstart: start with Cookies and go through Logging; focus on the Session section.
- Demystifying the Secret Key: the second answer (at the bottom of the page) is much shorter, read it first. Then go back to the first answer for deeper understanding.
- FlaskWTF
Part 1. Using FlaskWTF (38 points)
Work through the Flask:
Web Forms tutorial introduced in class. Unlike previous tutorials,
this one does not present all the code; all files for the final
application can be found on
Github or in this zipfile. The
main program is actors.py but you'll need the entire directory
structure to get all the Python files and the templates folder.
Otherwise, you won't have the complete webapp. This tutorial is
flawed in that the author inserts an digression in the Configure
the Form section about RadioField objects
using an example
totally unrelated to the actors webapp (actually from an
improved version of the presidents webapp). For this assignment
you won't need code from this code box about creating the RadioField.
You might be surprised to search for, say, George Clooney and
discover he's a bear! The author didn't want to write real bios for all
the actors in the dictionary for this app, so used goofy photos and
program-generated text instead.
Include a file containing the answers to these questions about the code
in actors.py:
- What is the purpose of the function
redirectin the last statement of theindexfunction (4 points)?return redirect( url_for('actor', id=id) )
- What does the function
validate_on_submitin theindexfunction do (4 points)?
- Imagine you wanted to add a second form containing two text fields, two radio buttons, and a checkbox. What would the class look like for this form? What new imports would be needed (6 points)?
This app has no .css file (in fact it doesn't have a static
subdirectory at all). However, in the templates we see class
attributes in the (for example) <div> tags,
with values like "mx-md-auto" and "col-md-10". What
gives?
- Research these class attribute values and give a short description of each (4 points).
- Where do you think these names are coming from? Where might they be
defined? Hint: the
<div>tags are concerned with placing sections of the webpage on a grid (4 points).
Turn in the answers to these questions and a screenshot of the example running in a web browser as a zipfile (16 points).
Part 2. Using Bootstrap (12 points)
Visit the Bootstrap-flask code repository and scroll down to the README,
where you'll find an Example section. This shows a simple
program and template that uses Bootstrap to render a Login
form. Build these out in a new directory structure (not the template
directory for any of our existing Flask directories). Start the Flask
virtual environment and try running with the command
flask --app login.py runRecord what happens. If you get a webpage, take a screenshot of that after entering a password of only 3 characters. Otherwise, screenshot whatever error or other results you see.
Create a zip file containing the files and screenshot and post to BrightSpace.