Все еще очень актуально. Спросите себя: «Не становится ли управление состоянием слишком сложным, и мне приходится передавать состояние через компоненты, которые не используют его слишком часто?» Если это так, используйте redux. Нет? В этом нет нужды.

Преимущества заключаются в том, что он упрощает код и работу с передаваемым состоянием.

Redux по-прежнему актуален, но некоторые варианты использования были заменены.

Пример использования: кеширование HTTP-ответов

Теперь мы можем использовать ReactJS Context API. Для тех, кто использует GraphQL, также Клиент Apollo выполняет кеширование.

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

Опять же, теперь мы предпочитаем использовать для этого ReactJS Context API.

Глобальное и локальное состояние

В ReasonML / ReasonReact будущее ReactJS, редукторы встроены в компоненты, но на уровне компонентов. По умолчанию нет глобального состояния.

Redux - это, по сути, JavaScript-реализация Вяз архитектура, которая использует глобальное состояние (и, безусловно, работает).

Тестируемость

Для меня причина использования Redux - возможность тестирования.

Because most of the Redux code you write are functions, and many of them are pure, they are easy to test without mocking.

источник

Начальная загрузка

Facebook только что выпустил create-react-app версии 2.

https://github.com/facebook/create-react-app/releases

Проверьте это!

Маршрутизация

Используйте React Router

ОТДЫХАТЬ

GraphQL довольно популярен среди сообщества ReactJS. TL; DR заключается в том, что в основе React лежит способность размещать все компоненты разметки, стилей и поведения. С GraphQL мы также можем размещать данные компонента. Крис Туми сделал отличный доклад на эту тему на недавней конференции ReactBoston, которая выйдет на Youtube в течение следующих недель или двух.

Если вы хотите использовать REST, вы можете использовать Context API для кеширования любых ответов.

1-я выгода: с Redux - вы можете получить доступ к состоянию из каждого компонента в вашем приложении. без Redux вам нужно связать состояние в качестве реквизита от родительского к дочернему, проблема в том, что слишком много цепочек, сложно понять код. Например:

//Trying to pass the state of FirstComponent as props to ThirdComponent

class FirstComponent extends React.Component {
    state = {
        firstComponentState: 'some value'
    }

    render() {
        return (
            <SecondComponent 
                firstComponentState = {firstComponentState}
            />
        )
    }
}


const SecondComponent = (props) => (
        <ThirdComponent 
            firstComponentState = {props.firstComponentState}
        />
)

const ThirdComponent = (props) => (
    <div>{props.firstComponentState}</div>
)

Если ThirdComponent нуждается в доступе к состоянию FirstComponent - нам нужно связать состояние от родительского к дочернему, пока оно не достигнет желаемого компонента. как теперь будет выглядеть наш код, если нам нужно связать состояние на 10 уровней ниже? это будет очень трудно понять. но с Redux - все, что нам нужно сделать, это подключить ThirdComponent к глобальному состоянию redux и использовать его.

** 2-е преимущество: * Передача состояния между братьями и сестрами. рассмотрите этот код:

//Trying to pass the state of FirstSibling to SecondSibling

const Parent = () => (
    <div>
        <FirstSibling/>
        <SecondSibling/>
    </div>
)

class FirstSibling extends React.Component {
    state = {
        data: 'pass me to SecondSibling'
    }

    render() {
        return (
            <div>Something..</div>
        )
    }
}

const SecondSibling = () => (
    <div>I need the state of FirstSibling</div>
)

Без Redux, как мы можем передать состояние компонента FirstSibling компоненту SecondSibling? для этого нам нужно передать состояние на один уровень выше - от FirstSibling к Parent, а от Parent нам нужно связать его с SecondSibling. не рекомендуется связывать реквизиты от детей к родителям. Теперь представьте, что у FirstSibling и SecondSibling есть дочерние элементы, и мы хотим передать состояние между ними - код становится нечитаемым. но опять же, с Redux - все, что нам нужно сделать, это подключить нужный компонент к глобальному состоянию и напрямую получить данные.