First chapter of an articles' series about making a todo app using Flask and Vue. Today we will install everything we need for our backend and see what's under Flask's hood.
Flask is a great lightweight web framework for Python. By itself, it only provides a limited amount of features, such as routing or blueprints. However its strenght lies in the extensions that gravitate around it. In the end, it comes with less boiler plate code than Django and make it easy to quickly prototype applications. And that’s pretty much what we are doing right now.
First we need a place neat and clean for our app. The best way to do that is using Pipenv. If you come from the Node world, think of it like
npm. It creates for you a virtualenv with the python’s version of your choosing and the packages you want.
Like a regular package, we can install it with
pip install pipenv
Now that we have it installed, we need to create a directory or package for our app called
todo. Inside we also put
app.py, the app’s main file.
mkdir todo cd todo touch app.py
Then we have finally create our environment inside
pipenv --python 3.6 pipenv install flask pipenv shell
The first line tell
pipenv we want for our workspace, the second the package we need and the third activate the virtualenv. It “replaces” your
python command by the one present in the environment. Write
exit whenever you want to get back to the normal
To finish this short introduction to Flask, let’s write an app that render a Hello, World! on the website’s index.
We start by importing Flask and creating a new app.
from Flask import flask app = Flask(__name__)
Then we define a new route using Flask’s
@route decorator. The returned value of the decorated function will be displayed on the page.
@app.route("/") def index(): return "Hello, World!"
We end our file by launching our app in debug mode on port 8000.
if __name__ == '__main__': app.run(debug=True, port=8000)
Now, just click on localhost:8000 and admire the beautiful Hello, World message.
We now have a clean environment and the beginning of an app. In the next chapter we will go deeper in Flask by adding interactions with a database to store and fetch our todos.