CC BY
40
Емельченков Е.П.1, Мунерман В.И.2, Самойлова Т.А.3
1Смоленский государственный университет, г. Смоленск, заведующий кафедрой информатики, доцент, ypy 1101@ gmail . co m 2Смоленский государственный университет, г. Смоленск, доцент кафедры информатики,
3Смоленский государственный университет, г. Смоленск, доцент кафедры информатики,
tatsam@hotbox. ru
О содержании учебного курса «Гибридные приложения для мобильных устройств»
КЛЮЧЕВЫЕ СЛОВА
Гибридное мобильное приложение, среда разработки, HTML5, Apache Cordova, Windows Phone, MVC, WCF, СУБД.
АННОТАЦИЯ
В статье приводится краткое описание ИТ-технологий, лежащих в основе учебного курса, ориентированного на начинающих разработчиков гибридных мобильных приложений. Курс иллюстрирует основные возможности средств разработки в средах Visual Studio и WebMatrix с применением технологии Apache Cordova и неотъемлемых от неё HTML5, CSS3 и JavaScript. Рассмотрены технологии с ориентацией на платформы Microsoft: Windows и Windows Phone.
Информационные системы для мобильных устройств занимают большой сектор рынка всевозможных программ в области бизнес-аналитики и data mining. Поэтому актуально обучение студентов технологиям их создания. Cущность гибридных мобильных приложений составляет нативный мобильный виджет - несетевое приложение, имеющее доступ к ресурсам мобильного устройства (камера, акселерометр, компас, файловая система, контакты, локальная память и т.д.) и выполняющее обработку данных, периодически взаимодействуя с серверным веб-приложением [1]. Мобильные виджеты, создаваемые, главным образом, средствами языка HTML5, можно считать наиболее перспективными по следующим причинам:
• Количество мобильных платформ в будущем будет только возрастать. Уже сейчас для обеспечения совместимости с максимальным количеством устройств, требуется создавать приложения для iPhone, Android, Palm Pre, Windows Phone, Symbian, Bada, а также приложение Java ME. Даже в этом случае невозможно охватить все мобильные платформы. Код, основанный на средствах HTML5, можно использовать для всех платформ.
• Условия рынка требуют быстрой реакции. Невозможно тратить месяцы на программирование своих мобильных клиентских приложений. Виджеты можно создавать достаточно быстро.
• Каждый производитель мобильных устройств уже реализовал поддержку виджетов или аналогичной технологии, либо планирует реализовать такую поддержку в ближайшем будущем.
• Виджет может послужить отличным дополнением к мобильному веб-приложению. Применив тот же код, что и версия мобильного приложения, виджет может предложить другие возможности, например, интеграцию с веб-сервисом.
• Виджеты могут присутствовать на экране мобильного устройства постоянно, не требуя вызова браузера и ввода URL-адреса.
• При проектировании виджетов применяются широко известные технологии программирования (HTML, JavaScript, CSS и Ajax), для которых доступно большое количество технических ресурсов и подготовленных специалистов.
• Для проектировании виджетов можно использовать библиотечные средства HTML5, не дожидаясь появления библиотечных средств для каждого нового мобильного устройства.
• Достаточно легко выполняется перенос мобильных виджетов на платформу настольных виджетов и в обратном направлении.
• Возможно распространение виджетов бесплатно или продажа их через магазины производителей устройств.
Вместе с тем применение данной технологии сопряжено с рядом проблем:
1. Отладка требует больших усилий по сравнению с простыми мобильными или веб-приложениями.
2. Виджет не является «родным» приложением, поэтому обеспечивает не лучшую производительность в сравнении с другими решениями.
3. Виджеты не подходят для создания некоторых типов приложений (этот круг постоянно сужается, например, за счет использования игровых виджетов).
4. Виджеты являются не простыми сайтами, а полноценными приложениями, включающими JavaScript. Применение хороших практик и приемов программирования при этом является обязательным.
5. В виджетах нельзя создавать трехмерные эффекты (или, по крайней мере, пока не рекомендуется из-за плохого быстродействия).
6. В настоящее время в виджетах сложно или невозможно реализовать процессы с интенсивной загрузкой процессора, такие как распознавание изображений, AR-решения или распознавание голоса. Согласно [2], гибридный мобильный виджет для бизнеса
представляет собой хороший компромисс между:
• дорогостоящим созданием уникального для каждой платформы приложения с возможностями доступа к встроенным аппаратным ресурсом;
• дешевым вариантом создания веб-приложения, где отсутствует доступ к аппаратным ресурсам, но имеются неограниченные возможности доступа к данным большого объема.
Для многих бизнес-сценариев предпочтительны варианты с виджетом, так как дополнительные усилия и расходы на создание уникальных приложений для каждой мобильной платформы могут перевесить все выгоды для бизнеса. Очевидно, что мобильные приложения для бизнеса будут и впредь набирать значимость по мере переноса вычислений с традиционных настольных ПК на разнообразные мобильные устройства.
В качестве ведущей технологии для гибридных приложений мобильных устройств целесообразно использовать open-source фреймворк Apache Cordova [3]. Этот фреймворк позволяет создавать приложения для мобильных устройств средствами HTML5, без основных языков программирования (C#, Java, Objective-C), под все мобильные операционные системы (Windows Phone, iOS, Android, Bada и т. д.). Нередко этот фреймвок, являющийся промежуточным слоем между средой выполнения мобильного приложения и JavaScript API, называют «оберточным» (wrapper) компонентом разработки мобильных приложений. Возможности Apache Cordova для доступа к ресурсам мобильного устройства при программировании виджетов основаны на API-функциях JavaScript, включенных в HTML5. В их состав входят такие JavaScript API-функий как HTML5 Audio, HTML5 Video, Canvas, localStorage, DeviceStorage API, Contacts API, Geolocation API, Mobile Connection API, WebSMS, WiFi Information API, Camera API. Разработчику предоставлены два способа их применения. Первый заключается в непосредственном использовании свойств и методов объектов из соответствующих JavaScript API-функций. Второй, более сложный для реализации программистом, - в употреблении готовых Cordova-плагинов посредством содержащихся в них объектов camera, storage, file, contacts, accelerometer, device, globalization и ряде других. Начиная с версии Cordova-3.0.0, соответствующие плагины входят в поставку отдельными zip-архивами, каждый из которых можно независимо от остальных добавить в проект по прилагаемым инструкциям. Примеры гибридных мобильных приложений, созданных на базе этого фреймворка, выложены на сайтах [4,5]. Компания Microsoft, развивающая стратегию разработки для Windows Phone, также поддерживает Cordova и HTML5 в сфере мобильных программ [6]. Microsoft стремится обеспечить программистам платформу, которая позволит им воспользоваться имеющимися навыками и технологиями для быстрого создания приложений.
Главный инструмент создания мобильных виджетов - это язык программирования JavaScript, представляющий собой сильнейшую составляющую спецификаций HTML5. Формально HTML5 определен организацией международных стандартов World Wide Web Consortium (W3C), он состоит из более 100 спецификаций, относящихся к веб-технологиям нового поколения. В настоящее время HTML5 - это шаг к созданию единого подхода к созданию веб-страниц для разных устройств, включая настольные компьютеры, мобильные смартфоны, телевизионные и игровые консоли. Такой подход называется принципом «единого Интернета» («One Web»). В некоторой степени, это возможно уже сейчас, однако полной реализации принципа единого Интернета в ближайшие несколько лет ожидать не следует. Необходимо учитывать, что при программировании мобильных приложений в качестве целевой платформы выступают устройства, очень сильно отличающиеся от настольных компьютеров. Одна из проблем состоит в том, что ситуации, в которых применяются мобильные устройства, зачастую в крайней степени отличаются от тех комфортабельных условий, в которых мы используем наши настольные компьютеры и даже ноутбуки и нетбуки. Поэтому обеспечение приемлемой функциональности в среде мобильного устройства требует некоторого учета их особенностей. HTML5 [7] облегчает создание приложений для мобильных устройств и относится к числу технологий, которые стимулируют развитие мобильных сервисов на основе облачных вычислений, предоставляя разработчикам следующие возможности:
- теги с описательными названиями, которые точно указывают, для содержания какого контента предназначены эти теги;
- усовершенствованные сетевые коммуникации;
- существенно улучшенное хранение данных;
- улучшенное извлечение хранящихся данных;
- повышенная скорость сохранения и загрузки страниц;
- поддержка CSS3 при управлении пользовательским интерфейсом, что обеспечивает контентную ориентированность HTML5;
- улучшенная обработка форм в браузере;
- API-интерфейс баз данных на основе SQL, позволяющий применять локальное хранилище на стороне клиента;
- теги canvas и video, позволяющие добавлять графические и видеоматериалы без установки сторонних подключаемых модулей;
- спецификация API-интерфейса Geolocation, включающая геолокационные возможности смартфонов в интересах задействования облачных сервисов и приложений для мобильных устройств;
- усовершенствованные формы, ослабляющие потребность в загрузке кода JavaScript, что обеспечивает более эффективную связь между мобильными устройствами и серверами doud-среды.
Фактически HTML5 является синонимом непрерывных инноваций:
новые теги, новые методики и общая инфраструктура разработки, базирующаяся на взаимодействии новой разметки HTML5 с родственными технологиями CSS3 и JavaScript. В то время как HTML5-разметка остается каркасом мобильных гибридных приложений, разрабатываемых средствами фреймворка Apache Cordova, интеллектом, оживляющим большинство клиентских приложений (виджетов), является язык программирования JavaScript. Именно обновленный и усовершенствованный в настоящее время JavaScript стал тем языком, благодаря которому программисты могут предложить огромное количество новшеств и реализовать то, чего раньше попросту не существовало. Все это создает прочную основу для функционирования приложений, ориентированных на мобильных клиентов.
Технологии сохранения таких гибридных приложений включают как средства хранения локальных данных непосредственно на мобильном устройстве, так и средства доступа к данным на сервере. Сохранение данных в памяти мобильного устройства, например, в файле Cardova-приложения для Windows Phone (*.xap), стало возможным благодаря новой спецификации HTML5 - API Web Storage (веб-хранилище). Ориентируясь на особенности мобильных устройств, появление облачных вычислений и необходимость стандартизировать технологии и инновации, внедряемые в течение многих лет посредством встраиваемых модулей, разработчики HTML5 объединили в этой спецификации всю функциональность, позволяющую выполнять полноценные приложения на пользовательских компьютерах даже в отсутствие сетевого подключения. API Web Storage позволяет записывать наборы данных в память мобильного устройства и обращаться к ним так, как это делается в базах данных настольных приложений. Процессы сохранения и извлечения данных, поддерживаемые этим API, применимы в двух ситуациях: когда информация должна быть доступна только в течение работы приложения и когда ее необходимо сохранить надолго, до тех пор, пока пользователь сам не удалит ее.
При наличии в мобильном приложении данных значительного объема, они могут храниться на сервере, как и в случае обычных веб-приложений. Например, для них могут применяться различные модификации СУБД Microsoft SQL Server:
• Compact - простая СУБД в виде одной библиотеки;
• Express - бесплатная полнофункциональная СУБД;
• Web, Standard, Enterprise - расширенные редакции с дополнительными возможностями.
Следует отметить активную роль Microsoft в поддержке и развитии технологий создания гибридных приложений. Во-первых, в развитии стандарта HTML, работа над которым продолжается и окончательную версию 5.1 планируют утвердить к 2016 году. Во-вторых, Microsoft обеспечивает на мобильном устройстве реализацию HTML5 через браузер
Internet Explorer, функционал которого аналогичен настольной версии. Помимо поддержки спецификаций HTML5 в браузере, еще в начале 2011 года Microsoft обновила два своих продукта - Visual Studio и WebMatrix [8], включив туда удобные инструменты для гибридных приложений. В пакеты обновлений был включен тип документов HTML5, а в Visual Studio включен шаблон проекта Apache Cordova, имеющий возможность представить мобильный виджет для Windows Phone в виде приложения. Далее приводятся технологии Microsoft, предназначенные для создания как клиентской, так и серверной составляющей гибридных приложений. При этом серверная часть может быть веб-приложением или веб-сервисом.
WebMatrix - упрощенная среда создания мобильных и веб-приложений небольшой и средней сложности, принадлежит к классу систем управления контентом (Content Management System - CMS). Удобное средство создания гибридных мобильных приложений, которое с успехом применяют новички и профессионалы. Все функции этой среды направлены на то, чтобы сделать работу над проектом легкой и удобной. Она представляет собой конструктор, с помощью которого можно создавать и сопровождать проект (обновлять и добавлять материалы, заводить новые рубрики). В WebMatrix входят определённые готовые пункты, которые можно включить в сайт серверной части: новости, статьи, информация о фирме, контактные данные, прайс-лист и другие, которыми можно управлять в разделе администрирования сайта. WebMatrix предлагает разнообразные шаблоны для клиентской части, которые хорошо работают на мобильных устройствах. Они построены с учетом передового опыта для JQuery Mobile, HTML5 и CSS3. Среда JQuery Mobile, встроенная в WebMatrix и доступная редактору кода, является сенсорной средой создания веб-сайтов и мобильных приложений для популярных смартфонов и планшетов. При этом работу проекта можно тут же увидеть в эмуляторах мобильных устройств: Windows Phone, iPhone, iPad и т.п. С помощью готовых шаблонов, можно создать как клиентскую, так и серверную часть гибридного приложения в считанные минуты. Среда включает в себя компактную систему управления базами данных SQL Server Compact, которая полностью интегрируется с другими компонентами проекта. Если в мобильном приложении ожидается большое количество запросов, то можно с легкостью перенести свои данные на высокопроизводительную версию SQL Server. В состав среды входит функциональный редактор кода, редактор баз данных, система администрирования веб-сервера. Имеется система оптимизации для поисковых машин и многие другие функции. Таким образом, в одном удобном интерфейсе WebMatrix доступны все ключевые компоненты, необходимые для создания и развертывания гибридного приложения.
Visual Studio - полноценная среда для создания приложений любой сложности, более сложная, чем WebMatrix. Клиентская часть гибридного приложения может быть сознана на основе шаблонов Apache Cordova или
шаблона мобильного приложения WindowsPhone, который отлично интегрируется с веб-сервисами WCF. Основная технология для создания серверной части гибридных мобильных приложений - это ASP.NET (Active Server Page). ASP.NET [9] поддерживает несколько различных подходов для программирования серверных сценариев: WebForms - традиционный подход создания веб-приложений; MVC — подход, построенный на разделении данных, логики и интерфейса приложений, требует большего написания кода, чем WebForms; WCF (Windows Communication Foundation) -подход, основанный на веб-службах для распределенных приложений.
Фреймворк MVC - "Модель-представление-контроллер" ("Model-viewcontroller") давно нашел применение в программировании. Этот фреймворк зарекомендовал себя как удачная архитектура программного обеспечения. На данный момент MVC реализован в том или ином виде для большинства языков программирования. MVC - это представление приложения, которое отделяет логическую часть от визуальной.
Модель ^odel) представляет собой структуру данных, набор классов, описывающих предметную область. Обычно модельные классы содержат функционал, помогающий извлекать, вставлять и обновлять информацию в базе данных.
Вид (view) - содержит HTML-разметку и контент, отправляемый в браузер. Это пользовательский интерфейс приложения.
Контроллер (controller) - набор классов, которые содержат бизнес-логику приложения, отвечая за то, что будет выдано пользователю при его запросе. Обеспечивает связь между пользователем и системой, обычно связь между View и Model.
В MVC4 мобильным устройствам уделяется большое внимание. В ASP.NET MVC 4 для мобильных устройств появились:
• шаблон проекта, рассчитанный только на мобильные браузеры;
• методика адаптивного рендеринга;
• возможность устанавливать компоненты: jQuery Mobile.
Адаптивный рендеринг (adaptive rendering) - это процесс
отображения страницы по-разному, в зависимости от возможностей целевого мобильного устройства, позволяет изменять стиль контента как угодно в зависимости от возможностей устройства. jQuery Mobile -библиотека с открытым исходным кодом, позволяющая создавать пользовательский интерфейс для мобильных устройств на основе Java Script.
WCF — платформа корпорации Майкрософт нового поколения для построения безопасных распределенных интернет-систем. Предоставляет гибридным приложениям доступ к базам данных и другие функциональные возможности серверной части, которые вызваются мобильным клиентом без браузера.
Web Forms, MVC и WCF могут великолепно сосуществовать в пределах
одного и того же гибридного приложения. По мнению специалистов Microsoft, для создания мобильных программ лучше подходит ASP.NET MVC, чем ASP.NET WebForms. Причинами проблемы с веб-формами ASP.NET для мобильных устройств является то, что в среде их разработки не всегда имеется полный контроль над HTML. Контроль может быть усилен с помощью адаптеров элементов управления, что приведет к дополнительной работе по адаптации страниц к небольшим мобильным экранам и увеличит время загрузки.
Современные проекты гибридных мобильных приложений могут устанавливать связь между мобильными устройствами и серверами cloud-среды (облаками). Для разработчиков iOS, Windows Phone, Android и мобильных HTML5-приложений Microsoft предлагает использовать мобильный сервис Windows Azure Mobile Services [10]. Мобильные разработчики, применяющие Windows Azure Mobile Services, получают единую инфраструктуру для всех своих мобильных приложений, содержащую:
• реляционное хранилище табличных данных и файлов;
• готовую настроенную платформу для создания и запуска серверного кода на базе JavaScript и Node.js (а вскоре и на базе .NET). Платформа позволяет писать скрипты для обработки событий таблиц реляционного хранилища (вставку данных, удаление, чтения и обновления данных).
Работа со всеми элементами Windows Azure Mobile Services возможна посредством функций открытого и документированного API, что делает применение ее платформ весьма удобным.
На основе рассмотренных технологий авторы создали учебный курс [11] (по договору с ООО "ИНТУИТ.РУ" в рамках конкурса "Разработка приложений для платформы Microsoft: Windows 8, Windows Phone, Windows Azure"). Использование этого курса в процессе обучения программистов позволит готовить специалистов, способных решать различные сложные аналитические задачи, в том числе для таких современных направлений, как Data Mining и Business Intellegence.
Литература
1. Фиртман М. Веб-программирование для мобильных устройств. — ООО "Рид Групп", 2012
2. Шейн Ч. Разработка гибридных веб-приложений, способных использовать аппаратные средства мобильных устройст. // журнал MSDN Magazine, март 2012, URL: http://msdn.microsoft.com/ru-ru/magazine/hh852592.aspx
3. Открытое программное обеспечение Apache Cordova./ URL: http://cordova.apache.org/
4. URL:http://www.icenium.com/cordova-phonegap-mobile-app-development/sample-apps
5. URL:http:// phonejs.devexpress.com
6. Колин Э. Разработка HTML5-приложений Windows Phone с применением Apache Cordova. // журнал MSDN Magazine, май 2012, URL:http://msdn.microsoft.com/ru-ru/magazine/hh975345.aspx
7. Сухов К. HTML5 — путеводитель по технологии. — ДМК Пресс, 2013
8. Кларк С. Введение в WebMatrix. .. URL: http://msdn.microsoft.com/ru-ru/magazine/gg983489.aspx
9. Веб-сайты ASP.NET для мобильных устройств. .. URL: http://msdn.microsoft.com/ru-ru/library/ms178619.aspx
10. Облачный бэкенд как сервис для Windows, Ios, Windows Phone, Android и мобильных HTML5-приложений. // URL: http://msdn.microsoft.com/ru-ru/dn271646.aspx
11. Самойлова Т.А., Разработка гибридных приложений для мобильных устройств под Windows Phone/ // URL: http://www.intuit.ru/studies/courses/12574/1187/info
