Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/elrouss/react-burger
Сайт межгалактической космической закусочной с возможностью оформления заказов и отслеживания их истории в личном кабинете
https://github.com/elrouss/react-burger
cypress jest react react-router-dom redux typescript websocket yandex-practicum
Last synced: about 1 month ago
JSON representation
Сайт межгалактической космической закусочной с возможностью оформления заказов и отслеживания их истории в личном кабинете
- Host: GitHub
- URL: https://github.com/elrouss/react-burger
- Owner: elrouss
- Created: 2023-05-23T20:21:34.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-12-19T04:06:57.000Z (about 1 year ago)
- Last Synced: 2024-12-10T20:37:35.618Z (about 2 months ago)
- Topics: cypress, jest, react, react-router-dom, redux, typescript, websocket, yandex-practicum
- Language: TypeScript
- Homepage:
- Size: 5.05 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Учебный проект: "Stellar Burgers"
Оглавление
- Описание проекта
- Стек технологий
- Установка и запуск приложения в локальном репозитории
- Процесс создания
- Функционал
- Статус
1. Описание проекта
"Stellar Burgers" - приложение (SPA) с регистрацией и авторизацией пользователей, в котором можно собрать и заказать свой личный бургер (без доставки на дом). Выполнен в рамках углубленной образовательной программы по библиотеке "React" Яндекс Практикума.
Ссылки на проект
Макет:
https://www.figma.com/file/zFGN2O5xktHl9VmoOieq5E/React-_-%D0%9F%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%BD%D1%8B%D0%B5-%D0%B7%D0%B0%D0%B4%D0%B0%D1%87%D0%B8_external_link?node-id=0%3A1
Чек-листы:
https://code.s3.yandex.net/react/checklists-pdf/checklist-1.pdf
https://code.s3.yandex.net/react/checklists-pdf/checklist-2.pdf
https://code.s3.yandex.net/react/checklists-pdf/checklist-3.pdf
https://code.s3.yandex.net/react/checklists-pdf/checklist-4.pdf
https://code.s3.yandex.net/react/checklists-pdf/checklist-5.pdf
* - проект прошел код-ревью
3. Установка и запуск приложения в локальном репозитории
1. `git clone https://github.com/elrouss/react-burger.git` - клонировать репозиторий (HTTPS)
2. `npm i` - установить зависимости (предварительно проверить наличие Node.js командой `node -v`, а также - NPM командой `npm -v`; в случае необходимости скачать и установить Node.js по этой ссылке)
3. `npm run prepare` - установить husky
4. `npm run start` - запустить приложение
4. Процесс создания
Работа разделена на 6 этапов. Выполнены следующие:
1. Верстка на десктоп (`1920px`);
2. Перенос проекта на Redux Toolkit и написание бизнес-логики (см. функционал)
3. Добавление роутов
4. Переписывание проекта на TypeScript
5. Завершение бизнес-логики приложения: подключение ленты заказов с помощью WebSocket
5. Функционал
- Регистрация и авторизация пользователей, восстановление пароля
- Редактирование личных данных
- Drag and Drop (перенос ингредиентов в конструктор с возможностью внутренней сортировки и удаления ненужных)
- Счетчики ингредиентов и цены
- Подсветка активных табов в списке ингредиентов при скролле
- Открытие и закрытие модальных окон по кнопке, оверлею и клавише `Escape` с сохранением открытого состояния после обновления страницы (также открытие информации об ингредиенте на отдельной странице при копировании ссылки в адресную строку новой вкладки/нового окна браузера)
- Лента заказов, обновляющаяся в режиме реального времени
6. Статус
На этапе разработки
Требуется улучшить:
- Выведение ошибок с сервера под инпутами в формах
- Оптимизация ререндеров (на данном этапе функционал компонентов постоянно меняется, поэтому логично выполнить задачу на финальном этапе проекта)
