My First Web App

The holidays are here! This means that there is finally enough time to develop my first web app. Knowing how bad I still am at debugging weird errors and how little experience I have with frameworks, I prepared myself for a nerve-racking experience full of apparently insurmountable obstacles.

First of all, I researched a few popular python frameworks, services and tools to find the best options for me. Since I prefer lightweight and modern frameworks, Flask was an obvious choice. Flask also supports Jinja2 Templating out of the box, which is great. For deployment, I picked Heroku because it seems to be quite beginner friendly.

Setting everything up was surprisingly easy. I just followed the official documentation as far as possible and googled confusing error messages. Thank you, python community, for caring so much about documentation!

Next, I wrote necessary HTML templates and CSS styles, which didn’t take me too long. With Jinja2, it is possible to create one base.html file and let all views inherit from that one. This allowed me to reduce code duplicity and make changes much faster than usual.

Finally, I had to figure out how to pass a PIL Image to a Jinja2 Template. I found out that the html img tag correctly handles Base64 strings, so I tried to convert my image to bytes via the build-in .tobytes() method and encode the result using Base64.
Sadly, tobytes produces an unexpected format that I couldn’t get to work, so I’m using a BytesIO buffer instead. Hopefully, I will find a more elegant solution someday.

And that’s it! You can check out the result here.
(The app loads quite slowly because I’m using the free version of Heroku)

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s