pythonflaskrefreshlivereloadhot-reload

How to automate browser refresh when developing a Flask app with Python?

I've started learning Flask to develop web applications. What I am really missing is an automatic Browser refresh after any code change (including static files, templates, etc.). This seems to be a standard feature in almost any JavaScript framework. Frontend people have several terms for that: auto reload / refresh, hot reload / refresh (hotreload), live reload / refresh (livereload), ...

Here on Stackoverflow most similar questions are related to the auto-reload of the Flask server (--> https://stackoverflow.com/search?q=flask+auto+reload).

J just want a simple browser refresh.

I googled and tried several things - with no luck:

How can I have a smooth developing experience with Flask without having to hit the F5 key 1000 times a day in a browser just to see the results of my changes?

I think the answer is somewhere near to python-livereload from the link above. So I guess an alternative title of my question could be:

Does somebody have a working example of Flask + python-livereload?

I am to dumb to get it from their documentation :)

EDIT: for the sake of completeness here is the Flask app I am using.

# filename: main.py

from flask import Flask, render_template
from livereload import Server



app = Flask(__name__)

@app.route('/')
def index():
    return "INDEX"

@app.route('/bart')
def use_jinja():
    return render_template('basic.html')



if __name__ == '__main__':
    server = Server(app.wsgi_app)
    server.serve(port=5555)

I start the app with

python main.py
Solution

  • This is an interesting question you've raised so I built a quick and dirty Flask application which utilizes the livereload library. Listed below are the key steps for getting this to work:

    1. Download and install the livereload library:

      pip install livereload

    2. Within your main file which starts up your flask application, run.py in my particular case, wrap the flask application with the Server class provided by livereload.

    For example, my run.py file looks like the following:

    from app import app
from livereload import Server

if __name__ == '__main__':
    server = Server(app.wsgi_app)
    server.serve()

    1. Start your server again:

      python run.py

    2. Navigate to localhost in the browser and your code changes will be auto-refreshed. For me I took the default port of 5500 provided by livereload so my url looks like the following: http://localhost:5500/.

    With those steps you should now be able to take advantage of auto-reloads for your python development, similar to what webpack provides for most frontend frameworks.

    For completeness the codebase can be found here

    Hopefully that helps!