Edit: Hi I've checked the duplicates of this question, they do not ask about SPA (client vs server rendering)
I am trying to change my Flask Web App to be rendered client-side in JS instead of server-side with Jinja templating. An interviewer told me that the problem with my Flask Web App, is that the Application server usually only should be serving pure Json APIs and not try to render any existing static content (example the website content that doesn't change, the theme, css, logos, pictures etc), since it'll be a waste of the computing resources of the application server.
With regards to my web app, what it does is it makes calls to 2 different APIs and returns you carpark availability lots based on a user input(e.g your place of residence)
I've done some research into using AJAX with Flask. It seems using XMLHttpRequest based off https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started is the way to go. Based off my limited understanding, if implemented correctly, would it be possible to switch my web app into one that essentially replicates the functionality of a SPA? (no page refreshes, client-side rendering)
Currently struggling with the implementation, any help would be great!
A .py script below
# one of Four routes in my "Main" Flask Script
@app.route('/address',methods = ['POST', 'GET'])
def address1():if request.method == 'POST':desired_CP_Address = request.form["address"]response = requests.get("https://data.gov.sg/api/action/datastore_search?resource_id=139a3035-e624-4f56-b63f-89ae28d4ae4c&q=" + desired_CP_Address)r = response.json()CP_Info = r['result']['records']return render_template("address1.html", text=CP_Info)
A snippet of the resulting html page
<body>
<h1>carpark.py</h1><!-- if invalid input display bottom -->
{% if text %} <h3>Click on your desired carpark number</h3>
<hr>{% for x in text %}<p>{{ x["address"] }} : <strong><a href="">{{ x["car_park_no"] }}</a></strong> </p>{% endfor %}