So far, Redux hasn't made my life easier. Every time I add a component, I seem to unnecessarily create three files (action, constants, reducer) and think harder than necessary. But I believe there must be a clear advantage of using Redux that I am blind to. Let me take you to the following example.
Expected behavior:
The user can choose multiple items and add them to a shopping cart (POST to backend).
JQuery
This is what I naturally resort to, but I feel like I am doing it wrong if I use plain jQuery. Should I feel this way?
$(function() {
$(".item").click(function(event) {
$(event.target).toggleClass("selected");
}
$("button.submit").click(function() {
var selectedItems = $(".item.selected");
var itemIds = $.map(selectedItems, function(item) { return $(item).data("id") });
$.post(some_url, {itemsToAdd: itemIds});
});
In React
I would do something like following:
ItemsContainer
state: selectedItems
functions: addItem, removeItem, saveCart
Item
state: isSelected
props: addItem, removeItem
In Redux
How can I do the same more easily? Maybe I shouldn't store selectedItems
as a state inside ItemsContainer
and inside a globalState?