В 2016 году многие из нас обещали себе новые достижения, например, прочитать отложенную книгу, изучить новый вид спорта или язык программирования и т. д. Изучение новых технологий чем-то похоже на действия, описанные выше.
Итак, для таких энтузиастов небольшой обзор удобных «инструментов» для разработки веб-приложений на Java. Новая серия статей будет посвящена Ваадин И Ликвибаза .
В первой статье я хочу рассказать вам о нескольких этапах начала знакомства с этим.
FrameWork(Ваадин) .
О «загрузке» шаблона и добавлении элементов в «макет» мы поговорим впервые.
Давайте немного поговорим о Ликибазе.
В будущих статьях мы планируем добавить обработку xml-файлов.
Ваадин .
Для меня это «интерпретатор» Java-кода в пользовательский интерфейс.
По сути, я сводлю разработку к уровню управления уровня Java. Благодаря серверно-ориентированной архитектуре на базе JavaEE можно выкладывать слой сложной логики, не теряясь в настройках отдельных частей.
А уже подготовленная оптимизация под браузеры (я говорю о кроссбраузерности) сведет эту часть работы к минимуму.
Серверно-ориентированная модель позволяет быстро (вы это увидите позже) и создавать качественные приложения, снижая риск застревания на определенном этапе.
Вы разрабатываете на Java, а на клиенте вы увидите JavaScript. Дополнительно надо сказать, что использование AJAX обещает увеличение скорости обмена в интерфейсе.
В этом направлении сейчас разрабатывается множество программных продуктов.
Некоторые из них описаны в первой и четвертой статьях ниже.
Если говорить об использовании, то для средних и крупных компаний это отличный выбор (ИМХО).
Основная информация о Ваадине.
Официальный сайт Ваадина Ниже несколько ссылок на видео .
Я очень рекомендую его посмотреть.
Здесь рассказывается о том, как визуально создать небольшое приложение.
Лучшая практика — очень успешная история о том, как правильно создавать части интерфейса.
Статьи о FrameWork .
Небольшая статья об отличиях Ваадина от его «собратьев».
Обзор возможностей FrameWork. Ссылка на третью статью .
Полезные функции.
Здесь про GWT и Vaadin. Обзор.
Чтобы создать свой первый шаблон, вы можете сделать следующее.
Первый — установить и настроить несколько частей для корректной разработки.
Если, например, вы используете IntelliJ ИДЕЯ , затем при создании нового проекта выберите Vaadin в разделе «Дополнительные библиотеки и FrameWorks».
После этого вам будет предложено указать «Дистрибутив Vaadin» и дополнительно можно ввести «Создать образец приложения»; перед этими действиями обязательно укажите путь к Project SDK и Серверу приложений (все эти настройки производятся в одном окне).
Кстати, есть шаблоны и для других IDE. Ссылки на шаблоны .
В проекте после запуска TomCat вы можете увидеть следующую надпись «Hello World».
Этим связь Вы можете наблюдать за процессом еще раз.
Что такое Ликвибаза и зачем она нам нужна? Ссылка на сайт Liquibase .
Хорошая статья об особенностях работы.
Другой отличный письменный материал.
Что случилось Ликвибаза ? Для меня это удобный механизм создания одинаковых типов объектов в разных базах данных (Oracle, PostgreSQL и других).
Очень хороший выбор для компаний, разрабатывающих программное обеспечение.
Если попытаться описать это очень кратко, то вы описываете таблицы, последовательности и прочие объекты в xml. В дальнейшем один и тот же файл можно использовать для установки на разные типы баз данных (с определёнными ограничениями).
В этой статье мы начнем создавать пользовательский интерфейс, например, для создания файлов Liquibase (ограничимся xml-версией).
Именно благодаря поддержке множества баз данных мы постараемся изучить и применить эту возможность.
Забыл упомянуть Apache Tomcat. Ссылка на сайт Томкат .
В предложенной мной версии можно использовать встроенную возможность запуска тестов прямо из среды разработки.
Начнем с пользовательского интерфейса Vaadin. Кстати, на самом сайте можно найти пример конструкции.
Мы попробуем пойти своим путем и создать хоть и похожее, но все же «свое» приложение.
Давай начнем.
Если вам удалось загрузить шаблон, он выглядит примерно так:
В коде вы можете увидеть строку.package com; import com.vaadin.server.VaadinRequest; import com.vaadin.ui.*; /** * Created by Terran on 20.01.2016. */ public class MyVaadinApplication extends UI { @Override public void init(VaadinRequest request) { VerticalLayout layout = new VerticalLayout(); setContent(layout); layout.addComponent(new Label("Hello, world!")); } }
final VerticalLayout layout = new VerticalLayout();
По сути, это «макет», к которому мы будем добавлять элементы (сейчас помимо основных элементов на сайте можно найти огромное количество дополнительных).
Мы предложим будущему пользователю два варианта, первый — перейти к созданию элементов, второй — перейти по ссылке на хабрахабр.
ру .
Здесь вы можете использовать любой ресурс, в реальном приложении — это может быть сайт технической поддержки.
Для этого добавим несколько элементов.
Вот они: final Label startVariant = new Label();
startVariant.setValue("Choose button");
layout.addComponent(startVariant);
Button buttonClick = new Button("The option to create");
buttonClick.setStyleName(ValoTheme.BUTTON_TINY);
layout.addComponent(buttonClick);
Button buttonHabrahabr = new Button("Go habrahabr.ru");
buttonHabrahabr.setStyleName(ValoTheme.BUTTON_DANGER);
layout.addComponent(buttonHabrahabr);
Когда вы запустите (я запускаю версию 7.0.65 с помощью Tomcat), у вас будет следующее.
Будущему пользователю доступны два варианта, первый — перейти к созданию объектов, второй — перейти на habrahabr.ru.
Итак, пользователь нажимает кнопку «Возможность создать».
Мы предложим вам выбор.
Для этого мы добавим в действие addClickListener. Что-то вроде этого: buttonHabrahabr.addClickListener(new Button.ClickListener() {
@Override
public void buttonClick(Button.ClickEvent clickEvent) {
}
});
Т.
к.
удобнее использовать лямбда-выражения; мы напишем все следующие обработчики, используя их.
--> buttonHabrahabr.addClickListener((Button.ClickListener) clickEvent -> {
});
Далее сделаем обработку, добавим к кнопке Listener (buttonClick), и при нажатии выведем еще один элемент ComboBox. buttonClick.addClickListener((Button.ClickListener) clickEvent -> {
final ComboBox boxChange;
layout.addComponent(boxChange = new ComboBox("Choose creation variant "));
boxChange.addItems("Create Table", "Create PrimaryKey");
После перезапуска TomCat получаем следующий результат: 
Здесь сразу бросается в глаза расположение кнопок («Возможность создать» и «Перейти на habrahabr.ru»).
На мой взгляд они очень близки.
Это легко исправить.
Удалим добавление элементов и добавим новый горизонтальный слой («макет»), добавим к нему кнопки и новый слой к исходному макету.
layout.addComponent(buttonClick); layout.addComponent(buttonHabrahabr);
final HorizontalLayout horizontalLayoutForButton = new HorizontalLayout();
horizontalLayoutForButton.addComponents(buttonClick,buttonHabrahabr);
horizontalLayoutForButton.setSpacing(true);
layout.addComponent(horizontalLayoutForButton);
Вот что мы получим после перезапуска сервера приложений (TomCat).
Для «Создать таблицу» мы добавим следующую часть.
boxChange.addValueChangeListener((Property.ValueChangeListener) valueChangeEvent -> {
if (Objects.equals(boxChange.getValue(), "Create Table")) {
}
else if (Objects.equals(boxChange.getValue(), "Create PrimaryKey")) {
}
}
Вносим небольшие изменения.
Например, после выбора элемент будет доступен только для чтения.
Добавим поля для ввода имени таблицы и автора будущего файла: boxChange.addValueChangeListener((Property.ValueChangeListener) valueChangeEvent -> {
if (Objects.equals(boxChange.getValue(), "Create Table")) {
boxChange.setReadOnly(true);
final TextField tableName = new TextField("Enter table name");
tableName.setWidth("300px");
tableName.setRequired(true);
tableName.addValueChangeListener(event -> {
String value = (String) event.getProperty().
getValue(); Notification.show("Value is: " + value); }); tableName.setImmediate(true); final TextField authorName = new TextField("Enter author name"); authorName.setWidth("300px"); authorName.setRequired(true); authorName.addValueChangeListener(event -> { String authorNameValue = (String) event.getProperty().
getValue();
Notification.show("Value is: " + authorNameValue);
});
authorName.setImmediate(true);
layout.addComponent(tableName);
layout.addComponent(authorName);
Получаем результат, который показывает, что после выделения появилась возможность ввести имя таблицы и автора изменений.
Длина и другие параметры вводимых значений могут быть ограничены или изменены.
Здесь мы остановимся на рассуждениях и напишем код для подведения итогов.
Мы немного взглянули на первоначальный макет Vaadin, попытались создать несколько элементов и добавили к ним некоторую обработку.
С этого момента давайте немного углубимся в Ликвибаза .
Для начала стоит просмотреть ссылки с примерами.
Создание таблицы — «Изменить: createTable» Пример создания.
<Эxml version="1.0" encoding="UTF-8"?>
<databaseChangeLog
xmlns=" http://www.liquibase.org/xml/ns/dbchangelog "
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance "
xsi:schemaLocation="http://www.liquibase.org/xml/ns/dbchangelog
http://www.liquibase.org/xml/ns/dbchangelog/dbchangelog-3.1.xsd ">
<changeSet id="1" author="bob">
<createTable tableName="department">
<column name="id" type="int">
<constraints primaryKey="true" nullable="false"/>
</column>
<column name="name" type="varchar(50)">
<constraints nullable="false"/>
</column>
<column name="active" type="boolean" defaultValueBoolean="true"/>
</createTable>
</changeSet>
</databaseChangeLog>
Чтобы создать файл, нам нужно добавить/записать данные в (id, автор, tableName, name, type) и затем собрать отдельные «кусочки» в один файл, потому что в реальной ситуации у нас может быть много разных полей.
Как мы с тобой это сделаем? Есть несколько вариантов.
Мы постараемся разобраться в них в следующей статье.
продолжение следует. В опросе могут участвовать только зарегистрированные пользователи.
Войти , Пожалуйста.
Использовали ли вы эти «инструменты» для создания приложений? 28,13% Да 9 12,5% Нет 4 59,38% Планирование 19 Проголосовали 32 пользователя.
8 пользователей воздержались.
Теги: #vaadin #java #ООП #программирование #разработка приложений #java ee #liquibase #framework #верстка #программирование #java #ООП
-
Работа На Дому: Как Привлечь Детей
19 Oct, 24 -
7 Типов Корпоративных Программистов
19 Oct, 24 -
Оптимизация Gamethread В Unreal Engine 4 Ч.2
19 Oct, 24 -
Аи Ти Эко Деревня (В Порядке Утопии)
19 Oct, 24 -
Появление Наногенераторов Не За Горами
19 Oct, 24 -
91% Японской Молодежи Онлайн
19 Oct, 24
