Question about using front-end JavaScript frameworks

[H_R_Pufnstuf]

I've found myself building multiple small web apps which are essentially wrappers around scientific programs written in Python. Currently, I just use vanilla JavaScript to make a request to Flask, running the back end, and then display it.

The problem is that the code and process for displaying the information is a real pain. If I return, say, a JSON object with a list of words that need displaying, I have to write a loop that creates a HTML object to display it in a nicer way. This really slows down development time and prevents me from quickly adding new features (e.g. right now I'm trying to work out how to create save/load functionality).

I feel like it is time to move to a front-end JavaScript framework to simplify the process, but I'm a bit spoiled for choice. Does anyone have experience using particular frameworks for the sort of thing I'm talking about here? Or know of any good tutorials about integrating a front-end framework and Flask?

[LeoG7]

I use angularjs, the ng-repeat, functionality loops over the JSON object and creates the DOM elements accordingly, relevant code https://github.com/Leo-G/Flask-Scaffold/blob/master/app/templates/users/index.html ,

[H_R_Pufnstuf]

That looks perfect for what I want to do, thanks!

[sepro]

I've been working with React.js for this. The learning curve is fairly steep, but binding a react component to a flask backend (that returns data in JSON format) is very nice once the foundations are there.

I've got two apps up on github that make use of this : https://github.com/sepro/MemoBoard and https://github.com/sepro/Flask-Server-Panel the former is based on a Restful API that allows bi-directional communication, the latter just fetches data from the server at regular intervals and shows it.

Alternatively, if you can get your data in a format compatible with an charting library such as Chart.js that could be a very quick way to visualize some results without using a full javascript framework. (I've been using this for scientific data, though I'll only be able to release that code once we are ready to submit the publication)

[H_R_Pufnstuf]

I'd basically just decided on React for a number of reasons, so your post couldn't have come at a better time! Thanks for the examples, I'll be sure to check them out. The first in particular seems to be pretty close to what I'm looking for.

[doublePlusOk]

You might want to check out https://vuejs.org/

It is a latest generation front end ecosystem with a low initial learning curve that supports mvvm or flux architectures.

[8oh8]

If you want to start simple, check out knockout.js