Обновить
0

Библиотека ExtJS/Sencha *

Библиотека JavaScript

Сначала показывать
Порог рейтинга
Уровень сложности

React Query

Уровень сложностиСредний
Время на прочтение17 мин
Охват и читатели3.4K

React Query – это библиотека для управления состоянием данных сервера. Она автоматически кэширует данные, синхронизирует их и обновляет, что избавляет разработчика от необходимости вручную управлять этим состоянием, что также снижает нагрузку на сервер. React Query не заменяет глобальное состояние (например, Redux), а дополняет его, фокусируясь на данных, которые приходят из внешних источников.

Конечно, для получения данных с API и кэширования можно использовать стандартные средства React (useEffect и useState), но такой подход, в конечном итоге, приведёт к громоздкому коду, особенно, когда дело дойдёт до кэширования или отслеживания ошибок и статусов загрузки.

React Query хранит данные в глобальном кэше, который доступен всем компонентам приложения. Это похоже на то, как работают другие менеджеры состояний, но с фокусом на асинхронные данные. Можно выделить основные возможности библиотеки:

Читать далее

Новости

Как я вуз автоматизировал. Штурм веба

Уровень сложностиПростой
Время на прочтение9 мин
Охват и читатели1.7K

Здравствуйте.

Меня зовут Андрей.  Работаю я в государственном вузе. И, как водится, в такого рода учреждениях люди, которые занимаются компьютерами, занимаются ими в широком смысле слова.

Первая часть этой истории находится тут. Там можно почерпнуть некоторую информацию о том, что из себя представляет описываемая мной система.  Хотя бы в части устройства базы данных.  А база это наше все!

Читать далее

Микрофронтенды на React и ExtJS

Уровень сложностиСредний
Время на прочтение10 мин
Охват и читатели15K

Хочу представить решение по внедрению микрофронтендов в компании РТ МИС с помощью Custom Elements, чтобы связать приложения написанные на библиотеке ExtJS и React.

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

Читать далее

ExtJS 7 и Spring Boot 2. Как построить SPA, взаимодействующее с вашим API и внешними ReactJS плагинами?

Время на прочтение3 мин
Охват и читатели6.7K
Последние версии Ext JS, особенно Modern Toolkit снизили порог вхождения во фреймворк (примеры Kitchen Sink), упростили создание нужного интерфейса (привет Sencha Architect) и добились минимального размера веб-приложений (Sencha Cmd).

Пожалуй, Хабр нужно разбавить примером реализации «ситуационного центра», где в реальном времени можно наблюдать камеры и события с них (все данные фейковые).


Читать дальше →

Ext JS на сервере

Время на прочтение11 мин
Охват и читатели15K
фото от сюда https://github.com/tj/palette Когда речь заходит о библиотеке Ext JS, от знатоков приходится слышать довольно много негатива: тяжелая, дорогая, глючная. Как правило, большинство проблем связано с неумением ее готовить. Правильно собранный с использованием Sencha Cmd проект со всеми css, картинками весит в продакшне в районе 1Мб, что сопоставимо с тем же Angular. Да и глюков не сильно больше…

Можно по-разному относится к этому детищу компании Sencha, но даже принципиальные ее противники признают — лучшего решения для построения серьезных интранет проектов найти сложно.

На мой взгляд, самое ценное в Ext JS не коллекция UI компонент, а довольно удачная архитектура ООП. Даже с учетом бурного развития JS в последние годы, многие нужные вещи которые были реализованы в Ext JS еще 7 лет назад, отсутствуют в нативных классах до сих пор (нэймспэйсы, mixins, статические свойства, удобный вызов родительских методов). Именно это побудило меня несколько лет назад поэкспериментировать с запуском Ext JS классов в бакэнде. Про первые подобные опыты я уже делал посты на Хабре. В этой статье описана новая реализация старых идей и ряд свежих.

Перед тем как начнем, внимание вопрос: как вы думаете, где выполняется и что делает приведенный ниже фрагмент кода?

Ext.define('Module.message.model.Message', {
....
    /* scope:server */
    ,async newMessage() {
        .........
        this.fireEvent('newmessage', data);
        ......
    }
...
})
Читать дальше →

13​ ​выводов​ ​которые​ ​я​ ​сделал,​ ​после​ ​4​ ​лет​ ​использования​ ​Ext JS

Время на прочтение8 мин
Охват и читатели31K
Привет, Хабр. Хочу поделиться опытом использования Ext JS для быстрого построения сложных интерфейсов. Я фронтенд-разработчик в EnglishDom, и мы разрабатываем онлайн-сервисы для изучения английского языка. У меня 6 лет коммерческого опыта в фронтенде, и 4 из них я работаю с Ext JS. Также имею опыт работы с Backbone, React и Ember. Сегодня поговорим про Ext JS, я расскажу свою историю использования, особенности разработки и после каждой небольшой истории я буду делать вывод. Прошу всех под кат.
Читать дальше →

Добавляем поддержку ECMAScript 2015 в ExtJS6

