Размещено на http://www.allbest.ru/

Размещено на http://www.allbest.ru/

МИНИСТЕРСТВО НАУКИ И ВЫСШЕГО ОБРАЗОВАНИЯ РОССИЙСКОЙ ФЕДЕРАЦИИ

Федеральное государственное бюджетное образовательное учреждение

высшего образования

«Забайкальский государственный университет»

(ФГБОУ ВО «ЗабГУ»)

Факультет энергетический

Кафедра информатика, вычислительная техника и прикладная математика

Пояснительная записка

к курсовой работе

по Информатика и вычислительная техника

Разработка WEB-приложения

Выполнил студент группы ИВТз-18 Карбушев В.Г.

Руководитель работы: доцент кафедры ИВТ и ПМ Семигузов Дмитрий Александрович

Реферат

web-приложение интернет-магазин программирование

Пояснительная записка с., рис., табл., источника, прил.

WEB-ПРОГРАММИРОВАНИЕ, ДИЗАЙН, FRONT-END, BACK-END, ВЁРСТКА.

В данной курсовой работе реализовано создание WEB-приложения с помощью языка программирования PHP, языка разметки HTML и языка стилей CSS, а также некоторых функций JS и его библиотеки jQuery.

Целью курсовой работы является разработка интернет-магазина аптечной сети товаров.

Поставленная цель достигается путем создания программной части системы. Кроме этого, была разработана структура хранения данных проекта.

Данный интернет-магазин предназначен для приобретения товаров в интернете.

Содержание

ВВЕДЕНИЕ

1.Постановка и анализ задачи

1.1Описание предметной области

1.2Постановка задачи

1.3Средства реализации

1.4Описание языка программирования

1.5Описание библиотек

2.Анализ данных

2.1Входные данные

2.2Промежуточные данные

2.3Выходные данные

2.4Логическая структура данных

3.Программная реализация

4.Руководство пользователя

ЗАКЛЮЧЕНИЕ

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

Введение

WEB-приложения используются практически во всех сферах деятельности. Их применяют для удобства работы с клиентами, ведения торговли, ими пользуются поскольку сейчас потребители ценят наглядность. Как и в случае с торговым центром, требуется помещение, сотрудники зала, выплата аренды за торговую точку и т.д. Для интернет магазина достаточно иметь склад товаров и сайт. Также эта услуга почти необходима в ситуациях, где нужно с выгодной стороны показать объект, которого пока что не существует. Поэтому в настоящее время интернет-сайты и приложения очень востребованы на рынке.

Целями и задачами данного курсового проекта являются изучение принципов работы WEB-приложений, а также написание собственного WEB-приложения.

1. Постановка и анализ задачи

1.1 Описание предметной области

Данная работа выполнена на базе кафедры информатики, вычислительной техники и прикладной математики федерального государственного бюджетного образовательного учреждения высшего образования «Забайкальский государственный университет» (ФГБОУ ВО «ЗабГУ»). Цель разработки web-приложения - обеспечить визуальное представление сведений о товарах интернет-магазина аптечной сети, а также обеспечить обмен информацией в электронном виде.

Пользователь может авторизоваться, может осуществлять поиск товаров, оформлять заказ на каждый из товаров, отслеживать статус заказа в своем личном кабинете.

Администратор может обрабатывать заказы, просматривать их, добавлять и удалять товары каталога.

У данного приложения есть аналоги, поэтому прежде чем создавать собственное приложение, было проведено исследование существующих аналогов. Одним из аналогов можно считать «apteka.ru». Данное приложение обеспечивает возможность ознакомиться с товарами, а также приобрести их, подразумевает участие в акциях, скидках и программу лояльности.

1.2Постановка задачи

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

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

Функциональность пользователей разделена по их специфике. Пользователи системы:

1)клиент

2)администратор.

Соответственно, необходимо реализовать интерфейс для просмотра каталога клиентом, в котором имеется фильтр по категории товара, также нужно реализовать интерфейс поиска по наименованию.

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

Следует реализовать интерфейс для оформления заказа, необходимо учесть то, что заказ должен отправляться по адресу получателя, а также требуется электронная почта пользователя для связи с ним.

Для администратора требуется реализовать интерфейс авторизации, а также отображение всех заказов пользователей, отображение их статуса, и возможность обработки и сортировки. Необходима реализация интерфейса добавления и удаления товаров каталога.

