Разработка веб-приложений на технологии 1С:Предприятие.Элемент

Меня зовут Павел Королев. Я технический архитектор в компании «Корус». В IT-сфере я с 2010 года, и уже долгое время специализируюсь исключительно на 1С. Ранее у меня был опыт разработки на JavaScript и Python.

С самого начала меня интересовала веб-разработка, и я всегда мечтал, что однажды она появится и внутри экосистемы 1С. Помимо основной работы, я занимаюсь менторством на платформе Solvery, так что, возможно, кто-то из вас знает меня по стримам «Желтого клуба».

Задача моей статьи – поделиться своим опытом разработки. Информации по Элементу пока немного, и я хочу рассказать не только о решениях, которые удалось реализовать, но и о типичных ошибках, с которыми мы сталкивались.

Есть такой тезис, который раньше часто звучал: «Восьмерка еще сырая». Возможно, кто-то и сейчас так говорит. Да, Элемент сейчас находится на стадии бета-тестирования, и в нем действительно есть свои баги. Но технологии развиваются, и мы, как разработчики, стараемся идти в ногу с этим процессом.

 

Первые шаги в веб-разработке и поиск решений для бизнеса

 

Я впервые погрузился в веб-разработку в 2019 году. У заказчика была задача автоматизировать онлайн-продажи, то есть создать интернет-магазин. Найти подходящего подрядчика оказалось непросто. Мы с этим клиентом работали уже девять лет, и в какой-то момент он предложил: «Ребята, а может, сами попробуете сделать интернет-магазин?»

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

Скорости и бизнес-пользы от того, что я в это погружался, было не так много. В итоге магазин мы собрали, все доработали, но очень много времени уходило на то, что заказчик не видел.

 

Опыт работы с 1С:Элемент и обучение

 

1С:Элемент находился в бета-тестировании с марта 2024 года. Примерно тогда же появился онлайн-курс от учебного центра – он стал отличной отправной точкой и дал хорошую базу для понимания того, что вообще можно делать с этой технологией.

Дополнительную поддержку в освоении Элемента мне оказала работа на цифровой кафедре Питерского политеха. В рамках производственной практики мы запустили и продолжаем реализовывать проекты по внутренней автоматизации в «Корусе».

 

Проект с цифровой кафедрой и реализация приложения для студентов

 

 

Цифровая кафедра Питерского политеха – это площадка, где в рамках производственной практики студенты в течение нескольких месяцев (обычно двух-трех) работают над реальными проектами. Каждый студент разрабатывал свое приложение, и мы встречались один-два раза в неделю.

Почему Элемент оказался особенно удачным выбором для студентов? Дело в том, что вокруг 1С до сих пор существует определенное стереотипное восприятие – что это не модно, не молодежно. А 1С:Элемент – это стильно, современно и технологично.

Мы были одними из первых, кто предложил провести практику именно на этой платформе. В итоге у нас получился полноценный проект, с которым мы даже победили на конкурсе цифровых проектов. Мне присудили первое место в номинации «За руководство практикой учащихся Цифровой Кафедры 1С», а моей студентке – в номинации «Лучшее решение на Платформе 1С:Предприятие»: https://1c.ru/news/info.jsp?id=32373

 

 

Что именно мы реализовали? Перед вами – пример главного окна приложения, аналог подсистемы в привычной нам 1С. Интерфейс получился быстрым, отзывчивым, с плавными переходами между вкладками и возможностью масштабирования.

 

 

Это обычный справочник – знакомый каждому 1С-разработчику объект – но представленный в виде фотокарточек. Это позволяет, сразу увидеть читателей и быстро визуально определить, кто взял ту или иную книгу.

 

 

Также была реализована карточка студента. Как видите, интерфейс получился современным, дружелюбным и адаптированным как под десктоп, так и под мобильные устройства.

 

 

Более того, мы решили использовать встроенную 1С:Аналитику, которая доступна в Элементе.

 

 

С ее помощью построили несколько отчетов: теперь мы легко можем увидеть, где находятся книги, у кого они, какие именно экземпляры выданы и когда.

 

 

Это, по сути, динамический список, привычный в 1С. Но с одной важной разницей: в стандартной платформе мы не можем просто так вывести изображение рядом со строкой или настроить переход по клику без написания дополнительного кода. А в Элементе все это работает «из коробки». Нажал – и попал в нужный справочник.

 

Внутренний проект: планирование отпусков

 

В «Корусе» у нас есть задача ресурсного планирования на проекте – нужно понять, когда сотрудники могут уходить в отпуска, и дать им возможность самим вносить информацию.

Раньше эту задачу мы решали через Google-формы: заявки собирались, выгружались в Excel, а затем обрабатывались вручную.Сейчас у нас появился личный кабинет сотрудника, который строится на базе формирования плана отпуска. Пока функционал сосредоточен на этом, но в дальнейшем он будет расширяться.

Сейчас в системе – около 200 пользователей.

 

Мы реализовали динамический список, в котором каждый сотрудник видит информацию по своим заявкам и запланированным отпускам. Администраторы, в свою очередь, имеют доступ ко всем данным. Реализовано это с помощью RLS (ограничений видимости данных), которые работают непосредственно в 1С:Элементе.

 

 

