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

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

СОДЕРЖАНИЕ

• ВВЕДЕНИЕ
• 1. АНАЛИЗ ПРЕДМЕТНОЙ ОБЛАСТИ РАЗРАБОТКИ ИНТЕРНЕТ-ПОРТАЛА АГЕНТСТВА ИННОВАЦИОННОГО РАЗВИТИЯ
• 1.1 Анализ объекта автоматизации
• 1.2 Существующие подходы и способы предоставления информационных услуг в сети интернет
• 1.3 Существующие портальные решения, обеспечивающие предоставление информационных услуг
• 1.4 Постановка задачи
• 2. ПРОЕКТИРОВАНИЕ ИНТЕРНЕТ-ПОРТАЛА
• 2.1 Инструментарий разработки
• 2.1.1 Инструменты front-end разработчика
• 2.1.2 Инструменты back-end разработчика
• 2.1.3 Системы управления контентом
• 2.1.4 Выбор инструментария для реализации интернет-портала
• 2.2 Структурная схема
• 2.3 Разработка функциональной модели интернет-портала
• 2.4 Разработка диаграммы вариантов использования
• 2.5 Разработка диаграммы деятельности
• 3. РАЗРАБОТКА ИНТЕРНЕТ-ПОРТАЛА АГЕНТСТВА ИННОВАЦИОННОГО РАЗВИТИЯ
• 3.1 Разработка дизайна
• 3.2 Верстка интернет-портала
• 3.3 Разработка Базы данных
• 3.4 Интеграция с Laravel
• 4. РАЗРАБОТКА ОРГАНИЗАЦИОННО-МЕТОДИЧЕСКОЙ ДОКУМЕНТАЦИИ ДЛЯ РАБОТЫ С ИНТЕРНЕТ-ПОРТАЛОМ АГЕНТСТВА ИННОВАЦИОННОГО РАЗВИТИЯ
• 4.1 Руководство пользователя
• 4.2 Руководство администратора
• ЗАКЛЮЧЕНИЕ
• СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ
• ВВЕДЕНИЕ
• Web - технологии развиваются настолько стремительно и быстротечно, что на сегодняшний день невозможно представить жизнь без них. Каждый день мы заходим на различные сайты чтобы проверить ту или иную информацию в сети интернет. Интернет проник во все сферы человеческой жизни, он помогает нам обмениваться информацией с людьми, которые находятся в десятках тысяч километров от нас, помогает в одно мгновение получить почти любую необходимую информацию о интересующих нас вопросах, хранить огромные объемы данных, при этом не занимая место на вашем личном компьютере и многое другое. Все это было бы невозможно, без соответствующих web - сайтов и сервис, которые направлены на упорядочивание информации и помощь с ее поиском и контролем.
• К сожалению, стремительное развитие web - технологий и интернета в целом, влечет за собой не только положительные черты, но и множество отрицательных. Разнообразие информационных, фишинговых, развлекательных ресурсов ведет к зависимости от интернета. Множество web - сайтов и порталов вводят людей в заблуждения неточной или ложной информацией, что подвергает людей опасности. Недостоверные или слабозащищенные источники информации подвергаются атакам, что влечет за собой кражу личных данных пользователей. Для защиты пользователей от таких атак и краж, а также для предоставления точной и достоверной информации, создаются интернет-порталы.
• Целью выпускной квалификационной работы является разработка интернет-портала Агентства инновационного развития, который должен объединять в себе множество направлений таких как: организация, информирование и проведение мероприятий по робототехнике для детей и подростков, организация ИТ-смен, стартап-школ и многое другое, а также предоставлять людям точную и надежную информацию в сети интернет. Для достижения поставленной цели необходимо решить некоторые задачи.
• В первую очередь необходимо провести аналитический обзор предметной области, анализ объекта автоматизации, рассмотреть существующие подходы и способы предоставления информационных услуг, рассмотреть существующие портальные решения, обеспечивающие предоставление информационных услуг.
• Следующим шагом необходимо провести проектирование интернет-портала, рассмотреть выбор современного инструментария средств для разработки портала, рассмотреть виды технологий и подходы для их реализации, также при проектировании интернет-портала необходимо выбрать современный и оптимальный инструментарий средств.
• После проектирования интернет-портала и выбора инструментария средств для его реализации необходимо описать этапы разработки с освещением главных моментов каждого этапа.
• Завершающим шагом необходимо провести разработку организационно-методической документации для работы с интернет-порталов Агентство инновационного развития, в которую входит руководство пользователя и руководство администратора.
• 1. АНАЛИЗ ПРЕДМЕТНОЙ ОБЛАСТИ РАЗРАБОТКИ ИНТЕРНЕТ-ПОРТАЛА АГЕНТСТВА ИННОВАЦИОННОГО РАЗВИТИЯ

