Поиск решения для быстрого создания интерфейсов СУБД
Практически каждый человек сталкивается с ведением какого-либо учета, сбором и анализом данных: от использования таблиц в экселе до работы с данными в клиент-банковском приложении. Повсеместно для такого учета используются различные системы управления базами данных (СУБД).
В статье я хотел бы рассказать о своем пути поиска такой системы.
Сталкиваясь подобными СУБД (клиент-банки, системы ФСЗН, расчетно-кассовые приложения) с точки зрения пользователя, я всегда удивлялся, почему даже крупные компании с достаточными финансовыми возможностями часто не могут реализовать действительно удобный интерфейс в своих приложениях.
Очевидно, чтобы интерфейс приложения был удобным, он должен разрабатываться на базе хорошо продуманной реализации набора типовых операций над данными. Отсутствие подобного фундамента либо негативно сказывается на качестве программного продукта, либо существенно увеличивает время его разработки.
1С: Предприятие
В 2003 году, когда у меня возникала необходимость в приложениях для ведения любого рода учета, я писал конфигурации под 1С, которые обычно выглядели так:
На тот момент в этом подходе меня все устраивало. Однако через некоторое время я столкнулся с потребностью в сетевом доступе к системе учета. Проанализировав цены на серверные части 1С, я понял, что для меня они слишком высоки, и стал искать альтернативу, желательно бесплатную и с открытым исходным кодом.
Django Admin
После анализа и изучения отзывов я выбрал фреймворк Django с его генератором admin-интерфейсов. При этом пришлось перенести некоторые идеи, заложенные в 1С, на код Python. В итоге получались примерно такие интерфейсы:
Однако, при больших объемах данных стали проявляться недостатки такого подхода.
Во-первых, интерфейсы Django Admin обладают очень ограниченным функционалом и удобство их создания сходит на нет, если нужен функционал, не предусмотренный Django. В таком случае приходится ковыряться в коде Django и искать место, куда можно было бы внедрить свой код, наследуя классы или переделывая шаблоны. Такие модификации носят несистемный характер и через некоторое время к ним трудно возвращаться и вспоминать, как они работают (что приходилось делать, в частности, после обновления очередной версии Django).
Во-вторых, работать с создаваемыми Django Admin интерфейсами было не достаточно удобно, ввод данных был затруднителен и не оперативен. Хотелось интерактивности хотя бы на уровне 1С, чтобы интерфейс не перегружал страницу каждый раз, когда отправляются данные, а использовал такие технологии, как Ajax или WebSocket.
MySQL, Navicat и другие
В результате пришлось полностью отказаться от использования модуля Django Admin и клиентскую часть писать самостоятельно на JavaScript с использованием вышеуказанных технологий. Так был решен вопрос с интерактивностью, но время, которое стало уходить на создание интерфейсов, было неоправданно большим. Иногда, чтобы сэкономить время, для сбора и анализа данных я использовал чистый Mysql с клиентской частью в виде Navicat. Как оказалось, благодаря триггерам и видам, это не самое плохое решение, а огромное число задач решаются таким образом довольно просто (что не удивительно, ведь, согласно википедии, Mysql и создавался первоначально для решения подобных задач).
Критерии оптимального инструмента разработки СУБД
Со временем я сформулировал для себя перечень субъективных пожеланий к инструменту для разработки СУБД. Он должен:
- Позволять быстро и автоматически создавать интерфейсы для работы с данными на основе их моделей.
- Предлагать не только механизмы взаимодействия объектов между собой, но и механизмы отображения этих взаимодействий в интерфейсе.
- Предоставлять возможность выбора: разрабатывать интерфейс либо его часть быстрее (но менее гибко) либо функциональнее (но медленней).
- Работать с различными источниками данных.
- Базироваться на веб-технологиях, быть кроссплатформенным и иметь открытый исходный код.
Ничего, что бы отвечало этим требованиям, я найти не смог. Поэтому решил написать свой фреймворк, решающий поставленные задачи. В качестве основных технологий были выбраны TypeScript в связке с Angular2. При этом фреймворк проектировался так, чтобы его можно было использовать для разработки приложений не только с применением Angular, но и с помощью других JavaScript-библиотек. Хотелось бы поделиться тем, что получилось: возможно, кому-то пригодится.
Структура нового фреймворка
Фреймворк заточен на быстрое создание интерфейсов для СУБД. Он состоит из нескольких частей (модулей). Некоторые могут использоваться отдельно, некоторые — только совместно с остальными.
Модуль core содержит механизмы описания моделей, взаимодействия объектов (записей) данных между собой, механизмы описания запросов к базе данных. Модуль core обращается к источникам данных через модуль backend.
Модуль backend — это прослойка между модулем core и базой (источником) данных. В качестве источника данных может выступать как непосредственно сервер баз данных, вроде SQL, так и прослойка для доступа к моделям других фреймворков, таких как Django или Sequelize.
Модуль model-ui отвечает за генерацию интерфейса: он визуализирует данные, предоставляемые модулем core, используя элементы управления, предоставляемые модулем ui.
Модуль ui содержит базовые элементы управления, которые используются модулем model-ui при генерации интерфейса. Эти элементы могут использоваться также и независимо от фреймворка.
Модуль windows-manager управляет контейнерами для отображения пользовательских интерфейсов. В зависимости от типа windows-manager приложения можно разворачивать как на компьютерах, так и на мобильных устройствах.
Модели и работа с данными
Особенностью фреймворка, в отличие от того же Django, является то, что для описания списков записей и самих записей используются разные типы моделей: ListModel и RecordModel. Такой подход позволяет в списках отображать записи не только от одной, но и от разных моделей, а также нередактируемые строки (являющиеся, например, результатом работы над этими записями).
Хоть фреймворк и содержит необходимые для этого механизмы, описывать модели при разработке приложения не требуется. Модуль backend автоматически формирует внутренние модели на основании тех, которые уже существуют и описаны в других средах (таких как Django, Sequelize, SQL и иные).
У фреймворка есть сходства работы с Django. Например, классы для работы с выборками и запросами (QuerySet и Query) являются эквивалентами одноименных классов Django, адаптированными из кода Python в код TypeScript. Например, для выборки данных из источника данных необходимо написать примерно следующий код:
Ещё одна отличительная особенность фреймворка — поддержка виртуальных полей. Когда изменяется виртуальное поле, оно может менять реальные поля объектов, а когда меняются значения реальных полей, могут изменяться и виртуальные. Что-то похожее есть и в Django, когда через объект мы имеем доступ к данным, не хранящимся в базе данных в том виде, в котором они доступны в этом объекте,— это получение ссылающихся на объект других объектов через свойство xxxxxx_set либо получение доступа к объекту через свойство, когда в базе данных хранится лишь id этого объекта.
На иллюстрации ниже поля product_id и product_name — реальные, а поле product — виртуальное.
Во фреймворке реализована «ленивая загрузка зависимых записей». В отличие от Django, здесь разработчик может решать, в каких случаях этот механизм лучше не применять, а получать данные сразу, тем самым уменьшая количество запросов между клиентом и сервером. Так, в примере выше у продукта product есть поле supplier, которое ссылается на поставщика. По-умолчанию, поставщики будут запрашиваться из базы данных только при обращении к полю product[‘supplier’]. Однако, если вышеприведенный пример модифицировать следующим образом: . getRows(‘supplier’).subscribe(products => <…>); — то каждый продукт из списка products уже будет содержать данные о поставщике и при обращении к ним не будет происходить запроса к базе данных.
Интерфейс
Для ускорения разработки приложений фреймворк позволяет использовать встроенный интерфейс на базе модулей model-ui и ui. Это удобно, когда нет потребности в специфическом интерфейсе либо необходимо развернуть приложение максимально быстро. Однако, отказавшись от этих модулей, можно использовать и произвольный интерфейс (написанный, скажем, на базе Bootstrap или Angular Material).
Все элементы управления ввода данных в стандартном интерфейсе сделаны так, чтобы любой из них мог использоваться как в формах, так и в ячейках таблиц. Элементы также наделены свойствами, упрощающими работу с данными. Вот, к примеру, так выглядит текстовое поле.
При нажатии на кнопку расширения открывается увеличенное поле ввода: это удобно, когда ширина поля ввода меньше, чем помещенный в него текст. Такая ситуация может возникнуть при плотном расположении элементов на форме либо при редактировании данных в виде таблицы.
Если рассмотреть поле ввода числа, то в нем, кроме самого числа, можно вводить математические выражения.
Поле выбора другого объекта также имеет несколько способов ввода: оно позволяет выбирать объект как из выпадающего списка по вхождению слов, так и из отдельной всплывающей формы.
Что касается ошибок некорректности ввода, то они отображаются не текстом под элементом управления, а специальным маркером. Такой подход позволяет сохранять плотность элементов формы и не менять их положение при выводе ошибок. Аналогичным образом выводятся ошибки для ячеек таблицы с этим элементом управления.
Взаимодействие интерфейса и данных
Во фреймворке большое внимание уделено взаимодействию записей (объектов) между собой.
При изменении записи на форме она автоматически обновляется в списке.
Если же запись одновременно редактируется с разных компьютеров, то у пользователя появляется предупреждение.
В интерфейсе фреймворка также реализован механизм сортировки строк зависимых записей (если это предусмотрено моделью и модулем backend).
Приведенные примеры элементов интерфейса лишь малая часть из того, что заложено во фреймворке. Более детальное описание всех элементов и принципов работы интерфейса — тема для отдельных статей. Так же стоит повториться, что приводимые примеры интерфейсов не навязываются, а лишь предлагаются как основа и могут настраиваться по усмотрению разработчика.
Планы на будущее
Во фреймворке заложены основные возможности, которые я хотел в нем видеть. Он вполне работоспособен, но тем не менее ту стадию, на которой он находится в данный момент, я бы назвал только концептом.
Так, например, на данный момент существует backend, который позволяет фреймворку работать только с базой данных MySQL, из-за чего его можно запустить только на Electron. Также не реализован интерфейс для работы на мобильных устройствах и ряд других возможностей.
Ближайшие планы по развитию фреймворка:
- Реализовать механизмы объединения и группировок в запросах в классе Query.
- Добавить элементы управления для работы с объединениями и группировками.
- Разработать backend для преобразования объекта Query в json или xml, а также разработать серверную часть для работы с моделями Django.
- Реализовать механизм кеширования запросов к серверу данных.
- Воплотить в жизнь большое количество других идей.
Как попробовать?
Если у вас возникло желание опробовать фреймворк в работе, вы можете посмотреть пример приложения, написанного на нем. Его можно установить следующим образом:
Создание простого веб-приложения с использованием базы данных MySQL
В этом документе описана процедура создания простого веб-приложения, которое подключается к серверу базы данных MySQL. Здесь также рассмотрены основные идеи и технологии веб-разработки, такие какJavaServer Pages (JSP), библиотека стандартных тегов JavaServer Pages (JSTL), интерфейс API связи с базами данных Java (JDBC) и двухуровневая архитектура между клиентом и сервером. Этот учебный курс разработан для начинающих разработчиков, обладающих базовыми знаниями в области веб-разработок и желающих применить свои знания к базе данных MySQL.
MySQL является популярной системой управления базами данных с открытым кодом, которая обычно используется в веб-приложениях благодаря своей скорости, гибкости и надежности. MySQL использует SQL (язык структурированных запросов) для доступа к данным в базе данных и их обработки.
Этот учебный курс является продолжением учебного курса Подключение к базе данных MySQL и в нем предполагается, что уже создана база данных MySQL с именем MyNewDatabase , для которой зарегистрировано подключение в IDE NetBeans. Табличные данные, используемые в этом учебном курсе, содержатся в ifpwafcad.sql и также необходимы для работы с этим учебным курсом. Этот файл SQL создает две таблицы Subject и Counselor и затем заполняет их данными для примера. При необходимости сохраните этот файл на компьютер, затем откройте его в IDE NetBeans и запустите его в базе данных MySQL с именем MyNewDatabase .
Для работы с этим учебным курсом требуется следующее программное обеспечение и ресурсы.
7.2, 7.3, 7.4, 8.0, пакет Java EE
Драйвер JDBC MySQL Connector/J
GlassFish Server Open Source Edition 3.1.2.2
Примечания:
Комплект загрузки Java среды IDE NetBeans позволяет пользователям установить сервер GlassFish. Для работы с данным учебным курсом требуется сервер GlassFish.
Если необходимо сравнить проект с работающим решением, можно загрузить демонстрационное приложение.
Планирование структуры
С помощью двухуровневой архитектуры, в которой клиент взаимодействует с сервером напрямую, можно создать простое веб-приложение. В рамках данного учебного курса веб-приложение Java взаимодействует напрямую с базой данных MySQL с использованием API связи с базами данных Java. В сущности, именно драйвер MySQL Connector/J JDBC обеспечивает обмен данными между кодом Java, распознанным сервером приложения (GlassFish), и любым содержимым на SQL, языке, понятном для сервера базы данных (MySQL).
Приложение, создаваемое в этом учебном курсе, предполагает создание двух страниц JSP. На каждой такой странице с помощью HTML и CSS реализован простой интерфейс, и применяется технология JSTL для выполнения логики, напрямую запрашивающей базу данных с вставкой извлеченных данных на двух страницах. В базе данных MySQL MyNewDatabase содержатся две таблицы базы данных Subject и Counselor , которые были созданы при работе с учебным курсом Подключение базы данных MySQL. Рассмотрим следующий двухуровневый сценарий.
Страница приветствия index.jsp представляется пользователю с помощью простой формы HTML. При запросе браузером`index.jsp` код JSTL на странице инициирует запрос в MyNewDatabase . Выполняется извлечение данных из таблицы Subject со вставкой их на страницу перед ее передачей в браузер. При передаче данных о выборе пользователя в форме HTML на странице приветствия инициируется запрос страницы ответов ( response.jsp ). И снова код JSTL на странице инициирует запрос в MyNewDatabase . На этот раз данные извлекаются из обеих таблиц — Subject и Counselor . После чего выполняется их вставка на страницу, что позволяет пользователю просматривать данные в зависимости от вариантов выбора при возврате страницы в браузер.
Для реализации описанного выше сценария необходимо разработать простое приложение для организации IFPWAFCAD Международной ассоциации по консультированию и развитию для бывших профессиональных борцов.
index.jsp
response.jsp
Создание нового проекта
Сначала необходимо создать новый веб-проект в среде IDE:
Выберите «Файл > Новый проект» (CTRL+SHIFT+N; ⌘+SHIFT+N в Mac ОС) в главном меню. Выберите категорию «Java Web», а затем выберите «Веб-приложение». Нажмите кнопку «Далее».
С помощью этого мастера можно создать пустое веб-приложение в стандартном проекте IDE. В стандартном проекте для компиляции, развертывания и выполнения приложения используется созданный в среде IDE сценарий сборки проекта Ant.
В поле «Имя проекта» введите «IFPWAFCAD». Также укажите местоположение проекта на компьютере. По умолчанию проекты в среде IDE помещаются в папку NetBeansProjects в домашнем каталоге. Нажмите кнопку «Далее».
В панели «Сервер и параметры» укажите сервер GlassFish в качестве сервера, на котором будет запускаться приложение.
*Примечание.*Сервер GlassFish отображается в раскрывающемся списке ‘Сервер’, если установлена версия Java IDE NetBeans. Поскольку сервер GlassFish включен в загрузку, он регистрируется в среде IDE автоматически. Для использования в проекте другого сервера нажмите кнопку «Добавить» рядом с полем с раскрывающимся списком «Сервер» и зарегистрируйте другой сервер в среде IDE. Работа с другими серверами, помимо GlassFish в рамках данного учебного курса не рассматривается.
В поле «Версия Java EE» выберите Java EE 5.
Для веб-проектов Java EE 6 и Java EE 7 использование дескриптора развертывания web.xml не требуется. Шаблон проекта NetBeans не содержит файл web.xml в проектах Java EE 6 и Java EE 7. Однако в данном учебном курсе рассматривается процесс объявления источника данных в дескрипторе развертывания. Функции, характерные только для Java EE 6 или Java EE 7, не требуются, поэтому в качестве версии проекта можно указать Java EE 5.
Примечание. Точно так же можно указать в качестве версии проекта Java EE 6 или Java EE 7, а затем создать дескриптор развертывания web.xml . В мастере создания файла выберите категорию «Web», а затем выберите «Стандартный дескриптор развертывания».
Нажмите кнопку «Завершить». Создается шаблон проекта для всего приложения и в редакторе открывается пустая страница JSP ( index.jsp ). Файл `index.jsp`служит в приложении страницей приветствия.
Подготовка веб-интерфейса
Начните с подготовки страницы приветствия ( index.jsp ) и страницы ответов ( response.jsp ). На странице приветствия реализована форма HTML для сбора пользовательских данных. На обеих страницах для просмотра структурированных данных используется таблица HTML. В этом разделе также рассматривается процесс создания таблицы стилей, которая расширяет внешний вид обеих страниц.
Настройка страницы приветствия
Убедитесь, что страница index.jsp открыта в редакторе. Если файл еще не открыт, дважды щелкните index.jsp под узлом «Веб-страницы» проекта IFPWAFCAD в окне «Проекты».
В редакторе измените текст между тегами <title> на Домашняя страница IFPWAFCAD .
Измените текст между тегами <h1> на Добро пожаловать в IFPWAFCAD, Международную ассоциацию по консультированию и развитию для бывших профессиональных борцов!
Откройте палитру среды IDE, выбрав в главном меню «Окно» > «Палитра» (CTRL+SHIFT+8; ⌘+SHIFT+8 в ОС Mac). Наведите курсор на значок «Таблица» в категории «HTML» и обратите внимание на то, что отображается фрагмент кода для элемента по умолчанию.
Палитру можно настроить в соответствии с существующими требованиями — щелкните правой кнопкой мыши палитру и выберите ‘Показать крупные значки’ и ‘Скрыть имена элементов’, чтобы палитра выглядела как на рисунке выше.
Установите курсор сразу же после тегов <h1> . (Именно в этом месте будет внедрена новая таблица HTML). Далее в окне «Палитра» дважды щелкните значок «Таблица».
В появившемся диалоговом окне «Вставка таблицы» укажите следующие значения и затем нажмите кнопку «ОК»:
Рядов: 2
Столбцов: 1
Размер границы: 0 Код таблицы HTML создан и добавлен на страницу.
Добавьте следующее содержимое в заголовок таблицы и ячейку первой строки таблицы (новое содержимое выделено полужирным шрифтом):
Для нижней строки таблицы вставьте форму HTML. Для этого поместите курсор между второй парой тегов <td> и дважды щелкните значок формы HTML ( ) на палитре. В диалоговом окне «Вставка формы» введите response.jsp в текстовом поле «Действие» и нажмите кнопку «ОК».
Между тегами <form> введите следующее содержимое (новое содержимое выделено полужирным шрифтом):
Нажмите клавишу Enter, чтобы добавить пустую строку после добавленного содержимого, затем дважды щелкните «Список» в палитре, чтобы открыть диалоговое окно «Вставить список».
В диалоговом окне «Вставить список» ведите subject_id для текстового поля «Имя» и нажмите «OK». Обратите внимание на то, что к форме добавляется фрагмент кода для раскрывающегося списка.
Количество параметров для раскрывающегося списка не имеет значения. Позже в этом учебном курсе будет показано добавление тегов JSTL для динамического создания на основе данных, полученных из таблицы базы данных «Subject».
Добавьте элемент кнопки ‘Отправить’ ( ) в точку, расположенную непосредственно после только что добавленного раскрывающегося списка. Для этого можно использовать окно «Палитра» или вызвать дополнение кода в редакторе, как показано в предыдущем шаге. В диалоговом окне «Вставка кнопки» в текстовых полях «Подпись» и «Имя» введите Отправить и нажмите кнопку ОК.
Для форматирования кода щелкните правой кнопкой мыши в редакторе и выберите ‘Формат’ (Alt-Shift-F; Ctrl-Shift-F в Mac). Код автоматически форматируется и должен теперь выглядеть следующим образом:
Для просмотра этой страницы в браузере щелкните правой кнопкой мыши в редакторе и выберите ‘Запустить файл’ (Shift-F6; Fn-Shift-F6 в Mac). После этого страница JSP будет автоматически скомпилирована и развернута на сервере. Открывается браузер по умолчанию, и в нем выводится страница из местоположения, где она развернута.
Создание страницы ответов
Для подготовки интерфейса для страницы response.jsp сначала необходимо создать файл в проекте. Обратите внимание на то, что большая часть содержимого, отображаемого на странице, создана динамически с помощью технологии JSP. Поэтому в следующих шагах будет необходимо добавить метки-заполнители, которые позже будут заменены кодом JSP.
Щелкните правой кнопкой мыши узел проекта «IFPWAFCAD» в окне «Проекты» и выберите «Создать > JSP». Откроется диалоговое окно «Новый файл JSP».
В поле «Имя файла JSP» введите response . Обратите внимание на то, что в настоящий момент для поля «Расположение» выбран каталог «Веб-страницы», это означает, что файл будет создан в каталоге проекта web . Это то же местоположение, что и для страницы приветствия index.jsp .
Примите остальные значения по умолчанию и нажмите кнопку «Готово». В редакторе выполняется создание и открытие шаблона новой страницы response.jsp . Новый узел JSP также отображается в каталоге «Веб-страницы» в окне «Проекты».
В редакторе измените заголовок на IFPWAFCAD —
Удалите строку <h1>Hello World!</h1> строка между тегами <body> . Скопируйте и вставьте в тело страницы следующую таблицу HTML:
Для просмотра этой страницы в браузере щелкните правой кнопкой мыши в редакторе и выберите ‘Запустить файл’ (Shift-F6; Fn-Shift-F6 в Mac). Выполняется компиляция и развертывание страницы на сервере GlassFish с последующим открытием в браузере по умолчанию.
Создание таблицы стилей
Создайте простую таблицу стилей для расширения просмотра в веб-интерфейсе. При работе с данным учебным курсом предполагается, что пользователь обладает знаниями о правилах стилей и их влиянии на соответствующие элементы HTML на страницах index.jsp и response.jsp .
Откройте мастер создания файлов, нажав кнопку ‘Создать файл’ ( 
) на главной панели инструментов IDE. Выберите категорию «Web», а затем выберите «Каскадная таблица стилей» и нажмите кнопку «Далее».
Введите style в поле «Имя файла CSS» и нажмите кнопку «Готово». Среда IDE создает пустой файл CSS и располагает его в том же местоположении проекта, что и index.jsp и response.jsp . Обратите внимание на то, что узел для style.css отображается теперь внутри проекта в окне «Проекты», а файл открывается в редакторе.
В редакторе добавьте следующее содержимое к файлу style.css :
Подключите таблицу стилей к index.jsp и response.jsp . На обеих страницах добавьте следующую строку между тегами <head> :
Для быстрого перехода между открытыми в редакторе файлами нажмите CTRL+TAB, а затем выберите требуемый файл.
Подготовка средств обмена данными между приложениями и базой данных
Наиболее эффективным способом реализации соединения между сервером и базой данных является настройка пула подключений базы данных. Создание нового подключения для каждого запроса клиента может занимать много времени, особенно для приложений, постоянно получающих огромное количество запросов. Во избежание этого создается и поддерживается множество подключений, организованных в виде пула подключений. Входящие запросы, требующие доступа к данным приложения, используют уже созданное подключение из пула. Аналогичным образом, когда запрос завершен, подключение не закрывается, а возвращается в пул.
После подготовки источника данных и пула подключений для сервера необходимо определить в приложении необходимость использования источника данных. Как правило, для этого создается запись в дескрипторе развертывания приложения web.xml . Наконец, необходимо проверить доступность для сервера драйвера базы данных (JDBC MySQL Connector/J).
*Примечание. *Для дальнейшей работы необходимо убедиться в том, что база данных MySQL с именем MyNewDatabase настроена корректно и содержит данные примера из ifpwafcad.sql. Этот файл SQL создает две таблицы Subject и Counselor и затем заполняет их данными для примера. Если это не было выполнено ранее, или с этим заданием возникли сложности, то прежде чем продолжить учебный курс, обратитесь к разделу Подключение к базе данных MySQL.
Помимо этого для создания источника данных и работы с сервером GlassFish в рамках данного учебного курса необходимо защитить базу данных паролем. При использовании учетной записи MySQL root по умолчанию с пустым паролем с помощью командной строки можно установить другой пароль.
В качестве пароля в этом учебном курсе используется nbuser . Для установки пароля nbuser в командной строке откройте в системе MySQL каталог bin и введите следующие данные:
Дополнительные сведения приведены в официальном справочном руководстве по работе с MySQL: Защита исходных учетных записей MySQL.
Как сделать веб-интерфейс для базы данных SQL
Это не оболочка базы данных для управления СУБД SQL Server. Это система личных кабинетов для учета информации, хранящейся в SQL Server. Все управление системой осуществляет настройка SQL (по сути, это SQL фреймворк). Если вы знаете SQL, то вы сможете сопровождать подобную систему.
Разработка учетной системы на полном стеке (fullstack)
Самописные системы разрабатываются на базе полного стека разработки с N слоями:
проектируется база данных;
создается слой доступа к данным;
создается слой бизнес-логики;
разрабатывается API или слой контроллеров;
к ней подключается динамика за счет front end программирования.
Это довольно трудоемко, сложно. Зачем тогда использовать это, если есть коробочные решения?
Коробочные решения не дают гибкости, а для дальнейшего развития системы очень важно иметь возможность легко развивать систему без серьезных ограничений.
Fullstack разработка — это долго, дорого и много ошибок.
Когда-то давно мы создали модуль метрик, который генерировал некие отчеты в виде вложенных показателей. Каждый отчет — это данные в таблицах + некая хранимая процедура для извлечения данных.
Движок модуля подхватывал эти данные и хранимку и выводил все, что нужно пользователю.
Если вас заинтересовала возможность разработки на MS SQL у нас открыта вакансия для SQL программистов.
SQL настройка для полного управления — новая парадигма. SQL фреймворк
Это привело нас к идее, а почему бы и другие все модули не попробовать сделать по подобному принципу — формы, таблицы, графики, дашборды и прочее.
Что дает в итоге такой подход:
можно менять бизнес-логику на лету (просто поменяв хранимую процедуру). В случае обычного N-слойного приложения необходима перекомпиляция и обновление программы;
скорость внесения изменений. Очень важно иметь возможность быстро вносить изменения, а не ждать разработчиков по 2 недели, когда они внедрят изменения в систему;
основная сложность ложится на один слой и локация ошибки с высокой степенью вероятности находится только в одном слое — SQL процедурах. Это упрощает поиск ошибок и минимизирует количество сбоев на front end.
Как это выглядит изнутри. Возьмем к примеру вывод таблицы.На входе — это сниппет.
Ваш JS движок обрабатывает подобные компоненты и запрашивает у базы описание по компонентам и данные для них (все через значимые процедуры). Полученные данные JS движок выводит в виде таблицы. Данные удовлетворяют неким правилам/стандартам.
Например, для таблиц у нас правила примерно выглядят так:
процедура GetItems выдает в SELECT 1 данные таблицы, в SELECT 2 — данные о пагинации, в SELECT 3 — настройки вывода таблицы.
К примеру, если в SELECT 3 передать select 1 Compact — то таблица будет выведена в компактном режиме.
Редактирование SQL для таблицы вывода страниц
Так выглядит таблица в компактном режиме
Если необходимо реализовать какие-то действия с данными таблицы, то это также вызов некой хранимой процедуры с заданными параметрами и заданным выводом.
Процедуры делятся на системные (обслуживают компоненты и внутренние потребности системы) и пользовательские (задают вывод данных).
Редактирование процедур происходит через интерфейс панели управления, т.е. нет необходимости искать каждый раз хранимую процедуру в SQL Server Management Studio.
Идея Falcon Space
Сниппеты в разметке + управление бизнес-логикой через SQL + гибкие компоненты ядра
Плюсы и минусы подхода с полным управлением через SQL
Какие дополнительные плюсы дает интерфейс для SQL Server?
Быстродействие. Вы работаете с чистым SQL без лишних прослоек в виде ORM. Это дает хорошее быстродействие, и оно ограничивается, по сути, быстродействием вашего написанного SQL запроса.
Созданный функционал — это веб-оболочка SQL и данные в таблицах (что также можно представить в виде SQL скрипта). Вы можете легко переносить между разными системами SQL для отдельных компонентов. Это возможность быстро наращивать кодовую базу и адаптировать ее в других подобных приложениях.
Не нужна компиляция. Поменяли процедуру — получили сразу в системе другой результат. По сути разработка идет в realtime, параллельно с использованием.
Локализация ошибок — большинство ошибок лежат в вашем SQL, а не разбросаны по всему стеку. Есть проблема? Проверяем работы процедуры в SQL Management Studio и анализируем вход и выход.
Поняв общий подход, систему можно развивать, добавляя новые блоки и модули без необходимости менять исходный код программы.
Уменьшение требуемых компетенций для поддержки системы. В нашем случае мы сводим все к двум компетенциям — знание SQL для бизнес-логики и Bootstrap для стилизации и вывода данных.
Уменьшение количества велосипедов. Программисты не могут больше делать в системе три вида по-разному сделанных таблиц. Все унифицируется и разработка идет быстрее.
Конечно, не все так просто, и есть свои сложности. Например, некоторые функции не так просто реализовать в SQL (вычисление хеша для кириллицы) или передача вызова из хранимой процедуры в код веб-приложения. Где-то приходится идти на компромиссы (например, есть ограничения верстки отдельных элементов).
Однако, в целом такой подход позволяет решать ключевые задачи — быстро создавать необходимый функционал, иметь гибкие возможности по дальнейшему развитию и снижать стоимость сопровождения системы.
Почему Falcon Space — это SQL фреймворк
Все управляющие конструкции в системе задаются через процедуры SQL. Разработчик не выводит таблицу — он задает нужные параметры через хранимые процедуры (выходные SELECT в нужном формате), а фреймворк обрабатывает его данные и выводит в виде таблицы. Фреймворк Falcon Space определяет формат множества различных типовых ответов от процедур. Задача программиста — просто верно выдать отклик от процедур.
Более подробное описание как изнутри работает система можно найти в вводной статье документации Falcon Space.
В статье «На пути к созданию продукта. История создания Falcon Space» можно более глубоко погрузиться в предпосылки создания системы и ее особенности.
Процедура проектирования баз данных
В реализации БД, как отмечалось ранее, выделяют "компьютерное" создание собственно БД, интерфейса пользователя и алгоритма приложения (алгоритма преобразования).
Создание собственно БД предполагает использование языка программирования SQL или QBE для:
- • построения структуры таблиц (задание имени таблицы и перечня полей с соответствующими типами данных, указание ключей, индексов и ограничений на отдельные поля или группу полей);
- • установление связей между таблицами с учетом ссылочной целостности;
- • заполнение таблиц данными.
В заполнении таблиц выделяют: начальное заполнение – для тестовой проверки работы БД; рабочее заполнение. Заполнение возможно осуществлять вручную (удобнее всего для небольших по объему таблиц и при начальном заполнении) или программно (при заимствовании данных из других электронных источников).
Ручное заполнение возможно двумя способами:
- • непосредственно самой таблицы (в том числе и через соответствующие утилиты);
- • через специально создаваемые формы, относящиеся к интерфейсу пользователя и являющиеся в какой-то мере аналогом строки "бумажной" таблицы вдоль линейки, положенной на эту строку таблицы.
Интерфейс пользователя
Под интерфейсом пользователя [45] понимается совокупность информационной модели (ИМ) проблемной области, средств и способов взаимодействия пользователя с этой моделью, а также компонентов, обеспечивающих формирование ИМ в процессе работы программной системы. Интерфейс играет важнейшую роль в "приживаемости" разработанных программных продуктов.
Отметим, что задача проектирования интерфейса пользователя многовариантна, при этом процедура выбора в значительной степени неформальна. В силу этой неформальности следует упорядочить процедуру проектирования введением набора правил-принципов. Перечислим основные из них.
- 1. Ориентация на требования пользователя (а не на умение разработчика) – User_centred Design.
- 2. Согласованность (использование однозначных команд в рабочей среде).
- 3. Наличие обратной связи от компьютера (сигнал о восприятии команды).
- 4. Простота интерфейса – предоставление только тех его элементов управления, которые нужны на данном шаге сеанса работы с программным продуктом. Под сеансом (сессией) понимается интервал времени от запуска продукта до выхода из него.
- 5. Гибкость интерфейса – способность учитывать уровень подготовки пользователя.
- 6. Учет эстетических требований, в которые включаются время освоения интерфейса, время решения задачи, субъективная удовлетворенность удобством интерфейса.
- 7. Учет традиций предметной области.
- 8. Итерационный характер разработки интерфейса с учетом предпочтений пользователя.
- 9. Учет возможностей программных и аппаратных средств.
- 10. Возможность учета психологических характеристик пользователя: левое полушарие мозга лучше воспринимает текст, правое – образы, изображения.
- 11. Учет возможностей упрощения программирования.
- 12. Малое время отклика компьютера: если интервал от запроса до ответа компьютера превышает 20 с, систему не считают интерактивной.
Перечисленные требования порой противоречивы, однако их следует учитывать.
Основой интерфейса пользователя является система элементов управления совместно с формами и отчетами.
В качестве синхронизирующего объекта в интерфейсе пользователя используют либо (головное) меню, либо кнопочную форму.
Алгоритм приложения
В традиционном подходе формируется алгоритм прямого преобразования данных исходных таблиц в выходные документы. В качестве выходных документов (таблиц) выступают запросы и отчеты. Запросы формируются с помощью языка программирования SQL или QBE. Отчеты являются фактически запросами, снабженными дополнительными пояснениями. Отчеты могут реализоваться с помощью различных конструкторов (при фактически ручном создании) или с помощью мастеров (в полуавтоматическом режиме).
Алгоритмы приложения в современном подходе отличаются от алгоритмов приложения более сложными вычислениями с возможным формированием промежуточных объектов. Алгоритм приложения может быть написан на различных языках программирования – например, Visual Basic for Applications (VBA), Object Pascal, SQL. В последнем случае он выполняется в виде хранимых процедур, генераторов, триггеров.
В заключение следует отметить, что процесс проектирования итеративен: могут постоянно изменяться требования в ТЗ, составляющие проектирования и реализации БД.
Процессы проектирования и реализации рассмотрим на двух примерах – "Учебный процесс" и "Прием на работу", сжатое описание которых приведено в примерах 2.1 и 2.2.
Реализация описанных в примерах баз данных проводится на СУБД Access и InterBase (в рамках программного продукта Delphi).
Многочисленным возможностям указанных СУБД посвящены специальные отдельные публикации [27–36, 41]. Освоение возможностей, как показал опыт, целесообразно проводить в два этапа:
- 1) рассмотрение основной ветви технологии реализации на конкретном примере (БД) с использованием ограниченного круга возможностей СУБД;
- 2) детальное освоение – по подробным описаниям [27–36, 41] – названных СУБД при учете их многочисленных частных возможностей.
Работы на втором этапе после тщательного изучения технологии на первом этапе, как показывает практика, не вызывает особых затруднений. В то же время описание многочисленных частных процедур второго этапа, как явствует из работ [17–36], занимает объем, превышающий настоящую публикацию. В связи с этим в данной работе осветим только первый этап.
Процедура создания хранилищ данных только начала формироваться. В настоящее время выделились два варианта:
- • полный, описанный в гл. 2;
- • "усеченный", заключающийся в периодической передаче в архивные таблицы данных из оперативных таблиц. Связи между архивными таблицами чаще всего отсутствуют.
Второй вариант приведен в работе [32] и рассмотрен в § 15.4 данной работы.