Также разработана карточка заявки на отпуск, которую заполняет сам сотрудник. Верхняя часть формы заполняются на основе данных из базы: ФИО, табельный номер, подразделение и другие реквизиты подставляются автоматически. Пользователю остается ввести только даты.

Сейчас уже реализована задача по интеграции – это разработка всем известных HTTP-сервисов на стороне Элемента.

 

Особенности синтаксиса и разработки в 1С:Элемент

 

Поговорим о синтаксисе. Это важная тема – чем быстрее вы поймете ключевые особенности, тем меньше времени потратите. Хочу поделиться тем, с чем столкнулся сам, и что для меня стало настоящим открытием.

 

 

Самое крутое, что обнаружилось – это Yaml. Я думаю, что многие используют или по крайней мере знают о том, что в 1С есть возможность выгрузить формы в XML, обработать этот XML для своих задач и загрузить обратно. Но сразу бросаются в глаза две проблемы:

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

• Во-вторых – размер файлов. Чем больше тегов, тем больше объем.

 

 

А вот в 1С:Элемент все устроено иначе. Интерфейсы описываются в очень понятном и дружелюбном формате. Все структурировано, читаемо: вы сразу видите, например, описание группы команд, какие в ней есть навигационные кнопки и куда они ведут. Часто разработка интерфейса вообще не требует работы в IDE – достаточно открыть YAML-файл и добавить нужные строки. Это тоже очень удобно.

Для нас, 1С-разработчиков, есть привычные понятия клиентского и серверного контекстов. В Элементе к ним добавляются аннотации видимости – механизм, позволяющий явно указать, какие элементы интерфейса или методы являются публичными, а какие – приватными. Например, можно задать, что определенный метод доступен только внутри текущего типа или ограничен определенной подсистемой. Это можно сравнить с приписками к модулю в типовых конфигурациях 1С – служебными и т. п.

 

 

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

 

Работа с виртуальными таблицами и запросами

 

Мы знаем, что у регистров 1С есть виртуальные таблицы. В 1С:Элемент есть аналогичный механизм – объект виртуальных таблиц, который мы успешно используем в своих проектах.

У нас была задача отобразить список самых популярных книг среди читателей. По сути, это динамический список, основанный на аналитике выдач.

Как мы это реализовали:

 

 

В дереве метаданных добавили новый объект – «ТопКниг».

 

 

Добавили запрос.

 

 

С помощью этого запроса получили некую виртуальную таблицу, которую смогли использовать в разделе «Таблицы» нашего динамического списка. Затем в присоединенной таблице присоединили ТопКниг.

 

 

Добавили фильтрацию и отобразили только книги с самым высоким рейтингом на текущий момент.

 

Литеральные запросы: новый подход к работе с данными

 

 

При изучении типового запроса CRM было непривычно видеть запросы, которые написаны не совсем обычно для 1С. Это так называемые литеральные запросы (см. пример на картинке выше).

Когда мы накладываем параметр запроса, нам не нужно писать запрос УстановитьПараметр() и т. п. Это очень удобно: мы перехватываем контекст, где у нас выполняется запрос, и можем сразу к нему обращаться. При том, что дополнительно есть так называемые произвольные запросы, которые более привычны 1С-нику, лучше использовать литеральные.

 

Контекст доступа, параметры сеанса и безопасность

 

 

Вспомним типичную ситуацию в классической 1С – работа с HTTP-сервисами. Вызов приходит от пользователя, и система должна вернуть какие-то данные. Но что, если у этого пользователя нет прав на определенный справочник – особенно если он новый и роли еще не настроены?

Обычно мы решаем это либо расширением прав через роли, либо включением привилегированного режима.

 

 

В 1С:Элемент появляется возможность расширять контекст. Если к нам пришел вызов, мы можем сказать, что на такой-то справочник мы можем дополнительно выдать право чтения.

 

 

На данный момент в Элементе нет привычного механизма параметров сеанса, и неизвестно, появится ли он в будущем. Но нам нужно было решить стандартную задачу для 1С: связать сотрудника с текущим пользователем.

Мы реализовали это с помощью нового подхода – добавили вид элемента «Структура». Обратите внимание: это не встроенная структура из языка 1С, а структура непосредственно в дереве метаданных.

 

 

Это оказалось особенно удобно в связке с литеральными запросами. В классической платформе мы бы сначала писали запрос, затем вручную обрабатывали результат и заполняли структуру. В Элементе мы просто описали структуру в метаданных и сразу использовали ее в литеральном запросе – данные заполняются автоматически, сразу в нужном формате.

 

 

После создания приложения мы вызвали метод получения данных пользователя и добавили проверку – все стандартно, но реализовано чище и прозрачнее.

Кстати, хороший вопрос: насколько это правильно – возвращать некие данные, которыми мы оперируем, с сервера на клиент (потому что их можно перехватить)? Я обсуждал это с коллегами и мы пока не сформулировали свою позицию.

 