Время на прочтение3 мин
Охват и читатели8K
Добрый день, мир не стоит на месте, в прошлом году состоялся релиз ECMAScript 2015 (он же ES6), который привнес множество нововведений, огорчает лишь одно ExtJS и Sencha cmd пока не научились поддерживать данную спецификацию. Причин для того, что бы уже сейчас разрабатывать приложение с учетом ES6 множество. Основные как мне видится — изучение нового стандарта (ваша рыночная конкурентно-способность возрастает) и создание более простого и лаконичного кода, который радует глаз. В данной статье показывается процесс добавления возможности писать ES6 код для ExtJS, с помощью кросс-компилятора Babel со сборкой на лету.
Читать дальше →

Галерея для ExtJS 6 с поддержкой touch событий

Время на прочтение2 мин
Охват и читатели8K
Добрый день, сейчас я попробую описать создание галереи изображений для мобильных устройств в среде ExtJS 6 (modern toolkit). Основная причина создания статьи, это отсутствие поддержки жестов при просмотре изображений стандартными средствами. В стандартном компоненте carousel нет поддержки touch событий для масштабирования. Данная статья призвана исправить этот недостаток.
Читать дальше →

Создание уникальных тем для приложений ExtJS 6

Время на прочтение3 мин
Охват и читатели13K
Добрый день, в данной статье я расскажу про основные нюансы создания тем для ваших приложений на ExtJS 6. Данная статья предполагает, что вы уже имеете опыт работы с ExtJS. В качестве примера будет использоваться modern toolkit, для classic toolkit особых различий нет. В данной статье рассмотрены следующие вопросы:

  • 1. Наследование и создание темы
  • 2. Подходы к созданию дизайна
  • 3. Применение UI mixins

Добро пожаловать под кат.
Читать дальше →

Использование websocket в приложениях Extjs

Время на прочтение9 мин
Охват и читатели15K
Websocket, наверное, самое серьезное и полезное расширение протокола HTTP с момента его появления в начале девяностых. Использование websockets для обмена данными с сервером намного более выгодно, чем привычный AJAX. Экономия трафика в стандартных приложениях существенна, особенно, при активном обмене клиента и сервера небольшими сообщениями. Также, существенно сокращается время отклика при запросах данных. Основным препятствием на пути широкого распространения этой технологии долгое время было то, что многие прокси-сервера криво поддерживали расширенную версию http-протокола. Что приводило, в худшем случае, к проблемам безопасности (пруф). За последние пару лет ситуация с поддержкой вебсокетов стала выправляться и сейчас, на мой взгляд, настало их время.

В этой статье описаны рецепты использования вебсокетов в стандартных компонентах Extjs (gridpanel, treepanel, combobox). И, также, в качестве замены Ext.Ajax.
Читать дальше →

Сборка нативных приложений в ExtJS 6

Время на прочтение4 мин
Охват и читатели27K

Введение


Доброго вечера, данная статья освещает процесс сборки проектов ExtJS в нативные приложения, под распространенные мобильные платформы (Android, iOS, Windows Phone) с помощью Cordova / PhoneGap.

ExtJS — многофункциональный framework для создания SPA приложений. В последней на текущий момент версии (6.0) есть возможность использовать два различных toolkit'a, а именно classic и modern. Classic — предназначен для создания стандартных web приложений. Modern — предназначен для создания мобильных web-приложений, его отличия в поддержке touch событий и адаптивной вёрстке. Следует упомянуть что, некоторые компоненты в modern отличаются от classic, а именно: наименование событий и контролов. В данной статье рассмотрен процесс сборки нативного приложения только под Android (cloud and local build) с использованием Modern toolkit.
Читать дальше →

Janusjs: концепт системы, где клиент и сервер — сиамские близнецы

Время на прочтение14 мин
Охват и читатели6.1K
image По роду своей деятельности мне часто приходится заниматься разработкой разнообразных crm-систем. Клиентскую часть уже очень давно собираю на Extjs (начинал еще со 2-й версии). На сервере пару лет назад прочно обосновался Nodejs, заменив привычный PHP.

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

Нюансы MVVM в Ext JS при разработке компонентов

Время на прочтение13 мин
Охват и читатели23K
Всем привет. Прошло немало времени с момента выхода Ext JS 5, где представили возможность разработки приложений с использованием паттерна MVVM. За это время я успел столкнуться с некоторыми трудностями, о которых хотел бы рассказать.

Начну с того, что в Ext JS 4 (а предварительно в Sencha Touch) при создании компонентов их конфигурационные свойства объявлялись в объекте config, для каждого из которых автоматически создавался свой getter и setter. Несмотря на то, что вручную писать все обработчики могло быть несколько утомительно, это был стандартный подход.

В пятой же версии Ext JS используя MVVM можно было легко избавиться от доброй части рутины: удалить конфигурационные свойства и их обработчики, а вместо этого привязаться к нужному свойству или формуле ViewModel'и. Кода становилось значительно меньше, а читаемость — лучше.

