Основы Frontend-разработки

1.

Итоговый проект по курсу
«Основы Frontend-разработки»
Выполнил: Нургалеев Р.Р.

2.

Цель и задачи проекта: демонстрация знаний и
навыков полученных при обучении
Стек технологий и знаний
примененных в проекте:
HTML, CSS, JavaScript,
React, Redux

3.

Задание:
Реализовать веб-приложение (сайт), содержащее следующие страницы:
1. Главная страница со списком товаров (карточек), содержащих
изображение, заголовок, описание и кнопку действия, реализующую
механизм добавления или исключения товара из списка покупок.
Реализация поиска товаров по наименованию и категории.
2. Страница товара – содержащая фотографию, название и описание
товара, а также содержащая кнопку действия
3. Страница корзины – содержащая список товаров (карточек) с
изображение и наименованием товара, а также предоставляющая
возможность управления списком приобретаемого товара
4. Страница обратной связи предоставляющая возможности создания
сообщения для службы поддержки.

4.

Дополнительные возможности
реализованные в проекте
• Реализация механизма управления количеством
приобретаемого товара и контроля количества и стоимости
приобретаемого товара.
• Использование Redux и localStorage для хранения данных
приложения.

5.

Элемент интерфейса приложения:
страница авторизации
• Логин – email
• Пароль - password

6.

Элемент интерфейса приложения:
каталог товаров
• добавление/удаление
товара к списку покупок, к
списку избранного
• реализация поиск товаров и
фильтрация по категориям
• счетчик состояния корзины,
избранного

7.

Элемент интерфейса приложения:
карточка товара
• подробная информация о
товаре
• добавление/удаление
товара к списку покупок

8.

Элемент интерфейса приложения:
корзина
• управление количеством
приобретаемого товара
• сводная информация о сумме
и количестве приобретаемых
товаров, как вместе, так и
раздельно
• “покупка” товара

9.

Элемент интерфейса приложения:
форма обратной связи
• создание обращения в
службу поддержки
• валидация всех
реализованных полей
• “отправка обращения”

10.

Дополнительные элементы интерфейса :
Реализовать механизм общения с
пользователем, путем различных
уведомлений.

11.

Спасибо за внимание!