1.3 Средства реализации

Реализация выполнена c помощью языка разметки HTML, языка стилей CSS, языков программирования PHP иJavaScript, а также PostgreSQL для работы с базами данных.

1.4 Описание языка программирования

PHP (акроним словосочетания PHP: HypertextPreprocessor) - это распространённый язык программирования общего назначения с открытым исходным кодом. PHP специально сконструирован для веб-разработок и его код может внедряться непосредственно в HTML.PHP отличается от JavaScript тем, что PHP-скрипты выполняются на сервере и генерируют HTML, который посылается клиенту. Возможно настроить свой сервер таким образом, чтобы обычные HTML-файлы обрабатывались процессором PHP, так что клиенты даже не смогут узнать, получают ли они обычный HTML-файл или результат выполнения скрипта.

PHP крайне прост для освоения, но вместе с тем способен удовлетворить запросы профессиональных программистов. Возможно быстро начать, и уже в течение нескольких часов создавать простые PHP-скрипты. Хотя PHP, главным образом, предназначен для работы в среде веб-серверов, область его применения не ограничивается только этим.

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

JavaScript - это язык программирования, который используют для написания frontend- и backend-частей сайтов, а также мобильных приложений. Часто в текстах и обучающих материалах название языка сокращают до JS. Это язык программирования высокого уровня, то есть код на нем понятный и хорошо читается.

JS поддерживают все популярные браузеры. Во frontend-части сайтов язык используют для создания интерактива (анимаций, всплывающих форм, автозаполнения), так как он связан с HTML и CSS и может ими манипулировать. В backend-части с языком JavaScript работают на платформе Node.js. С ее помощью, например, разрабатывают серверные веб-приложения и подключают библиотеки.

1.5 Описание библиотек

jQuery - это библиотека JavaScript, разработанная для упрощения обхода и обработки дерева HTMLDOM, а также обработки событий, анимации CSS и Ajax. Это бесплатное программное обеспечение с открытым исходным кодом, использующее разрешительную лицензию MIT. По состоянию на август 2022 года jQuery используется 77% из 10 миллионов самых популярных веб-сайтов.

Веб-анализ показывает, что это наиболее широко распространенная библиотека JavaScript с большим отрывом, имеющая, по крайней мере, в 3-4 раза больше использования, чем любая другая библиотека JavaScript.

Синтаксис jQuery разработан для упрощения навигации по документу, выбора элементов DOM, создания анимации, обработки событий и разработки приложений Ajax.jQuery также предоставляет разработчикам возможности для создания плагинов поверх библиотеки JavaScript. Это позволяет разработчикам создавать абстракции для низкоуровневого взаимодействия и анимации, продвинутых эффектов и высокоуровневых тематических виджетов. Модульный подход к библиотеке jQuery позволяет создавать мощные динамические веб-страницы и веб-приложения.

2 Анализ данных

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

Информация хранится в базе данных в соответствующих для каждого объекта предметной области таблицах.

2.1 Входные данные

Каждый пользователь сервиса обладает определенными правами доступа, и в зависимости от их вида, входные данные в приложении делятся на:

- данные, необходимые для аутентификации пользователей: логин и пароль;

- данные, необходимые для покупки товара: адрес электронной почты и адрес получателя;

- данные, для добавления и удаления товара: название товара, картинка, категория товара, а также цена.

2.2 Промежуточные данные

В качестве промежуточных данных выступают:

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

2.3Выходные данные

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

Также для администратора будет выводится информация о заказах для изменения их статуса.

2.4Логическая структура данных

Для хранения данных и связей между ними используется база данных, описание таблиц которых представлено в таблице 1.

Таблица 1 - Описание таблиц базы данных

3.Программная реализация

В ходе программной реализации разработаны алгоритмы для авторизации, внесения данных в базу данных, изменения данных в базе данных.Приложение имеет модульную структуру и содержит несколько модулей, которые представлены в виде таблицы 1.

Таблица 1 - Структура приложения

Основным файлом является файл index.php, который отображает главную страницу сайта для клиентов, в него включены: header.php, sidebar.php, content.php, footer.php - все они являются частью основного файла, отображая шапку, боковое меню (каталог), область с товарами и нижнюю часть сайта - рисунок 1.

Рис. 1 Основной файл index.php

