SlideShare a Scribd company logo
1 of 15
Download to read offline
Проектирование и реализация
 протокола динамического обмена
Перевод портала myAudience
    данными для веб-портала
            на AJAX
           myAudience      Дипломная работа
                                              студента группы С8503А
                                           Цыбенко Василия Сергеевича
                                                                           
                                                          Руководитель:
            начальник отдела перспективных технологий и видеоаналитики
                                                 ООО «Ронда Лимитед»
                                         Гаврик Александр Анатольевич
                                                                           
                                            Соруководитель от кафедры:
                                        Старший преподаватель кафедры
           Информатики, математического и компьютерного моделирования
                                            Кленин Александр Сергеевич
                  Владивосток, 2012 г.                                     
Программные продукты myAudience



myAudience-Measure




 myAudience-Count


                                  2
Метрика в myAudience-Measure

 ● Внимание
 ● Возрастная категория
 ● Пол
 ● Количество




                               3
myAudience Internet Portal

 ● Управление лицензиями
 ● Управление юнитами
 ● Получение статистических данных
 ● Настройка профиля пользователя




                                     4
myAudience Internet Portal. Организация

    Пользователи:      Разделы:
    ● Demo-аккаунт     ● Information
    ● Обычные          ● Groups & Units
      пользователи     ● Metrics
    ● Интеграторы      ● Licenses
                       ● Profile


                                          5
Имеющаяся реализация

Недостатки:
● Любая операция требует перезагрузки всей страницы
● Недостаточное разделение представления от логики
● Плохая организация программного кода

Следствия:
● Неудобство для пользователя
● Неэффектиная работа веб-приложения
● Сложности при поддержке и расширении функционала

                                                      7
Поставленные задачи

Серверная сторона:
● Разделить представление и логику
● Спроектировать протокол взаимодействия с клиентом
● Реализовать API


Клиентская сторона:
● Спроектировать архитектуру
● Реализовать интерактивное взаимодействие через
  AJAX
                                                      8
Требования к реализации

Серверная часть:
● Надежность и безопасность
● Гибкость при расширении протокола


Клиентская часть:
● Сохранения дизайна и интерфейса
● Простота поддержки программного кода
● Кроссбраузерность

                                         9
Серверная часть. Реализация

   Концепции:        Инструменты:
   ● Шаблонизатор     ● PHP 5.3
   ● JSON API         ● MySQL 5.5
                      ● Apache 2.2
                      ● Twig




                                     10
Сервер. Принцип обработки запросов




                                     11
Сервер. Архитектура




                      12
Клиент. Реализация

                  Client
                                   Инструменты:

                Controller         ● JavaScript
                                   ● HTML 4.01
         View                      ● Sass
                           Model

    Application                    ● jQuery
                                   ● Spine.js
                                   ● Underscore.js
                             DB




                                                     13
Клиент. Архитектура




                      14
Клиент. Организация контроллеров




                                   15
Заключение

  Технические аспекты:
  ● 1815 строк кода (~ 80 Kb) на PHP
  ● 3733 строк кода (~128 Kb) на JavaScript
  ● Система контроля версий SVN
  ● API содержит реализацию 40 команд



  Продакшн: portal.myaudience.com


                                              16

More Related Content

Viewers also liked

FMA2_Cepeda
FMA2_CepedaFMA2_Cepeda
FMA2_Cepedapolibok
 
Power point for anthropology102
Power point for anthropology102Power point for anthropology102
Power point for anthropology102hollietiger
 
Pemasangan sistem rangkaian komputer
Pemasangan sistem rangkaian komputerPemasangan sistem rangkaian komputer
Pemasangan sistem rangkaian komputernurnabila28
 
си хэлний ойлголт
си хэлний ойлголтси хэлний ойлголт
си хэлний ойлголтbadral_0430
 
Southern blot power point
Southern blot power pointSouthern blot power point
Southern blot power pointcarebeareyre
 
Tiyatro okullari-istanbul
Tiyatro okullari-istanbulTiyatro okullari-istanbul
Tiyatro okullari-istanbulzeynep_zyn84
 
