Рубріки: Новости

Turbo: CSS-фреймворк, претендующий на звание языка программирования

Богдан Мирченко

Разработчик Тайбор Холтер написал фреймворк Turbo CSS, который сам же называет и языком программирования. Это utility-first фреймворк, но он не содержит готовую огромную библиотеку классов для стилизации, а компилирует на лету только те, что нужны. По словам создателя, в новом фреймворке имена классов CSS создается путем вызова функций и передачи им аргументов.

Согласно документации, Turbo CSS можно использовать в уже существующей кодовой базе. Холтер реализовал его на JavaScript и Go (исходники скоро должны появиться на GitHub), которые можно использовать в качестве компилятора Turbo CSS на другие языки.

 Фреймворк предоставляет следующие возможности:

  • Объединение нескольких селекторов в одно выражение
  • Применение псевдоселокторов, таких как: placeholder: , selection: , before: , after: и thumb:, к псевдоэлементам
  • Утилиты применяются к элементу только в том случае, если другие элементы соответствуют заданным критериям.логику можно задавать с помощью специальных логических селекторов
  • Поддержку пользовательских утилит для написания собственных классов. Вот как может выглядеть код для определения класса btn:
t1
.btn {
    px-16
    py-8
    rounded-3
    bg-c-blue
    color-white
    shadow-4
    transition
    select-none
    cursor-pointer
    
    hover:shadow-8
    hover:bg-c-blue-400
    
    focus:outline-0
    focus:shadow-outline-blue-500-50
    
    active:shadow-1
    active:bg-c-blue-600
}

Автор утверждает, что при создании Turbo CSS вдохновлялся функциональным программированием, собственным опытом и требованиями для создания конструктора веб-сайтов, а также известным фреймворком Tailwind CSS. Поэтому позже провел сравнительный анализ его со своей разработкой, указав, что ему удалось усовершенствовать.

В частности, Холтер отметил более простую настройку Turbo CSS, отсутствие параметров и файлов конфигурации, которые могли бы повлиять на его API, способность комбинирования селекторов любым способом, поддержку сокращенных функций и возможность компиляции в браузере. При этом автор отметил, что уважает авторов Tailwind CSS и готов поделиться с ними своими идеями.

По словам Холтера, язык системы проектирования Turbo CSS появился из-за необходимости создать дизайн-систему для Boomla Website Builder Website и Application Platform. Доступные ему инструменты были очень плохими, а языки программирования и ни один из существующих CSS-фреймворков не подходили для определения классов и повторного использования их в качестве строительных блоков более высокого уровня.

Создатель фреймворка заявляет, что Turbo CSS используется уже на 1000 веб-сайтов. Его можно протестировать на конструкторе Boomla.

Останні статті

Что такое прокси-сервер: пояснение простыми словами, зачем нужны прокси

Прокси (proxy), или прокси-сервер — это программа-посредник, которая обеспечивает соединение между пользователем и интернет-ресурсом. Принцип…

21.11.2024

Что такое PWA приложение? Зачем необходимо прогрессивное веб-приложение

Согласитесь, было бы неплохо соединить в одно сайт и приложение для смартфона. Если вы еще…

19.11.2024

Как создать игру на телефоне: программирование с помощью конструктора

Повсеместное распространение смартфонов привело к огромному спросу на мобильные игры и приложения. Миллиарды пользователей гаджетов…

17.11.2024

Google Bard: эффективный аналог ChatGPT

В перечне популярных чат-ботов с искусственным интеллектом Google Bard (Gemini) еще не пользуется такой популярностью…

14.11.2024

Скрипт и программирование: что это такое простыми словами

Скрипт (англ. — сценарий), — это небольшая программа, как правило, для веб-интерфейса, выполняющая определенную задачу.…

12.11.2024

Дедлайн в разработке: что это такое простыми словами

Дедлайн (от англ. deadline — «крайний срок») — это конечная дата стачи проекта или задачи…

11.11.2024