There’s a bunch of things that I love that I don’t talk about: The IQueryable vs IEnumerable, Code-First vs Database-First, ORM vs Raw SQL or who is the most powerful Avenger in MCU. But one of the things that I’m not at all ashamed about is my appreciation for REST.
Don’t worry, we are not going to discuss what makes a true REST design and what are the benefits of pragmatic REST approaches. REST is also not an answer to every challenge, the reason I like it, is due to its simplicity and how easy it is to use across various programming languages and easy to work with.
In this post, I will develop a simple web application using Python and there I used REST to communicate with server from the UI. You will also see the steps and components involved and it should give you enough context to move forward using python in your development tasks.
Finished Application
Before we start the coding part, I would like to show you the application we are building today. You can access the finished application on this URL and find below the screenshot of the main page.
So, a single page application, which shows random quotes (update after 8-seconds intervals or on click of button). The source-code for this application is available on this git-hub link.
Introduction
Python is an interpreted, high-level, general-purpose programming language. It is very popular and is being used in many different areas of software development. However in this post the focus is on web-development and particularly flask. I am assuming you have some basic knowledge of python and you are already familiar with the concept of package-management pip and virtual environment setup. I will not go in those details, but if you don’t know how to do then there are many good resources available online, which will walk you through those steps.
Flask Basics
If you want to build a web application using python, Flask can be used. Find below some information about flask and why you would like to use it.
- Flask is a micro-framework for building web applications using python.
- Why choose flask?
- Its ideal for small apps because its clean and simple.
- In many cases you’ll be able to build your whole application in a single python file.
- Its UN-opinionated, so its flexible vs to Django which is big and opinionated.
- Its well documented, popular and have large community.
- Features provided by flask
- Flask is built on two main components
- Jinja 2 (template engine for HTML).
- Werkzeug (german word: tool) provides Http support & routing URLs to python functions.
- It also includes built-in dev-server, debugger & unit-testing support.
Installing Flask
You can install it using pip as follows:
Application Code
Here is the application code which is very simple. We define a simple route which will return a string in this case.
Running Flask app
I am using windows. If you using linux/mac-os then setting environment variable syntax is slightly different. Generally there are three steps involved:
- Tell flask in which module our application can be found by setting a variable $Env:FLASK_APP=”basic-demo.py”.
- $Env:FLASK_ENV=”development” (this will enable debugger as well).
- Flask run + browse to url or you can also use >>python -m flask run
Jinja Templates
Flask comes with these templates support and they are just like templates in any other programming language. Find below how to create them and use them.
Create templates folder and create an HTML file as follows (this the location where you put your HTML templates. Also notice that there is static folder as well, which is where you put static resources.
HTML Template
The following template looks like standard HTML and the place-holder for dynamic data.
Jinja variable
Result
You might be already familiar with this pattern, it is known as MVC pattern (flask call it slightly differently). At his point, you can continue your application this way if you like. Its totally valid approach. However, the route I took is just to return JSON data (REST Api) from backend and consume and serve HTML statically and use java-script to call the REST Api for data. In following sections I will talk about that wiring. If you have use REST then this should already look fimilar to you as well.
A data layer
For this demo, I am using in-memory data (quotes.json) but this could be coming from a database. To access this data I created repo.py which contains the functions for that purpose.
Then use this repo into REST Api. Following screenshots shows these components.
REST Endpoint
This endpoint selects a random item from json file and return it. This endpoint is called from JavaScript (ajax call). The code is self explanatory however let me know if you need more information.
FrontEnd Code
As mentioned I created a simple HTML page and perform JavaScript ajax calls to get the data and then display it on web page. I used knockout.js for data-binding (you can use React or Angular if you want to) and also some JavaScript timers code to perform those ajax calls on regular intervals (I wrote a post about timers recently, check that one if you need more info).
The frontend code is very boiler plate. I actually reused most of it from my earlier posts. Feel free to check it on github repo as well.
Deployment
For deployment you have multiple options. For this demo I used Azure Web App and it is very simple to deploy it. Azure have great documentation about how to do that, so I wont go into details about it as well.
Summary
Flask make it easy to create web applications using python. Django is an other option but its a big framework and if your requirements are simple, then flask is easy to learn and fun to use. I enjoyed creating web applications with it and hopefully you will too. I will write more about python in next days. Till next time, happy coding.
You can check the application on this URL.
