Поздравляю всех с 2025 годом. Всем успехов и хорошо отдохнуть. Удачи в новом году😉. С праздником❄️☃️

Контент будет в скором времени. Добавляю фичу с выбором количества товара, трудность лишь граммотно отрендерть компетентны(учитывая, что количество не может быть <= 0)

Решил полностью удалить node js и установить заново. Столкнулся с новой проблемой(второй скрин).Частая проблема при установке node js.         Фиксится через PowerShell вот этой командой:

Set-ExecutionPolicy Unrestricted -Scope CurrentUser

    После произвел "npm update" и все проблемы исчезли и проект запустился.
   Убрал старый код с useState и начал писать на Redux.
    Впервые попробовал TypeScript для типизация данных. Не очень легко и не слишком сложно, но можно запутаться.
     Также узнал, что useEffect и useReducer используется для управления внешними приложениями(например, Redux), чтобы передать новое значение в хранилище.
      В целом счетчик получился, но работает немного ни как надо. Изменяет количество товара сразу у всех товаров, а нужно у одного, но вполне вероятно это связано из-за метода map(), но это уже совсем другая история)

Телеграмм не дает отправить все одним сообщением, поэтому так 🤷

Кайф сидеть третий час с одной ошибкой и не понимать что не так🫠

ДЕНЬ 119
После того как возникла ошибка, не нашёл решения как откатится до предыдущего коммита. Переписал немного функционал сделал всё через Reduix Toolkit, он попроще в плане синтаксиса в отличии от того, что было. В целом всё получилось сделать почитав документацию. Ошибки были, но всё фиксилось череp gpt.
Но всё же не получил желаемого результата. Хотел реализовать изменение количества товара в соответствующей карточке через айдишник продукта и пропсами прокинуть к импуту где изменяется число, не получилось.
Если у кого есть идеи как это можно реализовать, то комментарии приветствуются или чатик(в него можно вступить, если зайти в коммы)

ДЕНЬ 120
     Наконец-то добился желаемого результата. Теперь количество товара отображается у конкретного продукта.
      Было несколько ошибок по хранилищу. Не получалось взять конкретные значения по типу айдишника товара и прочей инфы. Ошибка заключалась в неправильной записи createSlice и Reducer. Так как .reducer используется для обратки действий в slicе, то его необходимо записывать в reducer
    Пример:

export const store = configureStore({
  reducer: {
    products: productSlice.reducer
  }
})

     На практике понял , что просто так через useSelector не получится взять из store данные массива. Для этого потребуется метод map

ДЕНЬ 121
    Сделал отображение компонента в зависимости от значения количества в store. + немного стилизировал  компоненты

ДЕНЬ 122
    Сделал открытие корзины и закрытие через кликание по кнопке или заднему фону.
   Использовал порталы реакта для простоты создание наложения корзины.
   По уму надо было сделать состояние рендера корзины через Redux или Context. Для быстроты сделал через пропсы, заодно больше разобрался в компонтах.
   P.S: Потом конечно переделаю под Redux состояние

ДЕНЬ 123
Сделал функционал корзины, неполностью конечно еще есть над чем поработать.
Начал лучше понимать функционал Redux, ошибки были, но зачастую все фиксились через откалду с помощью консоли.

ДЕНЬ 124
Добавил подсчёт количества товаров, а так же их сумму. Добавил отображения количества у каждого товара. Пробовал сделать отображения суммы у самих товаров, но не вышло. Изначально подсчитывало цену всех товаров, затем undefined, пробовал брать значения через пропсы и перемножать, но не получилось, также через useSelector брать значения, тоже бестолку. Есть идея попробовать сделать это в store

ДЕНЬ 125
Исправил ошибку с выводом суммы товара + добавил удаление из корзины.

ДЕНЬ 126
Добавил функцию подсчета товаров в самой корзине, но она пока работает коряво, информация обновляется, если закрыть и снова открыть окно корзины. Пробовал многими способами сделать эту фичу.
То неправильно элементы рендерились( у меня было два map. Один рендерил компонент, а другой все элементы в компоненте), то коряво написан redux. И прочие мелочи связанные с синтаксисом.
Также изменил логику отображения элементов в компоненте. До этого информация перекидывались с props , а теперь берется с Redux

ДЕНЬ 127
Теперь все работает как и хотелось. Заменил дивчики на input, иначе значения обновлялись лишь при рендере компонента (открытии корзины).
Единственное, что не получилось реализовать, так это изменение ширины инпута в зависимости от длины значений. Идея в чем, получать длину всех значений и менять на подходящию ширину, что бы не оставалось лишнего пространства между элементами. Длину вытащить получилось, а вот записать изменение ширины на react не вышло.
По итогу задал ширину как константа и выравнивание по правому краю

Если кто использовал redux persist, то была ли у вас проблема с его установкой и установкой зависимостей? У меня при установке redux persist были недоустановлены некоторые зависимости. Доутсановил все ок, но live server не работает. Запускается, но не прогружает сайт, выдает ошибку(на скрине)👆

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

ДЕНЬ 128
Добавил сохранение товаров из корзины в localstorage, теперь при перезагрузке страницы товары остаются в корзине.
Очень долго пытался сделать эту фичу, изначально хотел реализовать это с помощью redux persist. При установке ругался на недоустановленные пакеты. Обновлял все зависимости, был вариант установить более старую версию node, но тоже гиблая тема, пришлось бы также кучу всего устанавливать и менять. Поэтому понял, что redux persist это мертвая библиотека, так как последнее обновление у них было в октябре 2021 года. В итоге, решил делать без него через redux.
Функцию удаления и добавления в локалу было сделать легко, а вот чтения... Пришлось сильно помучаться с этим. Просто через useEffect чтение не получалось, добавил состояние(если в локалке есть ключ, то значение состояние true, если нет то false) и в зависимости от значения элементы будут рендерться, но и это не получилось. Решил попробовать через экшен в redux, затем использовать его через dispatch в useEffect.