Разработка веб - приложения по технологии Landing Page для магазина спортивной одежды

1.

Министерство образования и молодёжной политики Свердловской области
ГОСУДАРСТВЕННОЕ АВТОНОМНОЕ ПРОФИССИОНАЛЬНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧЕРЕЖДЕНИЕ СВЕРДЛОВСКОЙ ОБЛОСТИ
«ЕКАТЕРИНБУРСКИЙ ТЕХНИКУМ «АВТОМАТИКА»
(ГАПОУ СО «ЕТА «АВТОМАТИКА»)
Разработка веб–приложения по технологии Landing Page для магазина
спортивной одежды
Руководитель:
Н.А. Юрьева
Выполнил: студент группы ИСП 321/2
Г.Б. Косырев
Екатеринбург 2024

2.

СОДЕРЖАНИЕ
1. Введение
2. Анализ предметной области
3. Моделирование основных аспектов приложения
4. Выбор и описание программных средств и среды разработки
реализации сайта
5. Описание используемых языков программирования
6. Описание технологии Landing Page
7. Разработка веб-приложения
8. Тестирование веб-приложения
9. Заключение

3.

ВВЕДЕНИЕ
Курсовой проект по МДК 01.01 «Технология разработки программного
обеспечения» на тему: Разработка веб – приложения по технологии
Landing Page для магазина спортивной одежды «Athletic».
Цели курсового проекта:
1. Выполнить поставленные задачи:
а) Разработка документации курсового проекта.
б) Анализ предметной области.
в) Моделирование основных аспектов приложения, включая
разработку диаграмм, визуально отображающих работу в
предметной области.
г) Разработка прототипа веб-приложения.
д) Разработка кода веб-приложения.
е) Тестирование веб-приложения.

4.

ВВЕДЕНИЕ
2. Закрепить знания по следующим профессиональным
компетенциям:
ВД 5 Проектирование и разработка информационных систем.
ПК 5.1. Собирать исходные данные для разработки проектной
документации на информационную систему.
ПК 5.4. Производить разработку модулей информационной
системы в соответствии с техническим заданием.
ПК 5.6. Разрабатывать техническую документацию на
эксплуатацию информационной системы.
ПК 5.7. Производить оценку информационной системы для
выявления возможности её модернизации.

5.

АНАЛИЗ ПРЕДМЕТНОЙ
ОБЛАСТИ
ДИАГРАММА ПРЕЦЕНДЕНТОВ

6.

АНАЛИЗ ПРЕДМЕТНОЙ
ОБЛАСТИ
ДИАГРАММА АКТИВНОСТИ

7.

МОДЕЛИРОВАНИЕ ОСНОВНЫХ АСПЕКТОВ ПРИЛОЖЕНИЯ
ДИАГРАММА РАЗВЁРТЫВАНИЯ

8.

ВЫБОР И ОПИСАНИЕ ПРОГРАММНЫХ СРЕДСТВ И
СРЕДЫ РАЗРАБОТКИ РЕАЛИЗАЦИИ САЙТА
Валидатор W3C (инструмент для быстрой и удобной проверки HTMLкода)
Diagrams.net (кроссплатформенное приложение для создания
графиков)

9.

ОПИСАНИЕ ИСПОЛЬЗУЕМЫХ ЯЗЫКОВ
ПРОГРАММИРОВАНИЯ

10.

ОПИСАНИЕ ТЕХНОЛОГИИ
LANDING PAGE

11.

ЭТАПЫ РАЗРАБОТКИ ВЕБ ПРИЛОЖЕНИЯ

12.

РЕЗУЛЬТАТЫ РАЗРАБОТКИ ВЕБПРИЛОЖЕНИЯ:

13.

14.

15.

16.

17.

18.

19.

20.

ТЕСТИРОВАНИЕ ВЕБ –
ПРИЛОЖЕНИЯ

21.

ТЕСТИРОВАНИЕ ВЕБ –
ПРИЛОЖЕНИЯ

22.

ТЕСТИРОВАНИЕ ВЕБ –
ПРИЛОЖЕНИЯ
Наименование теста
Ожидаемый результат
Результат теста
При наведении на кнопки
Анимации работают в
Тестирование анимаций кнопок навигации («О нас», «Блог»,
соответствии с ожидаемым
навигации
«Наши преимущества», «Услуги»
результатом
и «Отзывы») они меняют стиль
При
нажатии
на
кнопки
навигации («О нас», «Блог»,
«Номера»,
«Наши
Тестирование якорей кнопок
Якоря работают в соответствии с
преимущества»,
«Услуги»
и
навигации
ожидаемым результатом
«Отзывы»)
пользователь
переходит к соответствующему
блоку
При перемещении по сайту вне
Закрепление блока работает в
Тестирование закрепления блока стандартного отображения блока
соответствии с ожидаемым
навигации
«Nav» он занимает определённое
результатом
место на экране
При нажатии на кнопки-флажки
(«Кофты»,
«Футболки»,
Кнопки-флажки работают в
Тестирование кнопок-флажков, «Штаны», «Кроссовки») список
соответствии с ожидаемым
сортирующих список
товаров добавляет в список или
результатом
убирает
из
него
товары
соответствующей категории

23.

ТЕСТИРОВАНИЕ ВЕБ –
ПРИЛОЖЕНИЯ
Наименование теста
Тестирование числовых полейсчётчиков
Тестирование радиокнопок
Тестирование поля
выбора/набора даты
Тестирование текстовых полей
ввода данных
Тестирование анимации кнопки
отправки заявки
Ожидаемый результат
Устанавливая фокус на полесчётчик можно с клавиатуры
ввести число (от 0 до 100) или
набрать
его
с
помощью
специальных боковых кнопок
При нажатии на радиокнопки
(«Самовывоз» и «Курьером»)
происходит выбор одного из
вариантов и смена стиля кнопки
Устанавливая фокус на поле
выбора даты можно либо
выбрать дату, либо набрать её с
клавиатуры.
Устанавливая фокус на текстовые
поля формы обратной связи
можно ввести в них требуемые
данные
При наведении курсора на
кнопку «Отправить заявку» она
меняет стиль
Результат теста
Поля-счётчики работают в
соответствии с ожидаемым
результатом
Радиокнопки работают в
соответствии с ожидаемым
результатом
Поле выбора/набора даты
работает в соответствии с
ожидаемым результатом
Текстовые поля ввода данных
работают в соответствии с
ожидаемым результатом
Анимация работает в
соответствии с ожидаемым
результатом

24.

ЗАКЛЮЧЕНИЕ

25.

Министерство образования и молодёжной политики Свердловской области
ГОСУДАРСТВЕННОЕ АВТОНОМНОЕ ПРОФИССИОНАЛЬНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧЕРЕЖДЕНИЕ СВЕРДЛОВСКОЙ ОБЛОСТИ
«ЕКАТЕРИНБУРСКИЙ ТЕХНИКУМ «АВТОМАТИКА»
(ГАПОУ СО «ЕТА «АВТОМАТИКА»)
Разработка веб–приложения по технологии Landing Page для магазина
спортивной одежды
Руководитель:
Н.А. Юрьева
Выполнил: студент группы ИСП 321/2
Г.Б. Косырев
Екатеринбург 2024