В своих предыдущих постах я создал приложение Отчет о погоде на основе Scala.js и объяснил, как написать тест-кейс на Scala.js, используя то же приложение. Ранее я создавал html-страницу с помощью библиотеки Scala.Js Jquery. Но код был не очень чистым и хорошо структурированным.
Я начал изучать ScalaTags и ScalaCSS, чтобы сделать приложение более интерактивным и чистым, используя Scala.js.
ScalaTags — это библиотека построения HTML для Scala, которая преобразует код Scala в HTML-страницу. Он безопасен для типов, поэтому опечатки, такие как dvi или inpt, могут быть обнаружены во время компиляции.
Точно так же ScalaCSS — это библиотека построения CSS для Scala, которая преобразует Scala-код в CSS. Это также безопасно для типов. Вы можете создавать отдельные CSS, такие как SCSS/LESS, или встроенные стили.
Сначала вам нужно добавить зависимости в build.sbt
Теперь вы можете создать свой CSS в scala следующим образом:
Я воспользовался помощью примера ScalaCSS inline.
Теперь вы можете начать писать свою html-страницу на Scala, используя ScalaTags:
Вы можете увидеть разницу ниже без ScalaTags и со ScalaTags.
Мы можем создать HTML-страницу безопасным способом, используя ScalaTags.
Вы можете найти полный рабочий и протестированный код здесь: - ScalaJs_Weather_Report.