Разработка сайта с интегрированной базой данных
Компоненты приложения Vue.js, использование шаблона MVVM. Характеристика Webpack и фреймворка NuxtJs. Python как язык программирования, модель MVC, компоненты и инструментарий фреймворка Django. Технология программирования Object Relational Mapping.
Рубрика | Программирование, компьютеры и кибернетика |
Вид | контрольная работа |
Язык | русский |
Дата добавления | 22.03.2017 |
Размер файла | 296,4 K |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Размещено на http://www.allbest.ru/
Размещено на http://www.allbest.ru/
Частное профессиональное образовательное учреждение
Петрозаводский кооперативный техникум Карелреспотребсоюза
КУРСОВАЯ РАБОТА
НА ТЕМУ: “Разработка сайта с интегрированной базой данных”
по междисциплинарному курсу МДК 02.01 Информационные технологии и платформы разработки информационных систем профессионального модуля ПМ 02 Участие в разработке информационных систем.
Оглавление
ВВЕДЕНИЕ
ГЛАВА 1. ТЕОРЕТИЧЕСКАЯ ЧАСТЬ
1.1 Front-end (Визуальная часть)
1.1.1 Vue.js
1.1.2 ECMAScript6
1.1.3 Webpack
1.1.4 NuxtJs
1.2 Back-end (Серверная часть)
1.2.1 Python
1.2.2 Django
1.2.3 RESTAPI
1.2.4 PostgreSQL
1.2.5 ORM
ГЛАВА 2. ПРАКТИЧЕСКАЯ ЧАСТЬ
2.1 Front-end
2.2 Back-end
ЗАКЛЮЧЕНИЕ
Список литературы
Приложения
ВВЕДЕНИЕ
На сегодняшний день количество торговых предприятий растет неумолимо быстро и всем им приходится сталкиваться с рядом трудностей. Любая организация рано или поздно обращает внимание на интернет составляющую. Но, к сожалению, большее количество предприятий рассматривает веб-ресурс только как каталог товаров.
Для того, чтобы понять насколько остро стоит данная проблема, необходимо проанализировать существующие ресурсы. Очевидно, что списками товаров вряд ли кого-то можно удивить в наше время. И стоит четко понимать, что веб-интерфейсы могут работать на сотрудников предприятий. Например, сбор различной отчетности и последующей архивации, автоматизации других рутинных действий - все это повлечет за собой повышение эффективности труда рабочих, сократит расходы и растраченное время впустую.
Во время обследования предприятия розничной торговли “ЛОТОС” было обнаружено, что интернет ресурс используется неэффективно по уже известной причине.
В ходе завершающего анализа организации было принято решение, что существующий проект придется отложить и заняться проектированием с самого начала, используя более современный инструментарий и учитывая новые потребности самого предприятия.
Актуальность данного решения обусловлена необходимостью предприятия обновить существующий сайт с помощью более нового стека технологий.
Объектом исследования служит деятельность предприятия розничной торговли “ЛОТОС”.
Предметом курсовой работы является разработка сайта с базой данных.
Целью курсовой работы является разработка сайта с интегрированной базой данных.
Для достижения цели, нужно решить следующие задачи:
1. Выявить недостатки предыдущего проекта.
2. Спроектировать новое решение для веб-ресурса.
3. Выбрать необходимый инструментарий для разработки.
4. Разработать back-end часть.
5. Разработать front-end часть.
6. Выполнить тестирования на отказоустойчивость.
Данное решение для Интернет-ресурса будет применяться везде, где появится необходимость сменить старый проект.
ГЛАВА 1. ТЕОРЕТИЧЕСКАЯ ЧАСТЬ
1.1 Front-end (Визуальная часть)
Следующий стек технологий будет использоваться в процессе разработки нового сайта для предприятия:
· Vue.js
· ES6
· Webpack
· Nuxt.js
1.1.1 Vue.js
Vue - это прогрессивный фреймворк для создания пользовательских интерфейсов. Его ядро в первую очередь решает задачи уровня представления (view), что упрощает интеграцию с другими библиотеками и существующими проектами. С другой стороны, Vue полностью подходит и для создания сложных одностраничных приложений (SPA, Single-PageApplications).
Рисунок 1. Компоненты приложения
Vue построен вокруг концепции компонент. Компоненты - это небольшие части пользовательского интерфейса, которые можно использовать повторно.
Как было сказано ранее, Vue решает задачи уровня представления (view), а из этого следует, что он придерживается шаблона MVVM (Model-View-ViewModel). Этот шаблон используется для разделения модели и её представления, что необходимо для изменения их отдельно друг от друга. Например, разработчик задает логику работы с данными, а дизайнер соответственно работает с пользовательским интерфейсом.
Шаблон MVVM делится на 3 части:
· Модель (Model) - так же, как в классической MVC, Модель представляет собой фундаментальные данные, необходимые для работы приложения.
· Представление (View) - это графический интерфейс, то есть окно, кнопки и т. п. Представление является подписчиком на событие изменения значений свойств или команд, предоставляемых Моделью Представления. В случае, если в Модели Представления изменилось какое-либо свойство, то она оповещает всех подписчиков об этом, и Представление, в свою очередь, запрашивает обновленное значение свойства из Модели Представления.
· Модель Представления (ViewModel) - является, с одной стороны, абстракцией Представления, а с другой, предоставляет обёртку данных из Модели, которые подлежат связыванию. То есть, она содержит Модель, которая преобразована к Представлению, а также содержит в себе команды, которыми может пользоваться Представление, чтобы влиять на Модель.
1.1.2 ECMA Script6
ECMA Script (ES6) -это официальный стандарт языка JavaScript, который определяет общий синтаксис для всех разработчиков веб-приложений.
1.1.3 Webpack
Webpack можно охарактеризовать, как “сборщик модулей”. Он берет JavaScript модули с необходимыми зависимостями, и затем соединяет их вместе как можно более эффективным способом, на выходе создавая единый JS-файл.
Webpack не ограничен в использовании только JavaScript модулей. Применяя специальные загрузчики, Webpack понимает, что JavaScript модулям могут потребоваться для их работы, например, CSS файлы, а им, в свою очередь, изображения. При этом, результат работы Webpack будет содержать только те ресурсы, которые действительно нужны для работы приложения.
1.1.4 NuxtJs
NuxtJs -- это фреймворк для универсальных приложений на Vue.js. Основной задачей этого фреймворка является рендеринг пользовательского интерфейса в условиях абстракции от клиент-серверной архитектуры. Nuxt.js содержит все необходимые конфигурационные заготовки, позволяющие сделать разработку приложений ссерверным рендерингом на Vue.js лёгкой и приятной.
1.2 Back-end (Серверная часть)
В разработке серверной части будет использоваться язык Python и фреймворк Django, а также коммуникация между визуальной частью и серверной будет следовать подходу RESTAPI. Все данные будут храниться в СУБД (Система Управления Базой Данных)PostgreSQL, а запросы к базе данных будут формироваться с помощью встроенной ORM (Объектно-Реляционное Отображение).
1.2.1
1.2.1 Python
Python - это один из наиболее популярных современных языков программирования. Он пригоден для решения разнообразных задач и предлагает те же возможности, что и другие языки программирования: динамичность, поддержку ООП и кроссплатформенность. Разработку Python начал Гвидо Ван Россум (Guido Van Rossum) еще в середине 1990-х годов, поэтому к настоящему времени удалось избавиться от стандартных «детских» болезней, существенно развить лучшие стороны языка и привлечь множество программистов, использующих Python для реализации своих проектов.
1.2.2 Django
Django - это фреймворк с открытым исходным кодом, написанный на языке Python.Поскольку Django был разработан в бурлящей среде новостного агентства, он призван сделать веб-разработку простой и быстрой.
Как и большинство инструментов, позволяющих разрабатывать серверную часть веб-ресурсов, он так или иначе отвечает модели MVC (ModelViewController). Данная модель подразделяется на три компонента:
· Модель (Model) - представляет данные и реагирует на команды контроллера, изменяя свое состояние.
· Представление (View) - отвечает за отображение данных модели пользователю, реагируя на изменения модели.
· Контроллер (Controller) - интерпретирует действия пользователя, оповещая модель о необходимости изменений.
Рисунок 2. Модель MVC
Помимо всего прочего данный фреймворк включает в себя такой необходимый инструментарий как:
· Защита от CSRF атак
· Продвинутая система документирования ошибок
· Unit тесты - тестирование приложения
· Валидация форм
· Возможность работы с промежуточным слоем приложения (middleware)
1.2.3 RESTAPI
RESTAPI определяет набор функций, к которым разработчики могут совершать запросы и получать ответы. Взаимодействие происходит по протоколу HTTP. Преимуществом такого подхода является широкое распространение протокола HTTP, поэтому RESTAPI можно использовать практически из любого языка программирования.
RESTAPI предназначено, в основном, для запросов с внешних серверов. Для запросов с веб-клиентов - клиентской части приложения или от сайта - существуют JSAPI и Flash-библиотека, которые более удобны и просты в использовании.
Базовое использование данного подхода заключается в вызовах двух методов API- это GETили POSTHTTP-запросы к URL с некоторым набором параметров.
1.2.4 PostgreSQL
PostgreSQL - это свободно распространяемая объектно-реляционная система управления базами данных (ORDBMS), наиболее развитая из открытых СУБД в мире и являющаяся реальной альтернативой коммерческим базам данных.
PostgreSQLподдерживается на всех современных Unixсистемах (34 платформы), включая наиболее распространенные такие как Linux, FreeBSD, NetBSD, OpenBSD, SunOS, Solaris, DUX, а также под MacOSX.
1.2.5 ORM
Object Relational Mapping (Объектно-Реляционное Отображение) - это технология программирования, которая позволяет преобразовывать несовместимые типы моделей в ООП, в частности, между хранилищем данных и объектами программирования. ORM используется для упрощения процесса сохранения объектов в реляционную базу данных и их извлечения, при этом ORM сама заботится о преобразовании данных между двумя несовместимыми состояниями. Большинство ORM-инструментов в значительной мере полагаются на метаданные базы данных и объектов, так что объектам ничего не нужно знать о структуре базы данных, а базе данных -- ничего о том, как данные организованы в приложении. ORM обеспечивает полное разделение задач в хорошо спроектированных приложениях, при котором и база данных, и приложение могут работать с данными каждый в своей исходной форме спроектированных приложениях, при котором и база данных, и приложение могут работать с данными каждый в своей исходной форме.
Рисунок 3. Схема ORM
ГЛАВА 2. ПРАКТИЧЕСКАЯ ЧАСТЬ
приложение фреймворк программрование
В первую очередь, необходимо понять с какой части (визуальной или серверной) начать разработку. Обычно она ведется параллельно, но, так как число ресурсов ограничено, поэтому стоит разрабатывать сайт последовательно, начиная с визуальной части.
2.1 Front-end
Сначала необходимо четко разграничить страницы сайта, чтобы удобно было вести разработку, а сами страницы в свою очередь разбить на компоненты, такие, например, как:
· Шапка
· Тело
· Низ
В ходе разработки будет использоваться достаточно количество скриптов, которые помогают сократить рутинную работу, например, перезагрузка страницы после изменений в файлах.
После разбиения сайта и страниц на независимые модули нужно позаботиться о том, чтобы в дальнейшем их связать в один файл и оптимизировать их размер. В этом поможет инструмент, упомянутый в теоретической части - Webpack.
Для того, чтобы визуальная часть и серверная часть могли взаимодействовать друг с другом, потребуется воспользоваться специальным модулем - AxiosJS. Он упростит написание запросов к серверной части посредством AJAX технологии, а также обезопасит запросы от их подделки.
В завершение визуальной части необходимо написать несколько тестов для выявления неочевидных проблем и багов.
2.2
2.2 Back-end
Для подготовки окружения стоит выполнить последовательно следующие действия:
· Выбрать временный сервер для ведения на нем разработки back-end части
· Установить python утилиту pip, которая выполнит разрешение зависимостей и подготовит необходимые пакеты для начала разработки
После того, как предыдущие шаги были выполнены, можно начать создавать приложения (компоненты серверной части).
ЗАКЛЮЧЕНИЕ
В ходе выполнения курсовой работы был проведен анализ отделов предприятия для того, чтобы учесть все недостатки предыдущего решения, а также добавить дополнительный функционал для повышения эффективности определенной группы рабочего персонала. Также в ходе выполнения работы были применены современные инструменты и система контроля версий, что в будущем позволит тратить меньше времени на разработку и понимание как устроена система.
На основе проведенного анализа были созданы модели баз данных в серверной части, которые позволяют эффективно оперировать с данными и предоставляют надежное хранение.
Основные пользователи функционала веб-сайта - это персонал, которому необходим постоянный учет товаров или же люди, которые отвечают за содержимое сайта и его наполнение.
Во время выполнения работы были достигнуты поставленные цели, а именно:
· Разработана визуальная часть сайта
· Разработана серверная часть сайта
· Улучшена поддержка кода при помощи системы контроля версий
Список литературы
1. РД 50 - 34.698 - 90 Методические указания. Информационная технология. Комплекс стандартов и руководящих документов. Автоматизированные системы. Требования к содержанию документов на автоматизированные системы.
2. ISO/IEC 15288 Systems engineering. System life cycle processes (Системотехника. Процессы жизненного цикла системы).
3. ISO/IEC 12207:1995 Information technology - Software life cycle processes (Информационныетехнологии. Процессы жизненного цикла программного обеспечения).
4. Ворона В.А., Тихонов В.А., Системы контроля и управления доступом. Издательство: М.: Горячая линия - Телеком, 2010. 272стр.
5. Горчаков Я.В. Описание деятельности организации: Субъект - Объект - Процессы, 2014.
6. В.А. Головин, В.А. Русин, Е.С. Тарабаева, Моделирование предметной области, М.: Академия АйТи, 2009. - 43 с.
7. Флэнаган Д. Javascript. Подробное руководство 6-е издание, 2012.
8. К. Дж. Дейт. Введение в системы баз данных, 2005.
9. Марк Лутц. Изучаем Python 4-е издание, 2012.
10. Лучано Рамальо. Python. К вершинам мастерства.
11. Кузин А.В., Базы данных 5-е издание. Издательство: Издательский центр Академия, 2012 г. 317стр.
12. Корчагин С.В., Разработка программных комплексов. [Текст]: учеб.пособие для вузов. М.: Издательство "БХВ-Петербург", 2008. 500стр.
13. Зыков Н.В., Общие требования к оформлению курсового проекта (работы):стандарт предприятия СТП - ЗабГК - 01- 08/ Н.В. Зыков, Л.В. Шумилова, А.В. Терехова - Чита, ЗабГК, 2008. - 14 с
14. Документация DjangoRESTFramework - http://www.django-rest-framework.org
15. Документация DjangoFramework - https://docs.djangoproject.com/en/1.10
16. Документация VueJS - https://vuejs.org/v2/guide
17. Документация NuxtJS - https://nuxtjs.org/guide
Приложения
1. Схема запросов к RESTAPI
Размещено на Allbest.ru
Подобные документы
Django — свободный фреймворк для веб-приложений на языке Python, использующий шаблон проектирования MVC. Архитектура и основные компоненты приложения. Главные компоненты среды разработки Django. Некоторые возможности и взаимосвязь компонентов фреймворка.
реферат [23,7 K], добавлен 18.01.2015Вопросы реализации шаблона типового сайта диссертационного совета СевКавГТУ. Разработка базы данных для шаблона сайта с помощью фреймворка Django и Aptana Studio 3. Обоснование требований к техническому обеспечению. Расчет цены программного продукта.
дипломная работа [2,5 M], добавлен 26.09.2012Случаи использования PHP фреймворка. Обзор современных фреймворков. Выбор фреймворка для разработки сайта. Поддержка баз данных и сообщества. Model View Controller архитектура. Скорость развития фреймворка. Наличие встроенных javascript-библиотек.
курсовая работа [1,8 M], добавлен 31.05.2012Этапы развития, особенности и возможности языка программирования Java; происхождение названия. Приложения Sun Microsystems: идеи, примитивные типы. Python - высокоуровневый язык программирования общего назначения: структуры данных, синтаксис и семантика.
реферат [79,0 K], добавлен 23.06.2012Отличительные особенности языка программирования Python: низкий порог вхождения, минималистичный язык, краткий код, поддержка математических вычислений, большое количество развитых web-фреймворков. Традиционная модель выполнения программ на языке Python.
реферат [51,9 K], добавлен 18.01.2015Анализ создания виртуального окружения для разработки. Установка фреймворка Flask. Особенность настройки аутентификации и привилегий. Создание Python-файла и написание в нем простого веб-приложения. Запуск и проверка работоспособности приложения.
лабораторная работа [2,1 M], добавлен 28.11.2021Понятие шаблона проектирования или паттерна в разработке программного обеспечения. Изменение поведения системы (базы данных) с помощью порождающего шаблона программирования - абстрактной фабрики. Программирование базы данных и управление ею на языке С+.
курсовая работа [124,8 K], добавлен 30.04.2011Технология разработки веб–ориентированных систем. Выбор языка программирования, фреймворка и СУБД. Создание сайта в виде текстового форума с функцией оповещения о важных новостях по почте. Выбор хостинга, доменного имени и размещение его в Интернет.
курсовая работа [1,9 M], добавлен 10.11.2015Разработка структуры базы данных для хранения дипломных проектов в среде объектно-ориентированного программирования Python. Создание внешнего вида окон ввода-вывода информации, технологии переходов. Листинг программы с пояснениями; направления улучшения.
курсовая работа [3,1 M], добавлен 27.02.2015Компоненты приложения и технологии, используемые для связи между ними. Обзор программных средств и технологий, используемых в ходе работы. Трансляция кода JSP страницы в код сервлета. Создание структуры базы данных c применением фреймворка Hibernate.
курсовая работа [1,1 M], добавлен 16.07.2016