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.

In this post, I will develop a simple web application using Python in which I use REST to communicate with the 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.

Quote application example

It is a single page application, which shows random quotes (updates after 8-second intervals or on click of the button). The source code for this application is available at 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 into those in detail, but if you don’t know how to do this, 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?
    • It’s ideal for small apps because it’s clean and simple.
    • In many cases, you’ll be able to build your whole application in a single Python file.
    • It’s unopinionated, so it’s flexible, especially compared to Django, which is big and opinionated.
    • It’s well documented, popular, and has a 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 and routing URLs to Python functions.
    • It also includes built-in dev-server, debugger, and unit-testing support.

Installing Flask

You can install it using pip as follows:

Installing Flask

Application Code

Here is the application code which is very simple. We define a simple route which will return a string in this case.

Get route for hello world app

Running a 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

Running a Flask application

Hello world application

Jinja Templates

Flask comes with templates, and they are just like templates in any other programming language. See how to create them and use them below.

Create a templates folder and create an HTML file as follows (this the location where you put your HTML templates. Also notice that there is a static folder as well, which is where you put static resources.

Adding HTML template

HTML Template

The following template looks like standard HTML and the place-holder for dynamic data.

Adding dynamic Jinja variable

Jinja Variable

Creating Jinja variable

Result

Templated HTML

You might be already familiar with this pattern. It is known as the MVC pattern. At his point, you can continue your application this way if you like. It’s a totally valid approach. However, the route I took is just to return JSON data (REST API) from the backend and consume and serve HTML statically and use JavaScript to call the REST API for data. In following sections, I will talk about that wiring. If you have used REST, then this should already look familiar 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 that contains the functions for that purpose.

Then, use this repo for your REST API. The following screenshots shows these components:

Quotes.json file

Repo.py file

REST Endpoint

This endpoint selects a random item from your JSON file and returns it. This endpoint is called from JavaScript (AJAX call) on the front-end of our application. The code is self-explanatory. However, let me know if you need more information.

Front-End Code

As mentioned earlier, I created a simple HTML page and performed AJAX calls to get the data and then display it on the web page. I used knockout.js for data-binding (you can use React or Angular if you want to) and also some JavaScript timers to perform those AJAX calls on a regular intervals (I wrote a post about timers recently, check that one if you need more info).

Front-end API calls

The front-end code is very boiler plate. I actually reused most of it from my earlier posts. Feel free to check it on my GitHub repo as well.

Deployment

For deployment, you have multiple options. For this demo, I used an Azure Web App, which was very simple to use. Azure has great documentation about how to do that, so I won’t go into details about it.

Summary

Flask makes it easy to create web applications using Python. Django is an other option, but it’s 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 soon. Until next time, happy coding.

You can check the application on this URL.

Application example.

Other Links



Source link

Write A Comment