Going Social - Tapping into Social Media for Nonprofit Success
Going Social - Tapping into Social Media  for Nonprofit SuccessGoing Social - Tapping into Social Media  for Nonprofit Success
Going Social - Tapping into Social Media for Nonprofit SuccessJason Kapler
 
GJU Certificate assistance
GJU Certificate assistanceGJU Certificate assistance
GJU Certificate assistanceAmer Sawalha
 
2 C Risk Fifo Woes Whitepaper
2 C Risk Fifo Woes  Whitepaper2 C Risk Fifo Woes  Whitepaper
2 C Risk Fifo Woes WhitepaperMarkCassidy
 

Viewers also liked (13)

Open Data Canvas 0.1
Open Data Canvas 0.1Open Data Canvas 0.1
Open Data Canvas 0.1
 
FMA2_Cepeda
FMA2_CepedaFMA2_Cepeda
FMA2_Cepeda
 
Power point for anthropology102
Power point for anthropology102Power point for anthropology102
Power point for anthropology102
 
Pemasangan sistem rangkaian komputer
Pemasangan sistem rangkaian komputerPemasangan sistem rangkaian komputer
Pemasangan sistem rangkaian komputer
 
си хэлний ойлголт
си хэлний ойлголтси хэлний ойлголт
си хэлний ойлголт
 
Southern blot power point
Southern blot power pointSouthern blot power point
Southern blot power point
 
Teorema de tales
Teorema de talesTeorema de tales
Teorema de tales
 
Tiyatro okullari-istanbul
Tiyatro okullari-istanbulTiyatro okullari-istanbul
Tiyatro okullari-istanbul
 
Going Social - Tapping into Social Media for Nonprofit Success
Going Social - Tapping into Social Media  for Nonprofit SuccessGoing Social - Tapping into Social Media  for Nonprofit Success
Going Social - Tapping into Social Media for Nonprofit Success
 
GJU Certificate assistance
GJU Certificate assistanceGJU Certificate assistance
GJU Certificate assistance
 
Cristo es el rey
Cristo es el reyCristo es el rey
Cristo es el rey
 
2 C Risk Fifo Woes Whitepaper
2 C Risk Fifo Woes  Whitepaper2 C Risk Fifo Woes  Whitepaper
2 C Risk Fifo Woes Whitepaper
 
Advanced-–-B2-C1-claudio-
Advanced-–-B2-C1-claudio-Advanced-–-B2-C1-claudio-
Advanced-–-B2-C1-claudio-
 

Similar to Presentation

Высокопроизводительные приложения на базе Windows Azure. Пример реального про...
Высокопроизводительные приложения на базе Windows Azure. Пример реального про...Высокопроизводительные приложения на базе Windows Azure. Пример реального про...
Высокопроизводительные приложения на базе Windows Azure. Пример реального про...UNETA
 
Высокопроизводительные приложения на базе Windows Azure
Высокопроизводительные приложения на базе Windows AzureВысокопроизводительные приложения на базе Windows Azure
Высокопроизводительные приложения на базе Windows AzureAlexander Feschenko
 
Эволюция к Behavior Driven Development на примере популярного фреймворка JBehave
Эволюция к Behavior Driven Development на примере популярного фреймворка JBehaveЭволюция к Behavior Driven Development на примере популярного фреймворка JBehave
Эволюция к Behavior Driven Development на примере популярного фреймворка JBehaveReturn on Intelligence
 
Андрей Завадский "Бессерверная архитектура"
 Андрей Завадский "Бессерверная архитектура" Андрей Завадский "Бессерверная архитектура"
Андрей Завадский "Бессерверная архитектура"Fwdays
 
RST2014_Taganrog_IncodingFramework
RST2014_Taganrog_IncodingFrameworkRST2014_Taganrog_IncodingFramework
RST2014_Taganrog_IncodingFrameworkRussianStartupTour
 
