aphows

Redux используется как хранилище для данных, то есть ваша задача получить данные, обработать их, а потом занести их в state. Дальше можно использовать эти данные уже во вьюхах в обработанном виде.
Асинхронность реализуется через middleware, самый распространенный - redux-thunk от gaeron. Он позволяет возвращать из экшна не объект, а функцию, в которую передастся dispatch, и через который можно будет вызвать изнутри этой функции другие экшны.

import convert from 'xml-js'; // https://www.npmjs.com/package/xml-js

class apiClient {
    get(url) {
        return Promise.resolve(/* do something async */)
    }
}
// actions
export function getData() {
    return (dispatch, getState) => {
        dispatch({
            type: 'data/LOAD_STARTED',
        });
        apiClient.get('/api')
            .then((response) => {
                const data = convert.xml2json(response.data, {compact: true, spaces: 4});
                dispatch({
                    type: 'data/LOAD_SUCCESS',
                    payload: data
                })
            })
            .catch((e)=> {
                dispatch({
                    type: 'data/LOAD_ERROR',
                    payload: e,
                })
            });
    }
}

Кнопка не работала из-за того, что ее бинд на событие "клик" находился вне document ready, то есть элемента dom модели в тот момент, когда вы произвели бинд, не существовало. Небольшой и на скорую руку рефактор кода чуть ниже. Учитесь делать ваш код модульным и читабельным, если не можете построить архитектуру в соответствии с ООП - хотя бы группируйте код, оборачивайте в функции, как показано ниже. Ну и не забывайте о простом правиле: привязку событий (bind events) проводить в document ready. Клон кода на codepen

$(document).ready(function() {
  slider();
  mobileMenu();
  scrollToId();
  showContentOnScroll();
  contentMenu()
});

function slider() {
  $('.sm_slider').smSlider({
    duration: 1500,
    autoPlay: true,
    delay: 20000,
    hoverPause: false
  });
}

function mobileMenu() {

  var touch = $('.menu-bar li:first-child  a');
  var menu = $('.sub-menu-bar-1');

  touch.on('click', function(e) {
    /*    У вас было:  $(touch).on('click', function(e) {
      touch - уже объект jquery, его не нужно оборачивать в конструкцию $()
     если touch - строка, тогда его нужно обернуть в $(), если вы хотите применять функции jquery
     Пример:
     var touch = '.menu-bar li:first-child  a';
     $(touch) - объект jquery
     
     Хорошая практика  - называть переменные, которые являются объектами jquery, по принципу $var, так легче читать код вам и вашим коллегам
     $touch = $('.menu-bar li:first-child  a');  // объект
     touch = '.menu-bar li:first-child  a'; // строка
     $(touch) // объект jquery
     
    */
    e.preventDefault();
    menu.slideToggle();
  });
}

function scrollToId() {
  $('a[href*=#]').click(function() {
    $("html:not(:animated),body:not(:animated)")
      // что значит псевдокласс :animated ?  я такого не знаю
      .animate({
        scrollTop: $($(this).attr("href")).offset().top
      }, 2000);
    return false;
  });
}

function showContentOnScroll() {
  $(window).scroll(function() {
    var bo = $("body").scrollTop();
    if (bo > 990) {
      $(".cont").css("display", "block");
    } else {
      $(".cont").css("display", "none");
    };
  });
}

function contentMenu() {
  $('.cont').click(function() {
    $(".cont").toggleClass('rotate-m');
    $(".menu-link").toggleClass('close');
    $(".menu").toggleClass('rigth-m');
  });
}