Год назад в SoftwareBrothers мы начали разработку AdminBro — универсальной панели администратора для приложений Node.js.
Нашей целью было создать инструмент, который позволит разработчикам javascript по всему миру добавлять в свои приложения расширенные, красивые и полнофункциональные панели администратора за несколько минут.
Таким образом, мы надеялись, что этот инструмент значительно увеличит внедрение Node.js, особенно в мире стартапов.
С тех пор AdminBro стал довольно популярным, и сегодня мы рады сообщить о выпуске долгожданной версии two-point-O, которая выглядит так:
Что вы можете найти в версии 2.0
Design System — с легкостью создавайте собственные функции прямо сейчас
Теперь весь пользовательский интерфейс панели администратора и компоненты, стоящие за ней, следуют принципам атомарного дизайна.
Короче говоря, теперь вы можете повторно использовать все компоненты пользовательского интерфейса AdminBro, которые были разделены на 2 основные группы: Атомы (такие как Значок, Кнопка, Значок и т. д.) и Molecules (например, DatePicker, DropZone, Pagination и т. д.).
Ядром Дизайн-системы является Тема-объект. С помощью styled-components и styled-system теперь вы можете легко создавать сложные компоненты с адаптивным макетом.
Приведу пару примеров:
<Button>Click me</Button> <Button size="icon" variant="primary" rounded> <Icon icon="Save" /> </Button>
дает
<Box boxShadow="card" padding="xl"> <H4>Card Title</H4> <Text>This is text below the title</Text> </Box>
дает
Все компоненты можно найти в нашей документации. Обязательно ознакомьтесь с ними.
React Hooks и смарт-компоненты
Компоненты Design System — не единственное обновление интерфейса, которое мы сделали. Теперь вы можете повторно использовать наши смарт-компоненты и хуки React и быстро создавать весь уровень приложения.
Итак, допустим, вы хотите создать пользовательскую форму, которая создает новых пользователей в системе.
Теперь для этого можно использовать хук useRecord с BasePropertyComponent.
BasePropertyComponent отобразит все ваши поля, такие как имя пользователя, адрес электронной почты и т. д. (все, что вы хотите), где useRecord отправит данные в серверную часть AdminBro и сохранит/обновит запись. В случае каких-либо ошибок проверки они будут напечатаны BasePropertyComponent.
И все это без написания ни строчки кода на бэкенде.
Взгляните на пример в Документации, чтобы увидеть, как это может работать.
I18n
Поскольку все больше людей, не говорящих по-английски, используют AdminBro, мы добавили поддержку I18n.
С помощью TranslateFunctions (доступного как на внешнем, так и на внутреннем интерфейсе) теперь вы можете перевести все приложение на свой язык.
I18n также дает вам возможность изменить любой произвольный текст в пользовательском интерфейсе.
Взгляните на документацию файла Locale здесь и наши стандартные английские переводы.
Поддержка Firebase
Попутно мы запустили отдельный плагин, который позволяет запускать экземпляры AdminBro в Firebase Cloud Functions. Мы надеемся, что это сделает AdminBro идеальным выбором для стартапов, когда стоимость и время доставки имеют решающее значение.
Некоторые другие вещи
Так как мы переписали весь интерфейс — мы добавили небольшие изменения в пользовательский интерфейс. Взгляните на пример приложения, чтобы увидеть, как оно выглядит прямо сейчас.
Что дальше
Мы также почистили Страницу проблем в репозитории AdminBro GitHub и добавили несколько потрясающих новых функций. Если вам нравится идея AdminBro — автоматизированного интерфейса администратора для приложений Node.js — попробуйте его в своем проекте и не забудьте запустить репозиторий.