1.1 Анализ объекта автоматизации

Агентство инновационного развития (далее - АИР) - это автономная некоммерческая организация, главным направлением работы которого является разработка комплексных технических решений для учреждений общего и дополнительного образования детей и подростков, в том числе, в области ИТ и робототехники. Учредителями организации являются Сахаров С.Л. и Ступин Р.С. интернет портал сеть инновационный

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

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

АИР работает с 2012 и за этот период им было реализовано свыше 120 проектов, в таких регионах как: г. Москва, Московская область, г. Санкт-Петербург, Ленинградская область, г. Севастополь, Вологодская область, Ярославская область, Тверская область, Астраханская область, Ростовская область, Краснодарский край, Ставропольский край, Чеченская Республика, Саратовская область, Самарская область, Республика Мордовия, Республика Татарстан, Ульяновская область, Свердловская область, Томская область, Республика Бурятия, Алтайский край, Кемеровская область, Новосибирская область, Хабаровский край, Приморский край, Республика Саха (Якутия), Чукотский автономный округ. География реализованных проектов представлена синим цветом на рисунке 1.1.

С 2012 года командой агентства инновационного развития реализовано 5 международных, 12 всероссийских, 38 окружных и свыше 100 региональных мероприятий для молодежи, начинающих изобретателей, предпринимателей и программистов. Ежегодно в проектах агентства инновационного развития принимает участие свыше 3000 человек.

Так же агентство инновационного развития реализует следующие направления:

- всероссийская программа IT-START - постоянно действующая программа поддержки молодых программистов и молодежных проектов в сфере информационных технологий. Миссией проекта является формирование в России поколения молодых технологических предпринимателей в сфере информационных технологий, способных создавать лидирующие на мировом рынке продукты. Целями и задачами является: создать уникальную площадку для взаимодействия и профессионального развития с целью поиска и содействия продвижению IT -- разработок на российском и международном рынках, объединение специалистов в профессиональное сообщество с целью повышения их профессионального уровня, повышение престижа профессии разработчика, популяризация IT-сферы среди молодежи;

- кружок робототехники ROBO START (робототехника для детей) -- это новый вид занятий, позволяющий вдохновить ребенка вне школы и раскрыть его творческие способности. Ваш ребенок научится строить различные моторизированные механизмы, разрабатывать программное обеспечение, познакомится с основными принципами механики и робототехники, узнает много нового и интересного. Как и в любом другом деле одному человеку справиться со всеми этапами сложно, поэтому агентство стремится заниматься разработкой роботов в дружном коллективе, где каждый ребенок сможет найти свое место и быть востребованным и полезным участником. В одном проекте он сможет выступить как инженер-конструктор, в следующем -- в роли программиста либо ученого, и он будет анализировать задачи и разрабатывать проектную документацию;

- публикация научных статей в международный научный журнал «Global Science», который издается Автономной некоммерческой организацией «Агентство инновационного развития» с 2016 года. Журнал издается в сотрудничестве с партнерами Агентства инновационного развития - российскими и зарубежными научными школами, институтами развития, инновационными компаниями и учеными. Научно-исследовательский центр Автономной некоммерческой организации «Агентство инновационного развития» сотрудничает с партнерами в Соединенных Штатах Америки, Канаде, Франции, Швейцарии, Германии, Польше, Литовской Республике, Израиле, Южной Корее, Японии, Китае, Казахстане и Республике Беларусь. Основные рабочие языки международного журнала Global Science: русский, английский, французский, немецкий. Журнал является средством массовой информации, зарегистрированным Федеральной службой по надзору в сфере связи, информационных технологий и массовых коммуникаций (Роскомнадзор). Территория распространения: Российская Федерация, страны Таможенного Союза, страны Евросоюза, США, Канада, Южная Корея, Китай. Основная цель научного журнала -- публикация результатов научных исследований аспирантов, соискателей и докторантов российских и зарубежных ВУЗов и научных центров. Тематические разделы журнала «Global Science» соответствуют номенклатуре специальностей научных работников, утвержденной приказом Минпромнауки России от 31.01.01 №47. Экземпляры международного научного журнала «Global Science» направляются в ведущие библиотеки России и Европы, ФГУП «Российская книжная палата»;

- digital и студия AIR CREATIVE GROUP. АИР в рамках проекта Air Creative Group предоставляет услуги по разработке фирменного стиля, рекламной продукции и веб-сайтов любой сложности. Фирменный стиль является одним из главных инструментов в позиционировании компании, служит для ведения коммуникации с внешним миром, а также призван выделять уникальность компании среди конкурентов. Фирменный стиль компании - это совокупность графических, цветовых, словесных элементов, которые обеспечивают смысловое единство бренда;

