Resources

Guides

• Quick Start

• Video Introduction to Laminar

• Live Demo App & Examples

• See also the "Tutorials, Videos & Blog Posts" section below.

Documentation

• Documentation

• Laminar API doc • Airstream API doc

• Changelog

Videos & Conference Talks

• Video Introduction to Laminar

• Kit Langton – Stockholm Syndrome Escape Velocity

• Kit Langton – Deriving the Frontend

• Sébastien Doeraene – Getting started with Scala.js, Laminar and ScalablyTyped

Community & Support

• Discord for support, advice, feature requests, showing off your Laminar projects, posting Laminar jobs, etc.

  • Note: Until late 2022, our chat was in Gitter. Please post new questions to Discord.

• Github discussions for how-tos, whys, and any questions or discussions that other people would benefit from easily finding online.

• Github issues for bugs and buglike issues.

• Please consider sponsoring Laminar on Github to make my OSS work more sustainable and increase the pace of Laminar development.

Useful Tools

• Scribble.ninja to try things on the fly.

• Html to Scala Converter can convert HTML strings to Laminar code.

Open Source Laminar Apps

• ScalaIO's website - ScalaIO conference website (github)

• TodoMVC – Standard todo app demonstrating basic state management etc.

• Wind Gradient – Simple full stack weather app.

• Twotm8 – Twitter clone. See demo and also the detailed tutorial.

• Skłable – multiplayer Scrabble-like game. Demo

• Java Date Formatter – Demo

• Catenary – interactive Catenary tutorial Demo

• Laika-Laminar – converts Markdown and ReStructuredText to HTML using Laika. Demo

• NPC Generator

• Hippo – web-based heap dump viewer.

• Full stack ZIO blog app with Laminar

• Network Threat Monitor

• Semagrams.jl + Demo

Starter Kits & More Examples

• Laminar demo & examples + docs – Official Laminar full stack setup, example applications, etc.

• keynmol/http4s-laminar-stack – Laminar setup with http4s, sttp, docker, and other niceties

• b12consulting/Laminar-Play-Slick-ZIO

• sherpal/full-scala-scala-heroku – Laminar setup with Play & Heroku

• keynmol/laminar-static-gh-pages – Template for publishing a static site with Laminar

• keynmol/scalajs-tauri-example – Example of using Laminar with Tauri to build a Desktop application, similar to Electron

• Quafadas/cask-laminar – Laminar with Cask setup, based on keynmol/http4s-laminar-stack

• vic/laminar_cycle/examples – Examples of Cycle.js style apps in Laminar

Examples without Scalajs-bundler

• Laminar demo & examples – Full stack Laminar setup with Vite and other niceties.

• sjrd/scalajs-sbt-vite-laminar-chartjs-example – Setup with Vite, Laminar and Chart.js (via ScalablyTyped)

• lolgab/scala-fullstack – Laminar setup with Akka HTTP, Mill, Sloth

• yurique/scala-js-laminar-starter.g8 – Laminar setup with Akka HTTP, Tailwind CSS, Waypoint, and a pure webpack config instead of scalajs-bundler

• kitlangton/zio-app – Quickly create apps with ZIO and Laminar

• yurique/laminar-vite2-example – Example of a Vite build for a Scala.js + Laminar + frontroute app.

• yurique/laminar-snowpack-example - Laminar setup with Snowpack (instead of Webpack) and frontroute

Warning: Using ModuleKind.ESModule (e.g when using Vite or Snowpack) results in bigger JS bundle sizes than usual because Scala.js is unable to use gcc in this case. Scala.js #3893

• keynmol/scalajs-tauri-example – Example of using Laminar with Tauri and Vite to build a Desktop application, similar to Electron

Addons & Extensions

• Laminext – A collection of useful extensions, utilities and components for Laminar and Airstream

• Waypoint – URL router for Laminar

• frontroute – Alternative router for Laminar with API inspired by Akka HTTP

• Formula – Derive functional, reactive, Laminar forms at compile-time with this type-safe, composable form combinator library

• Laminar.cycle – Cycle.js dialogue abstraction in Laminar

• Laminar dragging

• Laminar color

• Laminar contenteditable

Component Libraries

• SAP UI5 Laminar Web Components – live demo

• Shoelace Web Components for Laminar – WIP? Maybe? Some day.

• Material UI Laminar Web Components (Note: appears to be abandoned)

• Or, easily make your own interfaces. See the Shoelace and UI5 examples above for good patterns.

Tutorials, Videos & Blog Posts

• My Four Year Quest For Perfect Scala.js UI Development – the history and ideological foundations of Laminar

• [VIDEO] Laminar – Smooth UI Development with Scala.js – Laminar foundations and mechanics that everyone should know

• [VIDEO] Stockholm Syndrome Escape Velocity – Kit Langton sets an impossible standard in conference talk delivery

• [VIDEO] Deriving the Frontend – Form Combinator Fun with Scala.js

  • See updated repo for safe management of Owner-s

• Official Scala.js tutorial explains how to make a Scala.js app with Vite, Laminar, and a JS charting library (using ScalablyTyped). Final code repo. Video version: part 1 (Vite), part 2 (Laminar & ScalablyTyped).

• Twotm8 – Building the Frontend walks you through creating a twitter clone in full stack Scala. The chapter on frontend explains how to use Laminar, implement routing with Waypoint, and styling with ScalaCSS. See also the source code and demo.

• Cross-Platform Mobile dev with Scala and Capacitor

• SoftwareMill's Hands-on Laminar article includes form validation, and integration with ScalaCSS and Monocle

• Alvin Alexander's Laminar 101, 102, and 103 tutorials take you from setting up a static Laminar page to implementing a basic router.

• Laminar TicTacToe tutorial in Japanese by 110416

My Other Related Projects

• Airstream – The reactive layer of Laminar. Its docs explain everything about streams, signals, event buses, state vars, etc.

• Waypoint – URL router for Laminar

• Scala DOM Types – Type definitions that we use for all the HTML tags, attributes, properties, and styles.

• ew – Scala.js interfaces to native JavaScript data structures (such as arrays and maps) that offer sometimes significant performance advantages by sacrificing Scala semantics (such as structural equality of case classes).