WikiDer > Ваадин - Википедия
Веб-приложение, реализованное с помощью Vaadin Flow | |
Разработчики) | Vaadin Ltd. |
---|---|
Стабильный выпуск | 18.0.3 (21 декабря 2020 г.[1]) [±] 14.4.4 (LTS) (30 ноября 2020 г.[2]) [±] |
Репозиторий | Репозиторий Ваадин |
Написано в | Ява, JavaScript |
Платформа | Кросс-платформа |
Тип | Веб-фреймворк |
Лицензия | Лицензия Apache 2.0 |
Интернет сайт | vaadin.com |
Ваадин (Финское произношение:[ˈƲɑːdin]) является Открытый исходный код платформа для веб приложение разработка. Платформа Vaadin включает в себя набор веб-компоненты, Java веб-фреймворк, а также набор инструментов и стартеров приложений. Его флагманский продукт, платформа Vaadin (ранее Vaadin Framework), позволяет реализовать пользовательские веб-интерфейсы HTML5 с помощью Язык программирования Java.
История
Первоначально разработка начиналась как адаптер поверх Millstone 3. Открытый исходный код веб-фреймворк, выпущенный в 2002 году. Он представил Аякс-система взаимодействия с клиентами и рендеринга. В 2006 году эта концепция была затем разработана отдельно как коммерческий продукт. Как следствие этого, большая часть Ваадина на стороне сервера API все еще совместим с Millstone Качели API.
В начале 2007 года название продукта было изменено на Набор инструментов IT Mill и была выпущена версия 4. Используется проприетарный JavaScript Ajax-реализация для рендеринга на стороне клиента, что усложнило реализацию новых виджетов. К концу 2007 года проприетарная реализация на стороне клиента была прекращена и GWT был интегрирован поверх серверных компонентов. При этом лицензия на продукт была изменена на open source. Лицензия Apache 2.0. Первый готовый к производству выпуск IT Mill Toolkit 5 был выпущен 4 марта 2009 года после более чем одного года бета-тестирования.
11 сентября 2008 г. было публично объявлено[4][5] который Майкл Видениус–Основной автор оригинальной версии MySQL–Инвестировал в IT Mill, разработчика Vaadin. Размер инвестиций не разглашается.
20 мая 2009 г. компания IT Mill Toolkit сменила название на Ваадин Фреймворк. Название происходит от Финский слово для лань, точнее говоря, самка олень. Его также можно перевести с финского как «я настаиваю». Помимо смены названия, был запущен предварительный выпуск версии 6 и сайт сообщества. Позже IT Mill Ltd, компания, стоявшая за Vaadin Framework с открытым исходным кодом, сменила название на Vaadin Ltd.
30 марта 2010 г. был открыт каталог Vaadin. Он добавил канал для распространения дополнительных компонентов к ядру Vaadin Framework, как бесплатно, так и на коммерческой основе. На дату запуска для загрузки уже было доступно 95 дополнений.[нужна цитата]
22 февраля 2017 года был выпущен Vaadin Framework 8.[6] Улучшения включают переписанный API привязки данных с использованием современных функций Java, таких как параметры типов и лямбда-выражения, а также более эффективное использование памяти и ЦП.
25 июня 2018 года был выпущен Vaadin 10.[7] Vaadin 10 сделал возможным использование компонентов Vaadin из любой технологии, совместимой с Веб-компоненты и улучшенный каталог Vaadin для включения распространения веб-компонентов. Vaadin Flow - следующее поколение Vaadin Framework - был представлен как серверная веб-платформа Java поверх компонентов Vaadin.
5 сентября 2018 года был выпущен Vaadin 11 с Gradle интеграция, несколько новых компонентов и диаграммы Vaadin 6.1.
5 декабря 2018 года Ваадин 12 был освобожден.[8]
6 марта 2019 года был выпущен Vaadin 13.[9]
14 августа 2019 года был выпущен Vaadin 14.[10] Это последняя версия LTS (Long Term Support) с бесплатным обслуживанием в течение 5 лет. Одной из основных новых функций является поддержка npm и Bower (в режиме совместимости).
Последней стабильной версией по состоянию на 24 мая 2020 г. является Vaadin 14.2.0, выпущенная 20 мая 2020 г.[11]
Vaadin 14.2.0 видит введение pnpm[12] как пакетный менеджер.
Компоненты Ваадина
Компоненты Ваадина представляют собой исчерпывающий набор Веб-компоненты для разработчиков приложений. Компоненты могут использоваться в веб-документах (без фреймворков) и в веб-фреймворках, совместимых с веб-компонентами. Эти компоненты являются ядром Vaadin Flow, веб-платформы Java, которая предлагает Ява API поверх каждого компонента Vaadin.
Основное использование
Компоненты Vaadin обычно устанавливаются с npm или Бауэр. Например, следующая команда устанавливает кнопка ваадин
компонент:
bower установить vaadin / vaadin-button
После установки компонент можно использовать на веб-странице следующим образом:
<html><голова> <связь rel="импорт" href="bower_components / vaadin-button / vaadin-button.html" /></голова><тело> <кнопка ваадин по щелчку='alert ("Привет, мир")'>Нажми на меня</кнопка ваадин></тело></html>
Ниже приведен снимок экрана предыдущей страницы:
Доступные компоненты
В следующей таблице показан список бесплатных веб-компонентов с открытым исходным кодом, включенных в Vaadin:
Компонент | Имя элемента | Описание |
---|---|---|
Кнопка | кнопка ваадин | Элемент для настраиваемых кнопок |
Флажок | vaadin-checkbox | Элемент для настраиваемых флажков |
Поле со списком | vaadin-combo-box | Показывает список товаров с фильтрацией |
Контекстное меню | vaadin-контекстное меню | Показывает контекстно-зависимые элементы для любого элемента на странице |
Выбор даты | ваадин-подборщик свиданий | Поле выбора даты с прокручиваемым календарём на месяц |
Диалог | vaadin-диалог | Показывает модальные диалоги |
Выпадающее меню | vaadin-выпадающее-меню | Настраиваемый веб-компонент для раскрывающихся меню |
Макет формы | vaadin-form-layout | Настраиваемый адаптивный макет для элементов формы |
Сетка | ваадин-сетка | Сетка данных / элемент таблицы данных |
Набор иконок пользовательского интерфейса | ваадин-иконы | Коллекция из 600+ иконок |
Элемент | ваадин-предмет | Контейнер для элементов item |
Ваадин-список-окно | Многоразовые списки | |
Уведомление | vaadin-уведомление | Индивидуальные уведомления |
Заказной макет | vaadin-заказанный макет | Горизонтальное или вертикальное выравнивание HTML-элементов |
Тематические элементы управления вводом | ||
Индикатор | vaadin-прогресс-бар | Настраиваемые индикаторы выполнения |
Переключатель | vaadin-радио-кнопка | Индивидуальные переключатели |
Разделить макет | vaadin-split-layout | Разбиение макета на области с изменяемым размером |
Вкладки навигации | vaadin-tabs | Индивидуальные вкладки |
Загрузить | vaadin-upload | Загрузить несколько файлов с индикацией прогресса |
Vaadin Flow
Разработчики) | Vaadin Ltd. |
---|---|
Стабильный выпуск | 2.0.10 / 3 сентября 2019[13] |
Предварительный выпуск | 3.0.0.alpha1 / 16 августа 2019[14] |
Репозиторий | Репозиторий потока |
Платформа | Ява |
Тип | Веб-фреймворк |
Лицензия | Лицензия Apache 2.0 |
Интернет сайт | vaadin.com/flow |
Vaadin Flow (ранее Ваадин Фреймворк) - это веб-фреймворк для создания веб-приложения и веб-сайты. Модель программирования Vaadin Flow похожа на модель Vaadin Framework - она использует Ява как язык программирования для создания веб-контента. Vaadin Flow имеет серверную архитектуру, что означает, что большая часть логики выполняется на сервере. На стороне клиента Vaadin Flow построен на основе стандартов веб-компонентов.
Vaadin Flow включает поддержку веб-компонентов для разработчиков Java и позволяет использовать HTML шаблоны (на основе Полимер) с автоматическим взаимодействием клиент-сервер. Он также включает API для маршрутизации (подключение компонентов пользовательского интерфейса к URL-адресам), привязка данных (синхронизация полей ввода с моделями данных на стороне сервера) и на стороне сервера ДОМ манипуляции.
Основное использование
Ниже представлен простейший пример использования Vaadin Flow:
@Маршрут("Привет, мир")общественный учебный класс MainView расширяет VerticalLayout { общественный MainView() { Текстовое поле текстовое поле = новый Текстовое поле("Введите ваше имя"); Кнопка кнопка = новый Кнопка("Нажми на меня", мероприятие -> Добавить(новый Охватывать("Привет, " + текстовое поле.getValue()))); Добавить(текстовое поле, кнопка); }}
Ниже приведен снимок экрана предыдущего приложения:
Функции
Реализация пользовательского интерфейса только на Java
Vaadin Flow позволяет использовать существующие компоненты интерфейса и реализовывать новые с помощью кода Java, работающего на стороне сервера. Можно создавать и изменять DOM со стороны сервера. Конструктор в следующем фрагменте кода показывает, как создать новый HTML-код. div
элемент, установите его я бы
атрибут и добавьте прослушиватель кликов:
@Маршрут("")общественный учебный класс MainView расширяет Div { общественный MainView() { Div div = новый Div(); div.setText("Нажми на меня"); div.getElement().setAttribute("я бы", "главный"); div.getElement().addEventListener("щелкнуть", (DomEventListener) мероприятие -> Добавить(новый Охватывать("Привет, мир"))); Добавить(div); }}
Интеграция веб-компонентов
Интеграция веб-компонентов обеспечивается через @Тег
и @Импорт
аннотации. В следующем фрагменте кода показано, как обернуть существующий веб-компонент в компонент Java на стороне сервера:
@Тег("сочный-туз-редактор")@HtmlImport("bower_components / juicy-ace-editor / juicy-ace-editor.html")общественный учебный класс JuicyAceEditor расширяет Div { общественный пустота установить режим(Нить Режим) { getElement().setAttribute("Режим", Режим); }}
Маршрутизатор
Маршрутизатор - это основная концепция Vaadin Flow, обеспечивающая навигацию по URL-адресам. Маршрутизатор позволяет подключать URL-адреса к компонентам пользовательского интерфейса. Он основан на API истории HTML5, который позволяет конечным пользователям перемещаться по страницам, сохраняя при этом состояние страницы. Следующий фрагмент кода показывает, как использовать @Маршрут
аннотация для отображения аннотированного компонента, когда конечный пользователь запрашивает URL-адрес, например http: //yourdomain.com/Привет, мир
:
@Маршрут("Привет, мир")общественный учебный класс HelloWorldComponent расширяет Div { общественный HelloWorldComponent() { setText("Привет, мир!"); }}
Связывание данных
Связывание данных осуществляется через Связующее
учебный класс. Это позволяет синхронизировать значения в полях ввода с моделями данных на стороне сервера. Следующий фрагмент кода показывает, как привязать имя
Поле Java (через соответствующий геттер и сеттер) гипотетического Человек
класс к значению в Текстовое поле
компонент:
Текстовое поле nameField = новый Текстовое поле();Связующее<Человек> связующее = новый Связующее<>();связующее.связывать(nameField, Человек::getName, Человек::Имя набора);
HTML шаблоны
Vaadin Flow позволяет определять шаблоны HTML с автоматической связью клиент-сервер и привязкой данных (при использовании Полимерна основе шаблонов). Ниже приведен пример шаблона на основе полимера:
<связь rel="импорт" href="../bower_components/polymer/polymer-element.html"><связь rel="импорт" href="../bower_components/vaadin-text-field/vaadin-text-field.html"><dom-модуль я бы="Привет, мир"> <шаблон> <vaadin-текстовое поле метка="Ваше имя" ценить="{{имя}}"></vaadin-текстовое поле> <кнопка по щелчку="приветствовать">Нажми на меня</кнопка> <div я бы="приветствие">[[приветствие]]</div> </шаблон> <сценарий> учебный класс Привет, мир расширяет Полимер.Элемент { статический получать является() { возвращаться 'Привет, мир' } } customElements.определять(Привет, мир.является, Привет, мир); </сценарий></dom-модуль>
В следующем фрагменте кода показано, как подключить предыдущий шаблон к компоненту Java на стороне сервера:
@Тег("Привет, мир")@HtmlImport("src / hello-world.html")общественный учебный класс Привет, мир расширяет Полимерный шаблон<Привет, мир.HelloWorldModel> { общественный интерфейс HelloWorldModel расширяет TemplateModel { Нить getName(); пустота setGreeting(Нить приветствие); } @Обработчик события частный пустота приветствовать() { getModel().setGreeting("Привет, " + getModel().getName()); }}
Внешний вид и настройка
Настройку внешнего вида можно выполнить с помощью CSS, Пользовательские стили HTML или готовые настройки тем.
Весенняя интеграция
Vaadin Flow включает Spring Framework 5 и Spring Boot 2 интеграция.
Сертификаты
Ваадин предложил 2 платных сертификационных трека, которые принимаются онлайн (недоступны по состоянию на 8 ноября 2019 года). Это должно было продемонстрировать навыки разработчика и знания о Vaadin Framework и связанных инструментах для успешной разработки веб-приложений.
- Онлайн-экзамен Vaadin для сертифицированного разработчика Vaadin 7
- Онлайн-экзамен Vaadin для сертифицированного разработчика Vaadin 8
Чтобы пройти сертификацию, вам нужно было изучить всю документацию и выполнить пару веб-приложений с использованием фреймворка. Экзамены также проверяют ваши знания в определенных областях Java SE, Java EE, GWT (Google Web Toolkit) и HTML / JS / CSS.
Сертификаты для Vaadin 8, 10 и 14 теперь доступны с момента выпуска Учебного центра 3 декабря 2019 года. Они состоят из серии видеороликов, разделенных на два основных направления: Foundation и Professional, и финального теста для получения сертификата.
Смотрите также
Рекомендации
- ^ «Выпуск Vaadin 18.0.3 · vaadin / платформа · GitHub». GitHub. Получено 2020-12-21.
- ^ "Выпуск Vaadin 14.4.4 · vaadin / платформа · GitHub". GitHub. Получено 2020-12-09.
- ^ «Выпуск Vaadin 8.12.1 · vaadin / framework · GitHub». GitHub. Получено 2020-12-09.
- ^ "Майкл" Монти "Видениус инвестирует в Finnish IT Mill". Инвестируйте в Финляндию. Архивировано из оригинал на 2011-07-20. Получено 2009-01-31.
- ^ Asay, Мэтт. «Монти Видениус инвестирует в Act II: IT Mill». CNET Новости. Архивировано из оригинал на 2016-03-11. Получено 2009-01-31.
- ^ Ваадин. "Vaadin выпускает Vaadin Framework 8". www.prnewswire.com.
- ^ Ваадин. «Vaadin модернизирует Java-разработку с помощью своего самого большого на сегодняшний день релиза: Vaadin 10». www.businessinsider.com.
- ^ «Релиз Vaadin 12.0.0 на GitHub».
- ^ «Релиз Vaadin 13.0.0 на GitHub».
- ^ «Релиз Vaadin 14.0.0 на GitHub».
- ^ «Релиз Vaadin 14.2.0 на GitHub».
- ^ "pnpm Быстрый диспетчер пакетов с эффективным использованием дискового пространства".
- ^ «Выпуск 2.0.10 - Техническая версия · vaadin / flow · GitHub». GitHub.
- ^ «Выпуск Vaadin Flow 3.0.0.alpha1 · vaadin / flow · GitHub». GitHub.
дальнейшее чтение
- Дуарте, А. (2018) Приложения, ориентированные на данные, с Vaadin 8. Packt Publishing.
- Франкель, Н. (2013) Изучение Ваадина 7, второе издание. Packt Publishing.
- Дуарте, А. (2013) Пример дизайна пользовательского интерфейса Vaadin 7: руководство для начинающих. Packt Publishing.
- Холан, Дж., И Квасновский, О. (2013) Поваренная книга Vaadin 7. Packt Publishing.
- Тейлор К. (2012) Рецепты Ваадина. Packt Publishing.
- Франкель, Н. (2011) Изучение Ваадина. Packt Publishing.
- Грёнроос, М. (2010) Книга Ваадина. Vaadin Ltd.