Passing JSON data from Django to React component

I am trying to develop an "Yahoo Finance"-style app using Django and React. The dashboard view creates the the JSON data for the users portfolio, and then passes it in the context to the html template, where I would like to use it to create React components. The JSON output for example, is as follows:

{'PENN': {'name': 'Penn National Gaming, Inc', 'price': '56.5900'}, 'WMT': {'name': 'Walmart Inc', 'price': '140.0400'}}

The trouble I am having is using the JSON data from the props and mapping it into HTML elements.

views.py:

def dashboard(request):
    user = Profile.objects.get(user=request.user)
    positions = user.positions.all()
    data_response = {}
    for position in positions:
        position_data = {}
        response = requests.get("https://www.alphavantage.co/query?function=OVERVIEW", params={"symbol": position.symbol, "apikey": key})
        data = response.json()
        name = data["Name"]
        position_data["name"] = name
        response = requests.get("https://www.alphavantage.co/query?function=TIME_SERIES_DAILY", params={"symbol": position.symbol, "apikey": key})
        data = response.json()
        price = data["Time Series (Daily)"]["2020-10-28"]["4. close"]
        position_data["price"] = price
        data_response[position.symbol] = position_data
    print(data_response)
    return render (request, "holdings/dashboard.html", {
        'data_response': data_response
    })

dashboard.html:

<div id="app" />
      <script type="text/babel">
    
        class App extends React.Component {
          render() {
            return (
    
              <UserPosition data='{{ data_response }}' />
    
            );
          }
        }
    
        class UserPosition extends React.Component {
          render() {
            return (
              {data.map(item => (
            <div class="col-3">
              <div class="asset__container flex flex-horizontal">
                <div>
                  <h4>{ item.name }</h4>
                </div>
              </div>
            </div>
          ))}
            );
          }
        }
    
        ReactDOM.render(<App />, document.querySelector("#app"));
    
      </script>

Additionally, I would appreciate any input on whether these API requests should be made server-side or client-side, before I get too deep into the project.