How to make an AJAX call to get some data and render the result server side? GET data on server -> render result -> send HTML to client

Question

I am trying to figure out the best way to fetch data on the server side and render the resulting template there.

I've looked at some other articles on this -

One thing I saw was to use statics. What does this mean?

Essentially, here's my very basic component code. I know I have componentDidMount there, but I need to replace that somehow so that the request and result set is done server side but don't know how.

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as actionCreators from '../../actions/fake-data';

class LandingPage extends Component {

  componentDidMount() {
    this.getFakeData();
  }

  getFakeData() {
    this.props.actions.getFakeData();
  }

  render() {
    console.log(this.props);
    return (
      <div>
        {
          this.props.fakeData.fetching ?
          <h2>Loading...</h2> :
          this.props.fakeData.response.map(item => <p>{item.title}</p>)
        }
      </div>
    );
  }
}


function mapStateToProps(state) {
  console.log(state);
  return {
    fakeData: state.fakeData
  };
}

function mapDispatchToProps(dispatch) {
  return {
    actions: bindActionCreators(actionCreators, dispatch)
  };
}


export default connect(mapStateToProps, mapDispatchToProps)(LandingPage);

Thanks.