За вход и регистрацию клиентов на сайте отвечает файл author.phpиreg.php. Сам же личный кабинет отображает заказы, сделанные клиентом на сайте - файл lk.php.

Логика взаимодействия элементов всех этих страниц располагается в папке check - рисунок 2.

Рис. 2 Файлы, отвечающие за логику приложения

За отображение каталога на основной странице отвечает файл check_catalog.php, он забирает данные из базы, выполняя SQL-запрос и передает информацию в значения HTML-тегов. Файлы check_author.phpи check_reg.php -первый отвечает за проверку логина и пароля при входе, сверяя со списком авторизованных пользователей в базе данных, а второй передает полученные данные из полей в SQL-запрос для добавления нового пользователя. Файл check_search.php выполняет поиск товара из каталога, обращаясь к таблице товаров и сравнивая значение введенное в поле поиска со значениями в таблице, выдавая нужный товар.Check_status.php проверяет в каком статусе находится заказ, если заказ был в статусе обработки, он переходит в статус отправления.

Для каждой страницы были подключены отдельные css-файлы, включающие в себя стили для более привлекательного внешнего вида страниц приложения-рисунок 3.

Рис. 3 Файлы стилей

А также использовались функции JS для определения нажатия кнопки «купить» при выборе товара, а также подтверждения статуса «В пути» - рисунок 4.

Рис. 4 Файл buy.js

4.Руководство пользователя

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

Для того, чтобы совершить покупку требуется пройти авторизацию на сайте, сделать это можно нажав на кнопку авторизации - рисунок 5.

Рис. 5Авторизация в приложении

На странице авторизации можно ввести логин и пароль (рисунок 6), если клиент уже зарегистрирован, если же нет, можно выбрать регистрацию и перейти на другую страницу, где можно ввести свой логин и новый пароль.

Рис. 5 Авторизация в приложении

После авторизации клиент может выбрать товар с помощью поля поиска, либо по категории товара. После выбора можно приобрести товар, нажав на кнопку «Купить», тогда клиент перейдет на страницу оформления заказа, на которой нужно ввести электронный адрес почты, а также адрес получателя и нажать кнопку «Оформить» - рисунок 6.

Рис. 6Оформление заказа

После нажатия кнопки клиент перейдет на страницу подтверждения заказа. После этого можно проверить в личном кабинете клиента статус заказа.

Для продавца предусмотрена авторизация на странице seller.php. После авторизации пользователь попадает на страницу на которой можно обработать новые заказы и просмотреть те которые уже обработаны. Для того чтобы обработать заказ нужно нажать на кнопку подтвердить и заказ перейдет из статуса «В обработке» в статус «В пути». Просматривать те и другие заказы можно сортируя по статусу нажимая на соответствующие кнопки - рисунок 7.

Рис. 7Обработка заказов

Для того чтобы начать изменять товары в каталоге нужно на этой же странице нажать на кнопку «Работа с каталогом» тогда пользователь перейдет на другую страницу, на которой можно выбрать добавление нового товара в каталог, либо удаление существующего - рисунок 8.

Рис. 8 Работа с каталогом

При выборе добавления товара продавец переходит на страницу, где нужно заполнить поля названия товара, категории, цены и название картинки - рисунок 9.

Рис. 9 Добавление товара в каталог

При выборе удаления товара пользователь переходит на страницу, где требуется ввести название товара для его удаления из каталога - рисунок 10.

Рис. 10 Удаление товара из каталога

Заключение

В рамках выполненной курсовой работы были рассмотрены и изучены основные принципы и понятия устройства WEB-приложения. Получены основные навыки работы с HTML-разметкой, стилями CSS и т.д. На основе этих знаний было разработано демонстрационное приложение.

Список использованных источников

web-приложение интернет-магазин программирование

1. HTML-теги - полный список, таблица тэгов по [Электронный ресурс] // Электрон. текстовый документ - Режим доступа: https://html5book.ru/html-tags/свободный. (дата обращения 10.09.2022).

2. Справочник по HTML, CSS[Электронный ресурс] // Электрон. Текстовыйдокумент - Режим доступа: http://htmlbook.ru/htmlсвободный. (дата обращения 15.09.2022).

3. Симдянов И. В.PHP 7: учебник / Симдянов И. В., Котеров Д. В. - 1-е изд., испр. - М. :БХВ-Петербург, 2016. - 240с.

Размещено на Allbest.ru