Но меня беспокоил вопрос инкапсуляции. Что если в процессе разработки часть функциональности я захочу вынести в отдельный компонент для повторного использования? Нужно ли при этом создавать собственную ViewModel? Как изменять состояние компонента: обращаться напрямую к его ViewModel'и или всё-таки стоит использовать конфигурационные свойства и их публичные setter'ы?

Мысли об этом и других вопросах, а также примеры с напильником — под катом.
Читать дальше →

Ближайшие события

Sencha: О лицензиях и ограничениях

Время на прочтение4 мин
Охват и читатели22K
В одном из своих проектов мне захотелось попробовать что-то новое и как-то облагородить админпанель своей CMS. Рассмотрев разные MVC/MVVM JavaScript framework, выбор пал на ExtJS. Я давно обращал на него внимание и знал, что у них есть лицензия для «свободного использование». Зайдя на страницу Sencha ExtJS, я обнаружил, что бесплатная версия предоставляется только на 30 дней, а цена на платную версия не то, чтобы кусается, она готова оттяпать тебе руку по локоть (от $3,855.00 за ExtJS 5). Так куда же делась свободная лицензия на ExtJS.
Читать дальше →

Система разработки, сочетающая ExtJS и Node.JS

Время на прочтение5 мин
Охват и читатели14K
Приветствую уважаемых читателей, писателей (претендующих и бывалых). Кто-то из вас скучает и очередной раз разжевывает язык (программирования). Кому-то нужно удостовериться, что именно бойлерплэйт подходит лучше других фрэймворков. При этом, кто-то совсем не по профилю, но удовлетворяет «хотелки» клиентов. Или сам удовлетворяется «на коленке» подручными средствами.

После активной работы в направлении, объединяющем всё перечисленное, возникло желание высказаться и получить обратную связь. Представляю систему разработки распределённых (online, web) деловых (офисных, бизнес) приложений — enterprise web applications, которая просто сочетает ExtJS и Node.JS.
Читать дальше →

Решение проблемы со временем в ExtJS 3 (после patch'а KB2998527)

Время на прочтение1 мин
Охват и читатели8.5K
Всем доброго времени суток!

Прочитав очередную статью про проблему со временем в JavaScript (для браузеров Windows (RU) после patch'а KB2998527), я стал понимать, что мало кто приводит общее решение для ExtJS 3.
Читать дальше →

Разработка веб-приложения

Время на прочтение19 мин
Охват и читатели95K
Привет, Хабр!

При изучении технологий Ext JS и Java, написал web-приложение «Каталог автомобилей». Хочу поделиться с Вами этим опытом.

Вид и функциональность приложения


  • Добавление;
  • Удаление;
  • Редактирование;
  • Поиск;
  • Валидация данных;


Читать дальше →

Связанные списки в ExtJs

Время на прочтение2 мин
Охват и читатели8.7K
Ничего необычного, просто моя реализация одной из самых распространенных задач при создании динамических интерфейсов «связанные списки». Дабы не возникло недопонимания, я имею ввиду два и более элемента Ext.form.ComboBox, выбор значения в одном из которых влияет на подгружаемые значения во втором.

Читать дальше →

Когда нужно что-то почти готовое

Время на прочтение5 мин
Охват и читатели8K
image

Доброго времени суток, хабражитель!

Чуть более года назад столкнулся с ситуацией когда нужно было реализовать веб-приложение (как обычно в очень сжатые сроки) с богатым функционалом:

  1. Управление учетными записями пользователей с различными ролями
  2. Назначение задач на пользователей и отслеживание дальнейшей жизнедеятельности этих задач
  3. Планирование работы пользователей (на день, месяц)
  4. Работа с результатами работы сотрудников (регистрация времени и типов работ)
  5. Формирование различных отчетов, статистических срезов информации и тп

И это только десятая часть того что нужно было сделать еще “вчера”. Сразу оговорюсь: я — не веб-разработчик, поэтому нужно было решение, на котором можно было бы построить веб-приложение как можно быстрее без глубокого погружения в мир PHP, JS, Java, Ruby, и тп.
Читать дальше →

Как использовать Routing в Ext JS 5

Время на прочтение4 мин
Охват и читатели14K

Маршрутизация — новая функция в Ext JS 5, которая позволяет связывать историю навигации с контроллером. Кнопки «Назад/Вперёд» — одна из основных частей интерфейса браузеров и с Ext JS 5 сделать навигацию в одностраничных приложениях стало очень просто.

Routing в Ext JS 5


Ext JS всегда позволял обрабатывать историю навигации при помощи класса Ext.util.History, но в Ext JS 5 мы сделали этот процесс ещё проще и гибче. Роутер предоставляет простую конфигурацию связи хэш-токенов и методов контроллера с поддержкой параметров и контролем выполнения маршрута (за кулисами используется Ext.util.History). Посмотрим на простой пример:

    Ext.define('MyApp.controller.Main', {
        extend : 'Ext.app.Controller',
 
        routes : {
            'home' : 'onHome'
        },
 
        onHome : function() {}
    });

Читать дальше →