how to put data collected from api (with python) into a frontend framework?

Viewed 75

i've just started coding recently and I need some help. I was able to collect data from an api in json which appears when i run my python file. Now i'd like to have that same data appear on a separate framework ( frontend), for example by the click of a button. So basically one button, runs a certain python file...etc

Here is what i have so far (this is one requests of many):

 url = 'http://ergast.com/api/f1/'
 years = ['2014', '2015', '2016', '2017', '2018', '2019', '2020', '2021']

    for x in years:
    for y in range(1,23):
        a = requests.get(url+x+'/'+str(y)+'/constructorStandings.json')
        data8 = a.json()
        if data8['MRData']['StandingsTable']['StandingsLists']:
            data_constructor_after_race = data8['MRData']['StandingsTable']['StandingsLists'][0]['ConstructorStandings']
            for z in data_constructor_after_race:
                #print(z['Driver']['givenName'], z['Driver']['familyName'])
                print(z['Constructor']['name'], z['Constructor']['url'])
        else:
            print("missing info")

result when running said code: https://prnt.sc/hgX7jUPKth9s

I have read some sites and watched some videos but i couldn't understand which framework is best for my issue and how/where to start.

Thank you for your help, it is much needed

1 Answers

If you want to get data only once and show on a frontend framework, then you can simply export the data as a json file using python. Then you can read that file on frontend using javascript. But that means everytime you want to put updated data in the json file, you need to run your python script manually and copy json file again to frontend.

Alternatively you can consume your 3rd party API, 'http://ergast.com/api/f1/' directly from your frontend using javascript and show data in your HTML. Look up Fetch or Axios

Other alternative, which you might find overwhelming if you're just starting out, is that you need to look into client server architecture. In your case, what you would do is create a Python API server using Flask, FastApi or Django framework and serve the data as an API. Then you can consume those APIs on client side javascript (or any frontend framework) using a simple fetch call and get the data. You cannot run python files from frontend code directly.

For reference: Client Server Architecture Flask FastAPI

Related