Эта статья является продолжением туториала, который рассказывает о том, как разрабатывать веб-сайт с WEBIX и Struts 2.
В этой части вы узнаете о том, как создать страницы «Предстоящие события» и «Контакты», а также о том, как добавить информацию о событиях и затем редактировать ее.
Страница с предстоящими событиями будет выглядеть следующим образом:
Мы рады представить вам версию 1.9 JavaScript UI библиотеки Webix для создания быстрых HTML5 веб-приложений. Новая версия включает в себя некоторые изменения пользовательского интерфейса, которые ускоряют разработку веб-приложений, скины, которые стали еще лучше, и исправление некоторых ошибок.
Возможность использования горячих клавиш изначально включена в API библиотеки. Однако создать горячие клавиши для контролов можно было только с помощью кастомных функций.
С выходом новой версии библиотеки появилась возможность задавать горячие клавиши для элементов управления (инпуты, кнопки) при помощи одной строки кода.Нажатие на горячую клавишу воспринимается как клик на соответствующий инпут/контрол, на который переводится фокус и происходит вызов всех прикрепленных обработчиков.
С каждым наша жизнь становится все быстрее. Новости распространяются по миру за считанные минуты, а поиск информации сводится к выходу в интернет. Воплощение новых идей теперь занимает не месяцы и годы, а дни и недели. Вместе с тем на новый виток скорости выходит и процесс разработки приложений и сайтов. Инструменты для создания сайтов становятся все более продвинутыми и одновременно/в то же время простыми в использовании.
Генераторы кода, автокомплиты, анализаторы кода, библиотеки и фреймворки прочно вошли в жизнь разработчиков. Все эти инструменты позволяют сократить время разработки сайта до минимума. Одновременно с ними развивается и сам интернет. Если раньше сайты представляли собой статическую информацию с минимальной функциональностью, то сейчас они являются полноценными приложениями, позволяющими выполнять все то, что раньше можно было сделать только на десктопе. Одним из таких инструментов для быстрого создания интерфейса веб-приложения является JavaScript библиотека Webix.
Давайте рассмотрим пример того, как можно создать сайт для анонсирования предстоящих конференций по front-end разработке, используя Webix и Java-фреймворк Struts 2.
Вот что у вас должно получится в результате выполнения всех шагов данного туториала:
С Webix вы можете создавать веб-приложения, которые будут работать одинаково хорошо как на мобильных, так и на декстопных устройствах. Однако данные приложения по-прежнему будут html5-приложениями. Для разработки нативных приложений вам понадобится такой инструмент, как PhoneGap.
PhoneGap — бесплатный фреймворк с открытым исходным кодом. С PhoneGap вы можете разрабатывать мобильные приложения со стандартным веб-API для всех используемых вами платформ. Кроме того, Phonegap работает на базе HTML5 и позволяет создавать нативные приложения для всех основных мобильных ОС: IOS, Android, Windows Phone и других.
В этой статье мы опишем процесс создания простого нативного приложения с помощью инструментов Webix и PhoneGap.
Получить окончательный код приложения можно на GitHub.
Webix был обновлен до версии 1.8, которая включает в себя приятные бонусы для наших пользователей. Одни из них — это техники построения адаптивных приложений. В Webix 1.8 был также улучшен пользовательский интерфейс и исправлены некоторые ошибки.
Ранее, при разработке десктопных веб-приложений с Webix, существовала проблема адаптации этих приложений для мобильных устройств. Десктопные приложения были слишком большими, для того чтобы уместиться на небольшом экране, и при этом выглядеть привлекательно.
В Webix 1.8 мы добавили 2 новые возможности, которые сделают ваше приложение адаптивным и улучшат его юзабилити как на десктопных, так и на мобильных устройствах.
Для более подробного изучения новой функциональности библиотеки предлагаем вам рассмотреть адаптивное веб-приложение, созданное при помощи Webix.
Вот как выглядит десктопное веб-приложение:
При уменьшении окна браузера вкладки компонента Tabbar, которые не вместились в видимую часть экрана, преобразуются в обычную кнопку, к которой прикреплен компонент popup list (вместо кнопки может быть вкладка таббара).
Создавайте красивые графические интерфейсы с помощью JS библиотеки
