Теги: React.js
30.01.2022
Теперь займемся личным кабинетом. Здесь много что можно сделать — история заказов в магазине, профили для удобного оформления, изменение пароля, избранные товары. Но мы ограничимся только историей заказов — а то конца и края не видно с этим магазином. Для начала добавим маршруты для просмотра списка заказов и отдельного заказа…
14.01.2022
Как-то совсем упустил работу с заказами. Нам нужно на сервере создать две таблицы базы данных, создать маршруты и классы контроллера и модели. Потом протестировать все http-запросы — на создание заказа администратором и обычным пользователем, на получение списка всех заказов и одного заказа администратором и пользователем.
06.01.2022
У первого способа есть существенный недостаток — нельзя поделиться ссылкой. То есть, пользователь зашел на наш сайт, выбрал категорию и бренд, перешел на вторую страницу, увидел что-то интересное — и решил поделиться ссылкой. Но эта ссылка будет иметь вид http://server.com — нет выбранной категории, выбранного бренда…
05.01.2022
Теперь самая главная часть магазина — каталог товаров на главной странице. Нам надо создать хранилище товаров с использованием MobX. Организовать загрузку с сервера списка категорий, брендов и товаров. Наконец, фильтровать список товаров при клике на категорию и/или бренд.
29.12.2021
Библиотека axios позволяет перехватывать все запросы и ответы и применять к ним определенную логику. Нам нужны два экземпляра axios — для запросов на сервер от любого посетителя сайта и для запросов от авторизованного пользователя. Создаем директорию src/http и внутри нее — файл index.js.
24.12.2021
Теперь будет немного верстки — нам нужно создать все страницы приложения. Для начала страницы ренистрации и авторизации, которые будут очень похожи. Потом главную страницу магазина со списком всех товаров каталога. Наконец, страницу просмотра одного товара и страницу корзины покупателя.
23.12.2021
Хук useSearchParams предназначен для чтения и изменения строки запроса в URL для текущего маршрута. По аналогии с хуком useState возвращает значение и функцию для изменения этого значения. Значение — это объект URLSearchParams, у которого множество методов для работы с GET-параметрами (get, set, getAll, has, append, delete, …).
22.12.2021
Хук useHistory был удален из React Router 6, теперь вместо него
useNavigate. В принципе, использование этих двух хуков мало чем отличается. Хук возвращает функцию, которая в качестве первого аргумента принимает строку URL или целое число. Целое число может быть положительным (движение вперед по истории)… 
21.12.2021
Давайте вместо простого компонента Blog.js создадим в директории src/blog несколько других — BlogLayout.js, BlogIndex.js, BlogCategory.js и BlogArticle.js. Кроме того, создадим файл с данными BlogData.js, где будем хранить категории и статьи блога. Но для начала изменим компонент App.js…
20.12.2021
Совсем недавно разбирался с роутингом в react-приложениях, но вышла 6 версия модуля react-router-dom — и пришлось разбираться заново. В новой версии больше нет Switch, теперь нужно использовать Routes, вместо атрибута component внутри Route теперь атрибут element. Атрибуты path и to внутри Route и Link теперь могут быть относительными…