Проект HTML Builder — JS: Прототипы

Видео может быть заблокировано из-за расширений браузера. В статье вы найдете решение этой проблемы.

Формат, подобный тому что мы реализуем, крайне популярен в лисп подобных языках. Это связано с тем, что в Лиспах наиболее естественный способ представления данных — списковые структуры. Один из самых популярных шаблонизаторов на языке Clojure — hiccup. Типичный пример HTML на нём выглядит так:

user=> (html [:div#foo.bar.baz "bang"])
"<div id=\"foo\" class=\"bar baz\">bang</div>"

или так:

[:input { :type      "text"
          :allow-full-screen true
          :id        "comment"
          :class     ["input_active" "input_error"]
          :style     { :background-color "#EEE"
                       :margin-left      42 }
          :on-change (fn [e]
                       (js/alert (.. e -target -value))) }]

Хотя, с непривычки, такое представление может напугать, в реальности программисты не испытывают проблем с таким способом работы, более того, HTML как данные, открывает широкие возможности по автоматической обработке и рефакторингу (переработке).

Этот шаблонизатор встроен в rum, библиотеку для комфортной работы с React в ClojureScript.

Лайвкодинг по проектированию библиотеки HTML Builder: https://www.youtube.com/watch?v=us8AMJKEzZg&ab_channel=Hexlet