Homework: Emergency Kitten

Emergency Kitten

There's a website called emergencykitten.com which, when you are in dire need of a kitten picture, will happily provide you with one.

Your goal is to make your own version of this site, perhaps you want an emergency puppy, or emergency quokkas!

Create a Flask app that has two pages

• The home page (/) should randomly select a picture and show it in the middle of the screen (each refresh should show a different picture).

• The /about page should have a short description of the site.

• Both pages should link to each other.

Your images, css, etc. should be put in the static folder, and flask will serve them from the /static/ route.

For example an image myfile.jpg in the static folder can be used in the html like this: <img src="/static/myfile.jpg">

Please be aware of using copyrighted pictures, to find pictures that have open licences that you're allowed to use, search on Pixabay.

Hint: You might like to use Python's random.choice() function to choose an image from a list.

import random

foo = ['a', 'b', 'c', 'd', 'e']
print(random.choice(foo))

Extensions

• Add a CSS file and some styling (make sure it's in the static folder too)

• Add another page for a gallery which shows all of the kitten pictures (use flexbox to lay out the images).

• Add a JavaScript file and make it so that in the served HTML the random kitten is hidden and instead there's a "Reveal kitten" button which reveals it (add some CSS transitions)