Интерфейс, навигация и отказ от записи

 

 

Поговорим об интерфейсе. Один из ключевых элементов – панель навигации, которая по сути заменяет привычные подсистемы из классической 1С.

 

 

В 1С:Элемент появляется отдельный компонент – «Панель навигации».

 

 

В ней мы указываем, какие формы или разделы должны открываться по клику.

 

 

После чего эту панель можно использовать в клиентском приложении, просто сославшись на нее.

 

 

В обычной 1С мы переходим между подсистемами, кликая по дереву меню. Здесь же используется механизм биндинга: в нужном поле мы просто указываем путь к созданному компоненту – то есть к той самой панели навигации, которую создаем.

 

 

Еще одна типичная задача для любого 1С-разработчика – проверка корректности введенных данных. В традиционной платформе мы часто используем конструкцию «Отказ = Истина», чтобы прервать запись при ошибках.

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

 

Матричные группы, регламентные задания и видимость элементов

 

 

Одним из интересных нововведений в 1С:Элемент стали матричные группы, когда в форме списка можно задать, каким образом у нас будет вводиться информация. На изображении список карточек в красивом виде, который удалось реализовать через матричные группы.

 

 

Пример описания в YAML и задача каких-либо настроек.

 

 

Пришлось разбираться, как именно создаются регламентные задания в 1С:Элементе. Интерфейс здесь достаточно понятный: есть форма регламентного задания (например, для возврата книг), но сразу не очевидно, как его добавить. Отдельного объекта метаданных для этого нет, поэтому задание нужно создавать программно.

 

 

Сначала описывается константа с именем регламентного задания.

 

 

Затем при планировании проверяется: если такого задания в базе еще нет – оно создается с заданным ключом. В этом же месте можно указать время выполнения и другие параметры.

 

 

Еще один важный аспект – управление видимостью интерфейсных элементов. Здесь есть свои нюансы. Расскажу, как мы скрыли консоль запросов от рядовых сотрудников.

 

 

Изначально консоль была добавлена через панель навигации и отображалась для всех пользователей.

 

 

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

 

 

В итоге после 11-й строки просто добавили условие с проверкой прав. Причем формулу можно было изменить не только через IDE, но и напрямую – прописав строку в YAML.

 

Советы по началу работы с 1С:Элемент

 

С чего начать работу с 1С:Элемент? Поделюсь тем, что проверил на себе.

Один из самых перспективных и вдохновляющих путей – сотрудничество с вузами и цифровыми кафедрами. Эта практика уже активно развивается по всей стране. Я сам из Воронежа, и здесь лет 5–6 назад началась активная работа с университетами: компании предлагали образовательные программы, проводили практики, участвовали в разработке учебных курсов.

Это отличная возможность заинтересовать студентов и молодежь новыми технологиями. Еще плюсом является то, что когда студент сделает приложение, он может поделиться им с друзьями. Сейчас большинство разрабатывает в облаке. Сделал приложение в пару кликов – и сразу можешь отправить ссылку друзьям. Это мощный мотиватор.

Еще один отличный способ погрузиться в Элемент – взять кого-то на менторинг. Менторство – это не только помощь другому, но и возможность самому глубже понять технологию. Когда объясняешь, курируешь, отвечаешь на вопросы – начинаешь видеть детали, которые раньше упускал. О менторстве у меня есть отдельная статья: //infostart.ru/pm/2436382/

Автоматизация внутри компании. Внутри компании всегда есть какие-то кейсы, которые можно было бы автоматизировать. Если проект рождается не сразу, стоит поискать «боль», которую можно решить с помощью 1С:Элемента.

Некоторое время назад у меня был заказчик, для которого мы реализовали задачу по контролю и развертыванию серверов. Решение сделали на платформе 1С: куда-то кидали HTTP-запросы, что-то принимали – фактически получилась небольшая админка. И если бы Элемент тогда был хотя бы в бете, то он отлично подошел бы. Элемент гораздо быстрее реагирует на действия пользователя, чем web-клиент 1С, и в таком сценарии дал бы серьезное преимущество.

И, конечно, не стоит забывать о pet-проектах. Вот некоторые идеи:

• Фитнес-зал

• Салон красоты

• Магазин фототехники

• Call-центр

• Стоматология

• Школьный дневник

• Сервис продажи билетов

• Service Desk

На первый взгляд они могут показаться слишком простыми, но когда дойдет до реализации, поверьте – мозги закипят.

 

Полезные ссылки

 

• Репозитории с наработками на 1С:Элемент – можно присоединиться к сообществу, поддержать авторов и посмотреть, что уже сделано: https://gitflic.ru/company/enterprise_element_community

• Официальный чат по Элементу – активное сообщество, где можно задавать вопросы и получать помощь: https://t.me/e1c_element/22634

• Отдельный чатик open-source-сообщества, которое ведет репозитории: https://t.me/+RFRJdcpD9RVkNjUy. Присоединяйтесь – там работают действительно крутые ребята.

 

*************

Статья написана по итогам доклада (видео), прочитанного на конференции INFOSTART TECH EVENT.