Глава 2. Реализация веб-приложения
2.1 Выбор средств реализации веб-приложения
Для реализации веб-приложения "Ride rent" были выбраны следующие средства:
HTML (HyperText Markup Language) используется для создания структуры веб-страниц, включая разметку контента.
CSS (Cascading Style Sheets) применяется для стилизации веб-страниц, включая оформление текста, изображений, расположение элементов и т.д.
JavaScript используется для создания интерактивности на веб-страницах, таких как динамические эффекты, анимации, валидация форм, обработка событий и многое другое.
Usbwebserver - это локальный веб-сервер, который обычно используется для разработки и тестирования веб-приложений на локальной машине. Он включает в себя веб-сервер Apache, базу данных MySQL и PHP, что позволяет создавать и запускать динамические веб-сайты и приложения.
Sublime Text - это текстовый редактор с широкими возможностями настройки и поддержкой множества плагинов, что делает его популярным средством для разработки веб-приложений. Он обеспечивает удобную среду для написания кода на различных языках программирования, включая HTML, CSS и JavaScript.
phpMyAdmin - это инструмент управления базами данных MySQL через веб-интерфейс. Он предоставляет возможность создавать, изменять и управлять базами данных и их содержимым, а также выполнять различные операции с данными, такие как запросы, импорт и экспорт данных и многое другое.
Эти средства обеспечат базовый набор функциональности для создания веб-приложения "Ride rent".
2.2 Описание структуры и архитектуры веб-приложения
Ниже представлено исследование структуры основных страниц веб-сайта для проката велосипедов. Рассматриваются главная страница, страница каталога велосипедов, страница регистрации и страница поддержки. Каждая из них анализируется с учетом функциональности, дизайна и целевой аудитории, обеспечивая полное понимание основных компонентов и их взаимодействия в рамках общей концепции веб-приложения.
Главная страница (main.php):
Шапка (header.php) - меню навигации, которое включает ссылки на разделы сайта, такие как "Главная", "Каталог" и "Поддержка".
Приветственное сообщение и краткий обзор велосипедов проката.
Форма для быстрого бронирования оборудования
Интерактивная карта
Подвал (footer.php) - дополнительная навигация, полезные ссылки и контактная информация для быстрого доступа.
Каталог (catalog.php):
Шапка (header.php)
Заголовок страницы «Каталог»
Каталог велосипедов с описанием каждой модели, включая характеристики, фотографии и цены.
Возможность фильтрации велосипедов по размеру рамы велосипеда.
Подвал (footer.php)
Поддержка (support.php):
Шапка (header.php)
Заголовок страницы «Поддержка»
Описание услуги поддержки - краткое описание услуг, предоставляемых на странице поддержки.
Форма обратной связи - возможность задать вопрос с помощью формы обратной связи, включая поля для ввода имени, адреса электронной почты, темы и текста сообщения.
Подвал страницы (footer.php)
Регистрация/авторизация (login_form.php)
Шапка (header.php)
Форма входа
Форма регистрации
Подвал страницы (footer.php)
Личный кабинет – пользователя (dashboard.php)
Шапка (header.php)
Приветствие пользователя
Информация о пользователе: выводится информация о скидке, если таковая имеется
Выход из учетной записи
Прокаты пользователя: выводится таблица с информацией о каждом прокате.
Подвал страницы (footer.php)
Личный кабинет – админ
Шапка (header.php)
Показывается форма для заполнения данных о новом велосипеде
Таблица со списком велосипедов
Подвал страницы (footer.php)
Исследование структуры веб-сайта для проката велосипедов показывает четко выстроенную и удобную для пользователей структуру (рис. 2.1-2.9).
Рисунок 2.1 – Структура веб-приложения
Рисунок 2.2 – Архитектура веб-приложения
Рисунок 2.3 – Архитектура основных режимов работы сайта
Рисунок 2.4 – Работа с каталогом
Рисунок 2.5 – Регистрация
Рисунок 2.6 – Работа с бронированием
Рисунок 2.7 – Авторизация пользователя
Рисунок 2.8 – Работа с поддержкой
Рисунок 2.9 – Авторизация администратора
Каждая страница, включая главную, каталог велосипедов и страницу поддержки, обеспечивает эффективное взаимодействие с пользователем. Постоянство навигации и организованная структура файлов подчеркивают тщательное проектирование приложения.