Webix Jet для быстрой разработки
Webix Jet - это микрофреймворк для одностраничных приложений, построенных с помощью библиотеки Webix UI. Он позволяет легко сочетать и повторно использовать различные UI компоненты приложения. Используя Webix Jet, вы можете с легкостью создавать и тестировать приложения. Webix Jet - это удобная разработка и элегантный лаконичный код.
Модули
Разрабатывая с Webix Jet, вы можете делить код приложения на не связанные между собой модули. Каждый модуль - это файл с JavaScript классом, который можно повторно использовать в других частях приложения. Даже очень сложные интерфейсы можно поделить на небольшие блоки, не зависящие друг от друга и удобные в тестировании.
1 import {JetView} from "webix-jet";
2 import header from "views/header";
3 import sidebar from "views/sidebar";
4
5 export default class TopView extends JetView {
6 config() {
7 return {
8 rows:[
9 header,
10 { cols:[ sidebar, { $subview:true } ]}
11 ]
12 };
13 }
14 }
Инструменты Webpack и возможности ES6
Webix Jet использует инструменты Webpack, что делает одностраничные приложения легко конфигурируемыми. Вы можете писать код со всеми новшествами ES6, использовать LESS/SASS для стилизации приложения и использовать любые ресурсы, подключая их с помощью плагинов Webpack. С Webix Jet вам будет легче организовывать код и повторно использовать компоненты в разных частях приложений.
1 import htmlTemplate from "templates/data.hbs";
2
3 export default class NewView extends OtherView {
4 config() {
5 return { cols:[
6 { view:"list", url:"/data/php",
7 click: id => this.select(id) },
8 { template: htmlTemplate, id:"data" }
9 ]};
10 }
11 select(id) {
12 this.$$("data").setValue({id:id});
13 }
14 }Навигация
URL - это схема UI приложения. С Webix Jet вы можете создавать обычные HTML ссылки для навигации по одностраничным приложениям. Вы также можете выбрать более безопасный способ - Jet ссылки, переход по которым вы можете заблокировать. Вы можете выбрать один из четырех роутеров для навигации или создать свой.
Плагины
Плагины Jet значительно облегчают некоторые задачи, например, создание меню для навигации, локализацию, управление доступом, уведомления и смену цветовых тем.
1 import {JetView, plugins} from "webix-jet";
2
3 export default class LayoutView extends JetView {
4 config() {
5 return { rows:[
6 { view:"list", url:"/menu/data", id:"top:menu" },
7 { view:"template", id:"top:status" }
8 ]};
9 }
10 init() {
11 this.use(plugins.Menu, "top:menu");
12 this.use(plugins.Status, "top:status");
13 }
14 }Для ПК и мобильных устройств
С помощью фреймворка, вы сможете разрабатывать приложения, которые будут отлично работать на всех устройствах вне зависимости от размера экрана. Вы можете определять разные версии интерфейса для разных экранов. Приложения, разработанные с Webix Jet, будут корректно работать как на ПК, так и на мобильных устройствах с iOS, Android и т.д.
Ускорьте разработку приложений на Webix с помощью Webix Jet