Flask and Angular Web Application Routing

Question

I want to make a web app primarily using Python Flask framework as well as AngularJS and whilst thinking about doing so and maintaining features of the application I started wondering how the routing would be handled.

In flask it is very easy to manage how the back end directly deals with routing:

@app.route('/')
def home():

In Angular it is easy to manage routing as well obviously, and the data can be worked with by loading specific controllers in to access certain parts of the back end via XHR and what not.

To make a good single page web app would I benefit most from delegating all the routing responsibility to either Flask or Angular, or would it make sense to let Flask handle all the routes with just a /, and let Angular deal with all the hash-routing for changes in that single view.

I'm not exactly sure how to tackle and delegate this and I realize there is no one way to do it but I interested to see if anyone has messed with this before and what they found to be easier to work with.

score 5 · Accepted Answer · edited May 23 '17 at 12:30

5

Take a look at this example, it's extremely well-written and documented. If you look in the controllers.py file you'll notice that he uses Flask/Python for the RESTful API and he lets Angular handle all the static templates.

Edit: I've never looked at this before, but this seems to be really cool and might make your life easier. Also, here's a question that's extremely similar to yours which I just found.

edited May 23 '17 at 12:30

Community

1
1

answered Jan 08 '15 at 16:33

Daniel Dao

830
1
7
11

Thank you very much, do you personally have any experience with Flask restful module? Just curious – Dominic Farolino Jan 13 '15 at 04:24
I personally have not used Flask-restful. – Daniel Dao Jan 14 '15 at 14:04

score 1 · Answer 2 · answered May 13 '20 at 12:15

I know this is old thread. But If anyone wants to serve Angular or AngularJS by Flask then the easiest solution is to handle 404 not found error by Angular routing and return client side page on flask side.

@app.errorhandler(404)
def not_found_error(error):
    return render_template('index.html')

score 0 · Answer 3 · answered Jan 07 '15 at 18:17

It depends on how you want to structure your app I suppose. To me it makes sense, if you consider your entire website one app, to allow Angular to handle all the client endpoints, and use Python as a RESTful service.

However, if you have any static content that you want to render server side outside of your SPA, then you could do that routing in Python.

score -2 · Answer 4 · answered Mar 08 '15 at 04:39

One option is to separate the Flask and AngularJS application. This way, Flask routing is used for exposing api endpoints that the client side app (AngularJS) will use. And AngularJS routing will be used for client-side routes.

I've written a tutorial on using Flask and AngularJS together - http://tutsbucket.com/tutorials/building-a-blog-using-flask-and-angularjs-part-1/

Hope that helps.

Flask and Angular Web Application Routing

4 Answers4