https://github.com/vwebio/pizza-go

Сайт для заказа пиццы
https://github.com/vwebio/pizza-go

css3 fetch-api html5 javascipt

Last synced: 19 days ago
JSON representation

Сайт для заказа пиццы

• Host: GitHub
• URL: https://github.com/vwebio/pizza-go
• Owner: vwebio
• Created: 2024-09-09T14:23:32.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-09-14T09:54:07.000Z (4 months ago)
• Last Synced: 2024-11-09T12:39:10.623Z (2 months ago)
• Topics: css3, fetch-api, html5, javascipt
• Language: JavaScript
• Homepage: https://vwebio.github.io/Pizza-Go
• Size: 928 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.MD

Awesome Lists containing this project

README

        
# Описание проекта "Go-Go Pizza"

## Общее описание

Проект "Go-Go Pizza" представляет собой веб-сервис доставки пиццы. Веб-сайт включает в себя функционал для выбора пиццы, добавления топпингов, просмотра корзины и оформления заказа.

## Структура проекта

### `index.html`

Основной HTML-файл проекта, который включает в себя структуру веб-страницы. Содержит заголовок, основное содержимое и подвал. Подключает внешние стили, шрифты и JavaScript-файлы для добавления интерактивности.

### `main.js`

Основной JavaScript-файл, который инициализирует все необходимые модули и функции для работы веб-страницы. Импортирует модули для управления модальными окнами, рендеринга пицц и топпингов, а также взаимодействия с API.

### `toppingsToggle.js`

Файл, содержащий функцию `toppingsToggle`, которая управляет отображением списка топпингов. Добавляет обработчик клика по кнопке выбора топпинга, который открывает или закрывает список топпингов с плавной анимацией.

### `serviceApi.js`

Файл, содержащий функцию `getData`, которая отвечает за получение данных с сервера через API. Использует `fetch` для отправки HTTP-запросов и обрабатывает возможные ошибки. Управляет отображением лоадера (загрузчика).

### `renderToppings.js`

Файл, содержащий функцию `renderToppings`, которая отвечает за рендеринг списка топпингов на веб-странице. Получает данные о топпингах с сервера и создает элементы списка для каждого топпинга. Управляет выбором топпингов и рендерингом пицц с учетом выбранных топпингов.

### `renderPizzas.js`

Файл, содержащий функцию `renderPizzas`, которая отвечает за рендеринг списка пицц на веб-странице. Получает данные о пиццах с сервера и создает карточки пиццы для каждой пиццы. Управляет открытием модального окна с информацией о пицце при клике на кнопку "Выбрать".

### `renderModalPizza.js`

Файл, содержащий функцию `renderModalPizza`, которая отвечает за рендеринг модального окна с информацией о выбранной пицце. Создает элементы для отображения изображения пиццы, названия, цены, размера и типа теста. Управляет добавлением пиццы в корзину и отображением кнопки сброса фильтра.

### `modalController.js`

Файл, содержащий функцию `modalController`, которая отвечает за управление модальными окнами. Управляет открытием и закрытием модальных окон, анимацией появления и исчезновения, блокировкой и разблокировкой прокрутки страницы, а также вызовом функций обратного вызова при открытии модального окна.

### `modalCartController.js`

Файл, содержащий функцию `modalCartController`, которая отвечает за управление модальным окном корзины. Рендерит список товаров в корзине, управляет удалением товаров, переходом между блоками и отправкой заказа на сервер.

### `helper.js`

Файл, содержащий вспомогательные функции для упрощения и улучшения кода. Включает функции для преобразования первой буквы строки в верхний регистр, создания радио-кнопок и меток.

### `cartControl.js`

Файл, содержащий объект `cartControl`, который отвечает за управление корзиной. Включает методы для добавления, удаления и очистки товаров в корзине, а также сохранение данных корзины в `localStorage`.

### `scrollController.js`

Файл, содержащий объект `scrollController`, который отвечает за управление прокруткой страницы. Включает методы для отключения и включения прокрутки, сохранения текущей позиции прокрутки и восстановления её после разблокировки прокрутки.

## Оптимизация изображений

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