ReactJS + Spring Boot 2 FullStack пиложение, как разобрать

Хочу научиться делать фронтенд для Rest Api приложений. Выбрал React. Много слишком разных примеров в интернете, и все очень слабо и мало объясняют, и в основном даже не полностью все показывают. В основном все примеры где клиент и сервер написаны в одном проекте, тоесть создается проект бекенда и в нем же проект фронтенда. Но я нашел пример как можно делать 2 совершенно отдельных приложения, которые между собой общаются. В этом примере в React проекте создается backend.js файл, в котором некая конфигурация.

const url = 'http://localhost:8080';
let token = localStorage.token;
if (!token)
  token = localStorage.token = Math.random().toString(36).substr(-8);
const headers = {
  'Accept': 'application/json',
  'Authorization': token,
    'Content-Type': 'application/json',
    'X-Requested-With': 'XMLHttpRequest'
};
export const getJson = () => {
    return fetch(`${url}/hello`, {headers})
        .then(res => {
             return res.json()
        })
        .then(data => {
            console.log(data);
            return data.message;
        });
};

можно ли считать, что это стандартный файл конфигурации и его не нужно изменять для других проектов?(кроме ситуации с другим портом сервера) есть App.js:

    import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import * as Backend from './service/backend.js';
class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            greetings : ''
        }
    }
    componentDidMount() {
        console.log('componentDidMount');
        Backend.getJson().then(response => {
            this.setState({
                greetings: response
            })
        })
    }
  render() {
    return (
      <div className="App">
        <div className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h2>Welcome to React and Spring</h2>
        </div>
        <p className="App-intro">
          Getting a message from the server :  {this.state.greetings}
        </p>
      </div>
    );
  }
}
export default App;

и хотелось бы понять, что происходит в этом коде. В бекенде контроллер возвращает обычный объект с String полем. При этом я пытался переделать контроллер, который возвращает обычную строку, а не объект - не рендерило на страницу то, что должен вернуть контроллер(правильно ли я выразился в этом случае - не знаю).

Так же в бекенде есть конфиг класс:

@Configuration
public class CorsConfig {
    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurerAdapter() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/*").allowedOrigins("http://localhost:3000");
            }
        };
    }
}