Антон Спирин

В целом все правильно. Но можно и по-другому, например, использовать redux и делать запросы в его middleware.

Нет никакого смысла каждый раз создавать новый сервис(new WeatherService). Можно создавать один экземпляр при инициализации. А вообще нет особого смысла описывать его в виде класса.

Все зависит от проекта. Для каких-то create-react-app хватает с головой. Для каких-то пишут свои сборки или используют сторонние библиотеки вроде next.js.
Если под CDN вы имели ввиду UMD модули, то их мало кто использует в проектах.

В документации есть ответы на все ваши вопросы.
Redux: Immutable data
Redux: Immutable update patterns

Не передаете в connect аргумент mapStateToProps.

По-хорошему компонент breadcrumbs должен получать массив элементов вида:

const breadCrumbsItems = [
  {
    title: 'Home',
    path: '/',
  },
   {
    title: 'Products',
    path: '/products',
  },
  {
    title: 'Iphone 6s Black',
  },
];

и строить хлебыные крошки. Это все. Никаких деталей реализации вашего приложения этот компонент знать не должен. И уж тем более не должен инициировать никаких AJAX запросов.

Весь интерфейс:
<BreadCrumbs items={breadCrumbsItems} />
c отрисовкой массива элементов с помощью map:

<Wrapper>
  {items.map((item, i) => (
    <BreadCrumbsItem
      key={item.path}
      active={i === items.length - 1}
      path={item.path}
    >
      {item.title}
    </BreadCrumbsItem>
  )}
</Wrapper>

или:

<BreadCrumbs>
  <BreadCrumbs.Item path="/">Home</BreadCrumbs.Item>
  <BreadCrumbs.Item path="/products">Products</BreadCrumbs.Item>
  <BreadCrumbs.Item active>Iphone 6S Black</BreadCrumbs.Item>
</BreadCrumbs>

react-redux 7 использует Hooks API. Ваша версия react-native использует react 16.6, а он Hooks API еще не поддерживает.
Вам следует либо обновить react-native до 0.59, либо использовать react-redux 5

Любой. Если нужен SSR, то можно использовать отдельный backend на node.js.

React Router: Testing
Redux: Writing tests. Connected Components

У вас в browserlist в package.json поддержка только крайних версий chrome, ff и safari для development режима.
В production версии стрелочных функций не будет, но для поддержки IE надо дополнительно поставить полифилл.
Документация.

babel, babel-loader и пресеты удалите.

toggleClass = className => {
  this.setState(state => ({
    panelClassesActive: {
      ...state.panelClassesActive,
      [className]: !state.panelClassesActive[className],
    },
  }));
};

Хотя бы так

Композиция и инверсия зависимостей:

class SomePage extends React.Component {
  componentDidMound() {
    this.props.fetchSomeData();
  }

  handleSomeEvent = () => {
    doSomething();
  };

  render() {
    const { data } = this.props;

    return <SomeCommonComponent data={data} onSomeEvent={this.handleSomeEvent} />;
  }
}

class SomeOtherPage extends React.Component {
  componentDidMound() {
    this.props.fetchSomeOtherData();
  }

  handleSomeEvent = () => {
    doSomethingOther();
  };

  render() {
    const { data } = this.props;

    return <SomeCommonComponent data={data} onSomeEvent={this.handleSomeEvent} />;
  }
}

if (!modal.contains(event.target)) {
  this.props.closeModal();
}

Элемент по-хорошему получать через ref.

Можно использовать метод жизненного цикла componentDidMount:

class CalendarDay extends Component {
  state = { data: [] };

  comonentDidMount() {
    // тут делаем запрос к БД и передаем данные в состояние
  }
  // ...
}

Консоль отображает массив по состоянию на текущий момент. Во время вызова конструктора данных там еще нет. Чтобы в этом убедиться достаточно изменить вызов на:
console.log(JSON.stringify(db));

проблема в том что сейчас есть инфа по всем годам например. ткунули в год, подложили другую сущность, котрая благополучно храниться в памяти и опля. Когда там этого дела не будет, нужно чтобы ссылка запускала фетч.

Проблема вообще не проблема. Изменить придется 3-4 строчки

подкладывать промисы в котрых ифить если есть отдать если нет, сходить туда то? тут я получиться скорее всего намешаю заные архитектурные слои в кучу

Можно использовать redux или mobX.

как рендерить в асинхронном режиме? в англяре был async pipe . как это сделать в рекате чтобы на неделю не улететь в оверинженирирг не знать.

Ключи состояния загрузки, условный рендерниг.
Простой пример:

class Example extends React.Component {
  state = { isFetching: false, error: null, data: [] };
  
  // ...
  
  render() {
    if (isFetching) return <Preloader />;
    if (error) return <Error error={error} />;
    
    return data.map(/ ... /); 
  }
}

Как правильно и корректно делать релейшены сущностей?

Можно передавать с бэкенда передавать все связанные данные с результатами запроса:

{
  posts: [],
  linked: {
    comments: {},
    users: {},
    tags: {}, 
  },
}

Вообще вам прежде чем приступать к разработке стоит изучить документацию React. Там же можно пройти tutorial. Почитать немного про экосистему, про state management библиотеки вроде redux и mobX.

export default reduxForm({ validate })(ChatForm);

<ChatForm form={name} />

Если хочется передавать имя свойством name, то можно обернуть компонент в connect:

const mapStateToProps = (state, ownProps) => ({
  form: ownProps.name,
});

export default compose(
  connect(mapStateToProps),
  reduxForm({ validate }),
)(ChatForm);

<ChatForm name={name} />

Вам хватит одного роута:

<Route path="/some-path/:color" component={SomeComponent} />

Параметр color можно получить в компоненте как this.props.match.params.color:

class SomeComponent extends React.Component {
  render() {
    const { match, elements } = this.props;
    const { color } = match.params;    

    const filteredElements = elements.filter(el => el.color === color);
    // ...    
  }
}

Используйте методы жизненного цикла:
componentDidMount для инициализации,
componentDidUpdate для повторной инициализации,
shouldComponentUpdate для препятствия ненужным перерисовкам.

let attachment, date, time;

if (hasAttachments) {
  const attachmentsList = attachments.filter(a => a.use_as_featured === 1 );
  attachment = attachmentsList[0];
  const dateTime = attachment['updated_at'].split(' ', 2);
  date = dateTime[0];
  time = dateTime[1];
}