Внедрение зависимостей в ASP.NET MVС и ASP.NET vNext
Внедрение зависимостей в ASP.NET MVС и ASP.NET vNextВнедрение зависимостей в ASP.NET MVС и ASP.NET vNext
Внедрение зависимостей в ASP.NET MVС и ASP.NET vNextGoSharp
 
Лучшие практики корпоративной разработки. Лекция 0: обзор курса.
Лучшие практики корпоративной разработки. Лекция 0: обзор курса.Лучшие практики корпоративной разработки. Лекция 0: обзор курса.
Лучшие практики корпоративной разработки. Лекция 0: обзор курса.Vadim Martynov
 
Архитектурные решения при создании облачного сервиса на Asp.Net
Архитектурные решения при создании облачного сервиса на Asp.NetАрхитектурные решения при создании облачного сервиса на Asp.Net
Архитектурные решения при создании облачного сервиса на Asp.NetGoSharp
 
Selenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindings
Selenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindingsSelenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindings
Selenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindingsCOMAQA.BY
 
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)Ontico
 
Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...
Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...
Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...Cisco Russia
 
Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...
Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...
Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...Ilya Kaznacheev
 
Программное обеспечение для внутреннего аудита
Программное обеспечение для внутреннего аудитаПрограммное обеспечение для внутреннего аудита
Программное обеспечение для внутреннего аудитаProkhor Proshkin
 
Management of projects
Management of projectsManagement of projects
Management of projectsMageCloud
 
IT-инфраструктура. FAQ для разработчика
IT-инфраструктура. FAQ для разработчикаIT-инфраструктура. FAQ для разработчика
IT-инфраструктура. FAQ для разработчикаMikhail Chinkov
 
Специфика рендеринга vue.js-приложений на сервере, Алексей Клюев
Специфика рендеринга vue.js-приложений на сервере, Алексей КлюевСпецифика рендеринга vue.js-приложений на сервере, Алексей Клюев
Специфика рендеринга vue.js-приложений на сервере, Алексей КлюевMail.ru Group
 

Similar to Presentation (20)

Высокопроизводительные приложения на базе Windows Azure. Пример реального про...
Высокопроизводительные приложения на базе Windows Azure. Пример реального про...Высокопроизводительные приложения на базе Windows Azure. Пример реального про...
Высокопроизводительные приложения на базе Windows Azure. Пример реального про...
 
Высокопроизводительные приложения на базе Windows Azure
Высокопроизводительные приложения на базе Windows AzureВысокопроизводительные приложения на базе Windows Azure
Высокопроизводительные приложения на базе Windows Azure
 
Эволюция к Behavior Driven Development на примере популярного фреймворка JBehave
Эволюция к Behavior Driven Development на примере популярного фреймворка JBehaveЭволюция к Behavior Driven Development на примере популярного фреймворка JBehave
Эволюция к Behavior Driven Development на примере популярного фреймворка JBehave
 
Андрей Завадский "Бессерверная архитектура"
 Андрей Завадский "Бессерверная архитектура" Андрей Завадский "Бессерверная архитектура"
Андрей Завадский "Бессерверная архитектура"
 
RST2014_Taganrog_IncodingFramework
RST2014_Taganrog_IncodingFrameworkRST2014_Taganrog_IncodingFramework
RST2014_Taganrog_IncodingFramework
 
Внедрение зависимостей в ASP.NET MVС и ASP.NET vNext
Внедрение зависимостей в ASP.NET MVС и ASP.NET vNextВнедрение зависимостей в ASP.NET MVС и ASP.NET vNext
Внедрение зависимостей в ASP.NET MVС и ASP.NET vNext
 
Лучшие практики корпоративной разработки. Лекция 0: обзор курса.
Лучшие практики корпоративной разработки. Лекция 0: обзор курса.Лучшие практики корпоративной разработки. Лекция 0: обзор курса.
Лучшие практики корпоративной разработки. Лекция 0: обзор курса.
 
Архитектурные решения при создании облачного сервиса на Asp.Net
Архитектурные решения при создании облачного сервиса на Asp.NetАрхитектурные решения при создании облачного сервиса на Asp.Net
Архитектурные решения при создании облачного сервиса на Asp.Net
 
Selenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindings
Selenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindingsSelenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindings
Selenide –  лаконичные тесты на Selenium 2 WebDriver + Java bindings
 
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
 
Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...
Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...
Кросс-доменная автоматизация (DC-WAN- Campus) - как собрать единую систему, и...
 
Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...
Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...
Анна Якубенко, Татьяна Лебедева - SAP ERP в качестве backend для HTML5 прилож...
 
Behavior Driven Development
Behavior Driven DevelopmentBehavior Driven Development
Behavior Driven Development
 
Программное обеспечение для внутреннего аудита
Программное обеспечение для внутреннего аудитаПрограммное обеспечение для внутреннего аудита
Программное обеспечение для внутреннего аудита
 
Diplom 1
Diplom 1Diplom 1
Diplom 1
 
Management of projects
Management of projectsManagement of projects
Management of projects
 
Agile
AgileAgile
Agile
 
IT-инфраструктура. FAQ для разработчика
IT-инфраструктура. FAQ для разработчикаIT-инфраструктура. FAQ для разработчика
IT-инфраструктура. FAQ для разработчика
 
Специфика рендеринга vue.js-приложений на сервере, Алексей Клюев
Специфика рендеринга vue.js-приложений на сервере, Алексей КлюевСпецифика рендеринга vue.js-приложений на сервере, Алексей Клюев
Специфика рендеринга vue.js-приложений на сервере, Алексей Клюев
 
Java Presentation.pptx
Java Presentation.pptxJava Presentation.pptx
Java Presentation.pptx
 

Presentation

  • 1. Проектирование и реализация протокола динамического обмена Перевод портала myAudience данными для веб-портала на AJAX myAudience Дипломная работа студента группы С8503А Цыбенко Василия Сергеевича   Руководитель: начальник отдела перспективных технологий и видеоаналитики ООО «Ронда Лимитед» Гаврик Александр Анатольевич   Соруководитель от кафедры: Старший преподаватель кафедры Информатики, математического и компьютерного моделирования Кленин Александр Сергеевич Владивосток, 2012 г.  
  • 3. Метрика в myAudience-Measure ● Внимание ● Возрастная категория ● Пол ● Количество 3
  • 4. myAudience Internet Portal ● Управление лицензиями ● Управление юнитами ● Получение статистических данных ● Настройка профиля пользователя 4
  • 5. myAudience Internet Portal. Организация Пользователи: Разделы: ● Demo-аккаунт ● Information ● Обычные ● Groups & Units пользователи ● Metrics ● Интеграторы ● Licenses ● Profile 5
  • 6. Имеющаяся реализация Недостатки: ● Любая операция требует перезагрузки всей страницы ● Недостаточное разделение представления от логики ● Плохая организация программного кода Следствия: ● Неудобство для пользователя ● Неэффектиная работа веб-приложения ● Сложности при поддержке и расширении функционала 7
  • 7. Поставленные задачи Серверная сторона: ● Разделить представление и логику ● Спроектировать протокол взаимодействия с клиентом ● Реализовать API Клиентская сторона: ● Спроектировать архитектуру ● Реализовать интерактивное взаимодействие через AJAX 8
  • 8. Требования к реализации Серверная часть: ● Надежность и безопасность ● Гибкость при расширении протокола Клиентская часть: ● Сохранения дизайна и интерфейса ● Простота поддержки программного кода ● Кроссбраузерность 9
  • 9. Серверная часть. Реализация Концепции: Инструменты: ● Шаблонизатор ● PHP 5.3 ● JSON API ● MySQL 5.5 ● Apache 2.2 ● Twig 10
  • 12. Клиент. Реализация Client Инструменты: Controller ● JavaScript ● HTML 4.01 View ● Sass Model Application ● jQuery ● Spine.js ● Underscore.js DB 13
  • 15. Заключение Технические аспекты: ● 1815 строк кода (~ 80 Kb) на PHP ● 3733 строк кода (~128 Kb) на JavaScript ● Система контроля версий SVN ● API содержит реализацию 40 команд Продакшн: portal.myaudience.com 16