Глава 3. Реализация программы

3.1 Выбор среды и инструментов разработки

Сервис решено разрабатывать в виде веб приложения, для достижения кроссплатформенности. Существенное преимущество построения веб-приложений для поддержки стандартных функций браузера заключается в том, что функции должны выполняться независимо от операционной системы данного клиента. Вместо того, чтобы писать различные версии для Microsoft Windows, Mac OS X, GNU/Linux и других операционных систем, приложение создаётся один раз для произвольно выбранной платформы и на ней разворачивается.

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

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

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

Серверная часть получает запрос от клиента, выполняет вычисления, после этого формирует веб-страницу и отправляет её клиенту по сети с использованием протокола HTTP.

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

Таблица 5 – Языки программирования веб-приложения на стороне сервера

Название языка	Лицензия	Веб-сервер
ASP	проприетарная	специализированный
C/C++	свободная	любой
Java	свободная	любой
Perl	свободная	любой
PHP	свободная	любой
Python	свободная	любой
Ruby	свободная	любой
Nodejs	MIT License	собственный

 

Языки программирования и технологии, которые используются на стороне клиента (Frontend) для реализации GUI:

- HTML, XHTML;

- CSS, SASS, LESS.

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

- ActiveX;

- Adobe Flash, Adove Flex;

- Java;

- Javascript;

- Silverlight.

Язык программирования должен предоставить нам средства для решения поставленной задачи. Благодаря своей богатой функциональности PHP отлично подходит для решения широкого спектра задач. Язык php, не имеет строгой типизации, поэтому достаточно прост в использовании. Так как PHP является встраиваемым языком, это дает чрезвычайную гибкость в процессе разработки. Чаще всего сценарии PHP интегрируются в HTML страницы, но при необходимости могут встраиваться и в JavaScript, WML, XML и другие языки.

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

Одним из самых больших преимуществ PHP является поддержка большого числа баз данных (более 20 видов). Кроме того, PHP поддерживает DBX для работы на абстрактном уровне и ODBC, что позволяет работать с любой базой данных, поддерживающей эти стандарты.

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

В выборе IDE, остановимся на JetBrains PhpStorm IDE, так как она привычней и обладает массой плюсов в разработке.

 

 

Общая структура проекта

В качестве шаблона будем использовать YII2 Basic Template. Этот шаблон –

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

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

Рисунок 9 – структура директорий

 

- assets - папка с бандлами, управление статикой в проекте;

- commands - папка с контроллерами для консольных команд;

- config - все конфигурации проекта;

- controllers – контроллера;

- mail - шаблоны для писем;

- models - модели

- runtime - папка в которой хранятся логи, файловый кеш и тп.;

- tests - тесты для проекта;

- vendors - внешние зависимости;

- views - шаблоны проекта;

- web - вэб директория проекта.

Подготовка веб-интерфейса

Полезной особенностью выбранного фреймворка Yii2, является поддержка front-end CSS фреймворка Twitter Bootstrap 3.0.

Bootstrap, позволяет упростить разработку, с помощью HTML и CSS-шаблонов для оформления типографики, веб-форм, блоков, сетки, навигации итд.

Данный фреймворк мы используем, чтобы:

 

- Ускорить разработку;

- Реализовать адаптивный дизайн;

- Реализовать кроссбраузерность;

 

Фреймворк направлен на создание макета под различные устройства,

планшеты, смартфоны, так как масштабируется в зависимости от ширины.

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

Подключение Bootstrap к Yii2 выполняется с помощью оператора use.

 

Рисунок 10 – подключение Bootstrap

 

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

Чтобы реализовать веб-интерфейс разрабатываемого сервиса понадобятся определенные компоненты Bootstrap, указанные в таблице 8.

 

Таблица 6 – Используемые компоненты Bootstrap

 

Название компонента	Классы	Назначение
Grid-система	row,col	верстка колонками
Навигационная панель	navbar,nav	меню навигации
Групированный список	list-group	отображение подменю
Блок	jumbotron	отображение большого центрального блока
Форма ввода	form-group	форма для ввода данных
Уведомления	alert	вывод сообщений о статусе сообщения, пользовательских ошибках итд.
Форма вывода	form-control	форма для вывода информации

 

В качестве тестирования адаптивности проверяем веб-интерфейс с помощью встроенного отладчика в браузере Google Chrome, имитируя работу с сервисом на устройстве IPhone 6 (375x667).

Рисунок 11 – отображение интерфейса сервиса

на мобильном устройстве

 

3.4 Разработка базы данных для сервиса

Для хранения информации и параметров отправленных сообщений будет использоваться база данных Mysql.

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

 

3.5 Реализация функций на языке PHP

Для данного программного модуля был сделан HTML/СSS каркас с учетом отображения на различных расширений экранов устройств с помощью фреймворка Bootstrap.

Реализация Back-end-части, будет производиться на языке PHP, на заявленном фреймворке Yii2.

 

3.5.1 Шифрование данных bcrypt

3.6 Перспектива развития

3.7 Демонстрация работы сервиса

Рисунок 10.1 – создание приватного сообщения

 

Рисунок 10.2 – генерация уникальной ссылки

 

Рисунок 10.3 – запрашивание пароля для дешифрования

 

Рисунок 10.4 – получение дешифрованного сообщения

 

Заключение

В данном дипломном проекте разработана платформа для привлечения трафика с учетом его геолокации.

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

Для достижения поставленной цели были решены следующие задачи:

1. Выполнен анализ существующих открытых источников трафика;

2. Разработана платформа для привлечения трафика.

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

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

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