- конструкторы образовательной робототехники. АИР является дилером основных производителей конструкторов образовательной робототехники, поэтому цены выгодно отличаются от цен конкурентов. Помимо этого, агентство занимается поставками сопутствующего оборудования и методических пособий по робототехнике. Но самое главное, Агентство инновационного развития имеет опыт комплексных решений: создание лабораторий, кружков робототехники под ключ;

- международные «стажировки» - АИР проводит организацию деловых поездок и международных образовательных стажировок. С 2014 года в рамках программы было запущено направление по организации международных стажировок. Победители программы IT-START имеют право бесплатного участия в стажировках. Также принять участие в международных стажировках на коммерческой основе может любой желающий. Международная образовательная стажировка -- это возможность не только получить передовые знания от зарубежных экспертов, но и ознакомиться с инновационной инфраструктурой, учебными заведениями, успешными стартапами представить проект инвесторам. Преимущества программы: Пройди обучение от лучших мировых специалистов. Узнай про инновационную инфраструктуру и образовательные возможности страны. Посети ведущие инновационные компании и получи возможность пообщаться с основателями успешных стартапов.

АИР стало победителем фонда президентских грантов за 2018 год с проектами: Всероссийская профильная смена по информационным технологиям и техническим видам спорта (Сроки реализации 15.06.2018 - 15.12.2018,

Программа развития технологического предпринимательства в молодежной среде "IT-Start" (Сроки реализации 01.12.2018 - 31.05.2019, Размер гранта 2 912 572,00) информация о проекте представлена на рисунке 1.3.

1.2 Существующие подходы и способы предоставления информационных услуг в сети интернет

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

Существует множество классификаций и разновидностей сайтов, таких как: landing page - одностраничный сайт, акцентирующий внимание на каком-либо товаре или человеке, multi page - как правило, это тот же landing page, но имеющий еще 2-3 страницы в своей структуре, интернет магазин - сайт главной задачей которого является распространение и продажа какого-либо товара в сети интернет, интернет-портал - многостраничный сайт главной задачей которого является упорядоченное представление информации во множестве сфер и объединение в себе разных направлений, такой сайт имеет продуманную структуру, где главный акцент делается на удобное и понятное расположение, предоставление информации для дальнейшей манипуляции этой информации и многие другие. Таких разновидностей сайтов великое множество. Классификациями же сайтов является: landing page визитка - это одна из классификаций landing page, но главный акцент на таком сайте делается на какую либо личность, для продвижение этой личности в сети интернет или возможности для других пользователей ознакомиться с этой личностью, landing page shop - так же является одной из классификаций landing page, но тут главный акцент делает уже не на личности человека, а на продаже и продвижении какого-либо товара в сети интернет, развлекательный портал - это одна из разновидностей интернет-портала, главной задачей которого является предоставление развлекательного контента, такого как: игры или какие-либо развлекательные мероприятия, информационный портал - так же является одной из разновидностей интернет-портала, главной задачей которого является предоставление информации с последующим проведением каких-либо мероприятий, в зависимости от направления информационного портала.

1.3 Существующие портальные решения, обеспечивающие предоставление информационных услуг

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

Информационный портал «VOLOGDA-POISK.RU» является франшизой сети городских порталов gorodor.ru. На портале представлен большой объем информации о различных сферах жизни города. Актуальные новости с удобной навигацией, которая предлагает выбор по категориям, а также временные границы публикации новостей. Представлена информация о развлекательных и образовательных мероприятиях города, открытых для посещения, например, выставки, спектакли, концерты, экскурсии. На данном сайте можно найти множество статьей и полезной информации. Собрана большая база различных организаций города Вологда, разделенные на категории и подкатегории, в том числе и спортивные клубы. Об организации можно узнать название, описание, контактные данные, услуги, представленные компанией. Портал имеет функцию исправления ошибочных данных пользователем с проверки администрации, добавление более актуальной информации, блок отзывов и карту. На портал интегрированы различные сторонние сервисы, например, прогноз погоды, расписание поездов, автобусов, самолетов. Из недостатков можно выделить отсутствие фильтрации, данных стоимости услуг, внешних ссылок, также не ясно, когда добавлялась или обновлялась информация последний раз [1].

Информационный портал «NPVO35.RU» является региональным порталом Вологодской области. На портале можно найти новостную ленту с нотариальной тематикой. Портал имеет поиск, который ищет информацию по ключевому слову на всем портале. На портале представлена следующая информация: информацию о палате, список работников и их должности, тарифы и расценки по тарифам. Портал предоставляет функцию “Поиск наследников”, которая позволяет по введенному имени, отчеству и фамилии посмотреть информацию о ваших пользователя, функцию обратной связи. На портале указаны режимы работы и данные для связи с работниками нотариальной палаты. Из недостатков можно выделить отсутствие фильтрации в поиске, устаревший и не структурированный дизайн, непонятная авторизация на сайте, которая не имеет регистрации [2].

Информационный портал «VOLOGDATOURINFO.RU» является региональным порталом Вологодской области. На портале можно увидеть: удобный подбор гостиниц и баз отдыха для туристов из других регионов и стран, в котором можно выбрать дату заезда и отъезда, поиск, блок туристических направлений, в котором отображены все живописные и красочные места Вологодской области, блок с интересными местами Вологодской области по категориям, маршруты туристических маршрутов, по которым было бы интересно пройтись людям, которые не знакомы с вологодской областью, новостную ленту, в которой отображены только новости региона, блок с партнерами портала. Об организации можно узнать ее название, фактический адрес, ссылки на социальные сети, информацию о отделе туристско-информационной деятельности, информацию о редакционно-издательском отделе, режимы работы и награды, которые получил портал. Также портал имеет несколько способов обратной связи, один через модульный функционал, другой через функционал портала. Из недостатков можно выделить отсутствие фильтрации, простой и неудобный поиск по порталу, на некоторых страницах портала неудобный и не структурированный дизайн [3].

Молодежный портал «UPINFO.RU» является шаблонным решением компании Вологодской области «СИНАПС». На портале можно найти новостную ленту, в которой содержится региональные новости по категориям, анонсы мероприятий, которые проходят в регионе, документацию организации, фотогалерею с мероприятий, конкурсов и грантов, конкурсы и гранты портала, поиск по сайту. Об организации можно узнать информацию о директоре, ее контактные данные, карту с фактическим адресом компании, больше информации об организации на портале нет. Из недостатков можно выделить не удобный и не структурированный дизайн, нет карты сайта, нет описания деятельности портала, его направления и информации о нем, нет фильтрации, поиск без ключевых слов [4].

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

Справочно-информационный портал «GRAMOTA.RU» является шаблонным решением. На портале можно увидеть: поиск ответов, на введенные вопросы, проверку слова на грамотность и значение, различные виды словарей, библиотеку книг и статей, справочные материалы, информацию по классам школы, новостную ленту, развлекательную ленту с играми и статьями, ссылки на социальные сети. Об организации можно узнать ее название, описание деятельности, приоритетные направления портала, информацию о главных редакторах портала, партнеров портала, награды. Из недостатков можно выделить устаревший дизайн, не структурированность данных, неудобные формы поиска, которые не имеют фильтрации [5].

Официальный интернет-портал правовой информации «PRAVO.GOV.RU» является шаблонным решением портала. На портале можно найти информацию о официальных опубликованных правовых актах в электронном виде, информацию о законодательстве России, со сводом законов России, Российской империи и архив периодических изданий, перечень новых поступлений в эталонный бланк данных правовой информации, в котором собраны указы президента Российской федерации, информацию по центру правовой информации, где можно узнать о пунктах свободного, бесплатного доступа граждан к правовой информации в электронном виде, блок с обращениями людей к президенту Российской Федерации, которые поступают от граждан и были рассмотрены самим президентом, блок статей, новостную ленту, архив новостей, информацию о портале, каталог полезных правовых ссылок, вопросы и ответы по работе портала, информацию о защите персональных данных. Так же имеется поиск по сайту, по ключевому слову. Об организации можно узнать статус портала на сегодняшний день, описание работы портала, что можно найти на этом портале. Недостатками же сайта является неудобный и неструктурированный дизайн, невозможность обратной связи, отсутствие фильтрации в поиске [6].

Информационный портал РФ «INFOPORTALRU.RU» является федеральным порталом. На портале можно найти блок новостей с фильтром по России и миру, интересные факты о Российской Федерации, правовую информацию, блок технологий с фильтром по военному делу и транспорту, информацию об отношениях между людьми, здоровье и как правильно его поддерживать, фотографии с интересными местами РФ, видео проекты и информацию о самом портале. Об организации можно узнать политику конфиденциальности портала, информацию о портале, условия размещения комментариев, авторские права. Регистрация на сайте проходит в автоматическом режиме, поэтому вести свой аккаунт не представляется возможным, регистрация сделана как факт ее наличия. Недостатками сайта является неудобный и не структурированный дизайн, автоматизированная регистрация, отсутствие личного кабинета, фильтра и упорядоченного поиска по сайту [7].

Портал «STARTUPMOSCOW.RU» является международным порталом для публикации и последующей поддержки проектов. На портале можно найти каталог проектов, информацию о портале, форму для общения пользователей, блок новостей о криптовалюте и инновациях в сфере информационных технологий, фотоотчеты о проведенных встречах и новостях, список инвесторов, которые готовы поддержать поданные на сайт проекты, контакты для связи с администраторами портала. На портале реализованная многоступенчатая функция подачи проектов и привлечения инвесторов к поданным проектам, бегущая строка с последними новостями и курсом валют, возможность к получению инструкции. Об организации можно узнать три шага к успеху, которые помогут пользователю с правильной публикацией проекта, информацию о портале, контактные данные для связи с администратором портала и расположение на карте. Из недостатков можно выделить отсутствие поиска на сайте [8].

Портал «ANOASI.COM» является сайтом агентства по развитию инфраструктуры инновационной сферы. На портале можно найти цели, которыми занимается агентство, последние новости из сферы инноваций, список партнеров агентства, мероприятия, проводимые агентством, проекты, которые поддерживает данный портал и контактную информацию. Представлена следующая информация об организации: можно узнать дату создания агентства, опыт и реализованные проекты агентства, информацию о руководстве, основные цели и контактные данные. Из недостатков можно выделить простой, но интуитивно понятный дизайн, отсутствие поиска и малую заполненность портала информацией [9].

Интернет портал «PFRF.RU» является официальным порталом пенсионного фонда РФ, который работает во множестве регионов. На портале можно найти информацию об отделении ПФР, информацию для жителей региона, контакты региона, новостную ленту, привязанную к выбранному вами региону, личный кабинет гражданина, где можно получить консультацию по интересующим вас вопросам, изменения в пенсионной системе, информацию и способы решения жизненных ситуаций, центр консультирования, открытые данные, государственные услуги ПФР, информацию по противодействию коррупции, карту сайта, полезные ссылки. Об организации можно узнать историю отделения, привязанную к региону, цифры и факты, специальную оценку условий труда, информацию о руководстве и самом портале. Из достоинств портала можно выделить наличие пенсионного калькулятора, карту сайта, удобный и структурированный дизайн, выбор из множества регионов, удобный поиск с фильтрацией, версию для слабовидящих, выбор язык отображения информации. Из недостатков можно выделить шаблонность некоторых страниц, которая вводит в заблуждения свой не заполненностью и неточностью [10].

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

Таблица 1.1 - Наличие элементов функциональной составляющей рассмотренных порталов

В таблице 1.2 отражена структурная и информативная составляющая рассмотренных порталов.

Таблица 1.2 - Структурная и информационная составляющая рассмотренных порталов

Из таблиц 1.1 можно сделать вывод, что лучше всего элементы функционала реализованы на VOLOGDATOURINFO.RU, что говорит о качественном подходе в создании портала и ответственном его ведении, и продвижении в сети интернет. Самый широкий функционал, предлагаемый рассмотренными порталами, предоставляет портал PFRF.RU, в котором собрано множество интересных и полезных функций, но даже с таким богатым и обширным функционалом, он уступает нашему региональному сайту.

Из таблицы 1.2 можно сделать вывод, что информационная и структурная составляющая портала лучше всего реализована у двух рассмотренных порталов STARTUPMOSCOW.RU и PFRF.RU, что говорит о грамотном подходе в проектировании портала и предоставления информации на нем.

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

Таблица 1.3 - Сравнение порталов по количеству организаций, поддерживающих портал и количеству регионов, с которыми у портала заключено соглашение

В ходе работы было рассмотрено более четыреста страниц с разным дизайном, направленностью, функционалом, способом отображения и представления информации. На основе проведенного анализа можно сделать выводы о том, что порталом с лучшим функционалом является VOLOGDATOURINFO.RU. Самыми удобными в плане информационной и структурной составляющей являются STARTUPMOSCOW.RU и PFRF.RU, которые имеют: удобный и приятный глазу дизайн, продуманная структура и расположение данных.

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

Целью выпускной квалификационной работы является разработка интернет-портала Агентства инновационного развития, который должен объединять в себе множество направлений. Интернет-портал в отличии от всех остальных разновидностей сайтов подходит лучше всего, это связано с тем, что организации Агентство инновационного развития необходимо предоставление информации в простом и удобно формате, который сможет понять даже самый обычный пользователь сети интернет, так же для организации важно, чтобы портал объединял в себе множество направлений и мог проводить мероприятия связанные с тематикой портала. На основе этих требований и возможностей, был выбран интернет-портал.

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

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

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

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

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

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

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

2. ПРОЕКТИРОВАНИЕ ИНТЕРНЕТ-ПОРТАЛА

2.1 Инструментарий разработки

Web - технологии имеют стремительный темп развития, который ежегодно предлагает все больше инструментов, методов и подходов для разработки сайтов всех видов. На сегодняшний день принято разделять подход к разработке на две части: front-end - клиентская сторона пользовательского интерфейса к программно-аппаратной части и back-end - программно-аппаратная часть. На рисунке 2.1 представлено разделение на front-end и back-end разработку.

2.1.1 Инструменты front-end разработчика

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

Основными инструментами для разработки клиентской части приложения на сегодняшний день являются: HTML, CSS, JavaScript.

HTML (HyperText Markup Language) - язык гипертекстовой разметки документов, страниц в сети интернет. Почти все web - страницы всемирной паутины содержат описание разметки на языке HTML. Данный язык интерпретируется на уровне браузера, а полученный в результате интерпретации форматированный текст отображается на стороне пользователя, его мониторе или экране телефона. Язык состоит из дескрипторов, которые описываются специальным синтаксисом с обозначенным началом и концом для каждого элемента. Элементы могут быть пустыми, не содержащими ни текста, ни каких-либо других данных и в этом случае закрывающий тег обычно не указывается. Каждая web - страница должна включать в себя следующие дескрипторы: тип документа (<HTML></HTML>), имя документа (<TITLE></TITLE>), шапку документа (<HEAD></HEAD>) и тело документа (<BODY></BODY>). Существует множество препроцессоров языка гипертекстовой разметки, таких как: JADE, PUG и многие другие. Препроцессоры имеют свой уникальный синтаксис и упрощают работу с HTML, что делает ее более быстрой и гибкой [11].

CSS (Cascading Style Sheets) - каскадные таблицы стилей используются для описания внешнего вида веб-страницы, написанного на языке гипертекстовой разметки. Основной задачей CSS-стилей является изменения внешнего вида элементов веб-страниц. Таблицы стилей описывают правила форматирования и расположения элементов на странице с помощью свойств. Для каждого элемента возможно использование множества свойств и значений. Привязка стилей к элементам страницы происходит при помощи объявления классов или id элементов. CSS свойства бывают двух видов: inline - расположение стилей в тэгах гипертекстовой разметки и табличные - расположение стилей в отдельном подключенном к основному файлу стилей, использование inline стилей не рекомендуемо к применению, ведь главной задачей CSS помимо отрисовки элементов является разделение структуры и стилей, при использовании же inline стилей, структура и стили смешиваются, что приводит к лишней нагрузке сайта. Написание стилей одно из самых рутинных этапов разработки современного сайта, для описания множества элементов сайта, приходится прописывать одни и те же свойства по несколько раз, а обилие свойств и значений, позволяет решать задачи различными способами, которые не всегда являются оптимальными и могут вызвать определенные проблемы, например, трудности с сортировкой и группировкой свойств или неоднозначное наследование. Для решения этих задач были придуманы препроцессоры, такие как: Sass, Less и многие другие. CSS препроцессоров существует великое множество, рассмотрим самые полярные из них [12].

Одним из первых препроцессоров является Sass, разработанный в 2007 году в числе компонентов шаблонизатора Html, это метаязык, работающий на основе CSS, разработан для упрощения синтаксиса таблиц стилей и увеличения уровня абстракции CSS кода. За счет удобство использования и большого функционала получил широкое распространение как обособленная технология. Sass привнес огромное количество возможностей, таких, как переменные, миксины, вложение селекторов, которые сейчас реализованы в каждом препроцессоре CSS. Язык имеет два синтаксиса: sass, который полностью исключает фигурные скобки и scss более приближенный к стандарту CSS [13].

Препроцессор Less был создан в 2009 году и его главной особенностью стала поддержка нативного синтаксиса CSS, также, как и Sass умеет работать с переменными, миксинами и вложенными селекторами.

Но препроцессоры имеют свои особенности в виде отличного от обычного синтаксиса или группировки и расстановки стилей, поэтому решить проблемы можно используя специальные CSS framework, которые так же направлены на ускорение и упрощение работы с CSS, но при этом не имеют такого большого отличия от обычного CSS. CSS framework'ов существует великое множество, рассмотрим самые популярные из них, такие как:

Bootstrap является одним из самых известных и используемых CSS-фреймворков, имеет в своем составе различные JavaScript-расширения и множество готовых элементов, например, кнопки, сайдбары, навигационные панели, формы. Главным инструментом фреймворка является удобная двенадцати-колоночная сетка, которая в последней версии фреймворка написана полностью на технологии flex-box. Bootstrap является кроссбраузерным решением и совместим со всеми основными браузерами. Имеет в своем арсенале ряд средств для создания полностью адаптивных сайтов. Использует препроцессоры Less и Sass.

Materialize включает в себя все те же функции, что и Bootstrap, но в отличии от него, имеет более современный дизайн, включает в себе простую интеграцию с vue.js и react.js.

Java-Script - это объектно-ориентированный язык с функциями первого класса, самый распространённый скриптовый язык веб-разработки, но используется и вне браузерного окружения. Для выполнения языка требуется интерпретатор, который стандартно встраивается во всех браузерах, поэтому имеет такое широкое распространение, говоря простым языком - это язык сценариев который поддерживает различные стили программирования такие, как динамический, объектно-ориентированный, императивный и функциональный. JavaScript работает на стороне пользователя и отвечает за то, как будут вести себя веб-страницы при срабатывании каких-либо событий. Это легко изучаемый, с малым порогом вхождения язык, но в то же время с очень мощным функционалом. Вопреки распространенному мнению, JavaScript не имеет почти ничего общего с Java, не считая некоторых сходств в базовом синтаксисе, он намеренно похож на Java и C++, чтобы облегчить его запоминание, по средствам уменьшения числа новых концепций, необходимых для изучения. Конструкции типа for, while, if, switch похожи на конструкции этих языков. Стоит отметить, что JavaScript вполне может работать и как объектно-ориентированный язык, и как процедурный. Основные динамические возможности данного языка включают: переменное число параметров, перебор объектов, создание объектов во время выполнения, динамическое создание скриптов, восстановление исходного кода. Чтобы упростить и ускорить работу с JavaScript были придуманы и разработаны framework'и и библиотеки, таких как: Vue.js, React.js и многие другие [14]. Рассмотрим самые популярные из них на сегодняшний день:

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

React - одна из популярных библиотек разработки пользовательского интерфейса, однако, несмотря на популярность, программирование с использованием данной библиотеки требует чёткого понимания концепций её построения. Главные особенности: огромное количество допустимых подходов к построению веб-приложения, тем самым предоставляя разработчику свободу действий; возможность использования языка программирования JSX, с близким по написанию синтаксисом с HTML.

2.1.2 Инструменты back-end разработчика

Back-end разработка включает в себя аппаратно-программную реализацию. Иными словами, back-end это все, что происходит на стороне сервера в рамках web-приложения. Сервер - компьютер или специальное оборудование, выделенное под него, которое принимает и обрабатывает поступающие на него запросы, поэтому при разработке портала нужно учитывать то, какие инструменты и языки программирования поддерживает сервер. Наиболее распространенные языки программирования для работы с back-end: Php, Python, Ruby и JavaScript. Наиболее популярные инструменты для работы с back-end: Vagrant, Docker, PhpStorm.

Php - скриптовый язык, является самым популярным на сегодняшний день по данным Wikipedia.ru, для работы с серверной частью web-приложения. На этом языке написано большинство сайтов, которые на данный момент существуют и используются в сети интернет. Из-за свой простоты и быстрого входа в разработку на данном языке программирования, он и получил такую популярность. Для него написано множество библиотек и frameworks, наиболее популярными из них являются: Laravel и Symfony [15].

Фреймворк Laravel достаточно молодой проект, разработанный в 2011 году, но несмотря на это, Laravel является полностью зрелым продуктом, и он уже успел громко заявить о себе. По результатам онлайн-опроса, проведенного на портале SitePoint, большинство PHP-разработчиков выбирают данный фреймворк. Данный выбор обусловлен тем, что Laravel решает ряд специфических проблем PHP, например, в фреймворке реализован элегантный синтаксис, который увеличивает читабельность кода и уменьшает его объем. Также синтаксис проработан таким образом, чтобы упростить написание рутинных операции, а именно авторизация, кэширование, маршрутизация, управление сессиями и очередями. Laravel использует собственный шаблонизатор Blade и локальную среду разработки Homestead. Помимо всего прочего фреймворк включает в себя хостинг и платформу для развертывания приложений.

Symfony - свободный и бесплатный фреймворк, который использует шаблон проектирования MVC (Model-View-Controller), имеет огромные возможности, большое количество плагинов, регулярное обновления и хорошо проработанную документацию, работает только на PHP версии 5 и выше. Фреймворк разрабатывается большим количеством разработчиков, спонсируемых французской компанией Sensio. Symfony включает уже разработанный набор програмных реализаций способных решить самые разные задачи удовлетворить, будь то создание форм, маршрутизация, авторизация или разработка шаблонов.

2.1.3 Системы управления контентом

Системы управления контентом предназначены для ведения портала, не прибегая к программной составляющий. Самое широкое распространение получили системы управления контентом или CMS. CMS представляют из себя специальный интерфейс для работы с сайтом, автоматизированные системы удаления, добавления и редактирования какой-либо информации на сайте, дает полное управление наполнением сайта. CMS так же как и языки программирования имеют стремительный темп развития, с каждым днем их становится все больше и больше это дает разработчику новые возможности для разработки, а управление CMS становится в разы легче. Самыми популярными на сегодняшний день являются: CMS WordPress, Drupal и 1С-Битрикс.

WordPress - система управления контентом с открытым исходным кодом, написанная на PHP и использующая сервер базы данных MySQL. Изначально система разрабатывалась для решения конкретной задачи, а именно создания блогов, поэтому предлагаемая структура состоит из записей, категорий, и текстовых страниц. Благодаря широкому распространению и популярности WordPress быстро развивался и на данный момент мы имеем систему мощным расширяемым функционалом. С использованием данной системы создано 30% сайтов всего мира, разработано более 45 тысяч плагинов, которые позволяют создавать с помощью WordPress сайт любого типа, от блога до интернет-магазина. Данная CMS предлагает широкий выбор готовы шаблонов тем, с полностью настраиваемым дизайном, а открытый исходный код позволяет разрабатывать полностью собственные шаблоны. WordPress является полностью бесплатной и свободно-распространяемой системой.

Drupal - бесплатная и свободно распространяемая система управления контентом с открытым исходным кодом, написанная на PHP с использование шаблона проектирования MVC (Model-View-Controller), последняя версия системы использует фреймворк Symfony и используется как каркас веб-приложения. Архитектура Drupal позволяет использовать его для создания самых различных типов сайтов. Модульная архитектура системы реализует расширяемый функционал, при установке Drupal предоставляет единая категоризация всех видов содержимого, широкий набор свойств при построении рубрикаторов, поиск по содержимому, динамическое построение меню, разграничение доступа пользователей, поддержка XML-форматов, вложенность категорий любой глубины и другие.

1С-Битрикс - российская платная система управления контентом набравшая широкую популярность в последние годы. Имеет несколько типов лицензий: Малый бизнес, Бизнес и Enterprise. Лицензии Малый бизнес и Бизнес отличаются включенными функциональными модулями и стоимостью, а Enterprise нацелена на разработку нестандартных и высоконагруженных проектов, стоимость данной лицензии значительно выше. Главным плюсом 1С-Битрикс является безопасность разрабатываемых с помощью неё сайтов и реальная техническая поддержка. Функциональные модули позволяют реализовать сайт абсолютно любого типа.

Не беря в расчет коробочные решения, которые представлены и описаны выше, существуют также сторонние open source системы управления контентом, одна из самых популярных системе - voyager.

Voyager - административная панель с полностью открытым кодом, которая включает в себя основные модули, в числе которых: взаимодействие с phpMyAdmin, упрощенное создание, редактирование и удаление таблиц.

2.1.4 Выбор инструментария для реализации интернет-портала

Проанализировав различные инструменты front-end разработки, back-end разработки и систем управления контентом, для реализации интернет-портала был выбран framework Laravel с административной панелью voyager. Основополагающим критерием выбора стали сроки реализации без потери качества и функционала разрабатываемого ресурса.

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

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

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

Для разработки клиентской части интернет-портала выбран стек технологий: HTML, CSS, JavaScript, framework Materialize с использованием библиотеки JQuery. Применение framework и библиотеки JQuery ещё сильнее сократит затраченное время на создание информационного портала.

2.2 Структурная схема

На основе поставленной задачи к разрабатываемому интернет-порталу, можно выделить 7 основных разделов: «О Нас», «Проекты», «Мероприятия», «Новости», «Документы», «Магазин», «Контакты». Главная страница является лицом сайта и помогает пользователю сориентироваться в своих дальнейших действия и оценить портал в целом.

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

Раздел «Проекты» является самым важным разделом интернет-портала, он объединяет в себе 6 направлений портала: всероссийская программа, кружок робототехники robo start, наука публикации конференции, digital и дизайн студия air creative group, конструкторы образовательной робототехники, международные и образовательные стажировки.

Раздел «Мероприятия» содержит информацию о текущих и прошедших мероприятиях, проводимых порталом, агентством или его парнерами.

Раздел «Новости» представляет из себя новостную ленту, в которую кураторы интернет-портала добавляют актуальные новости.

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

Раздел «Магазин» представляет из себя магазин сертификатов, о прохождении обучения по программам проводимых агентством.

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

При открытии интернет-портала пользователь попадает на главную страницу, которая демонстрирует его основные возможности и направления. Первым делом пользователь видит навигационное меню, представленное на рисунке 2.3. Дальше, он видит основные направления работы портала, представленные на рисунке 2.4, блок актуальных новостей, представленный на рисунке 2.5, блок проводимых мероприятий, представленных на рисунке 2.6, блок благодарностей, представленный на рисунке 2.7, блок партнеров, представленный на рисунке 2.8 и подвал портала, представленный на рисунке 2.9.

Описание каждого элемента представлено в таблице 2.1.

Таблица 2.1 - Описание элементов прототипа главной страницы

Описание каждого элемента представлено в таблице 2.2.

Таблица 2.2 - Описание элементов прототипа главной страницы

Описание каждого элемента представлено в таблице 2.3.

Таблица 2.3 - Описание элементов прототипа главной страницы

Описание каждого элемента представлено в таблице 2.4.

Таблица 2.4 - Описание элементов прототипа главной страницы