Getting started with Scala.js, Laminar and Vite
summary
Builds a small Scala.js app end to end and demonstrates a live editable bar chart that actually works: sbt fastLinkJS in watch mode wires to Vite for a fast save-refresh cycle, Laminar handles UI with explicit FRP primitives (Vars, Signals, map, split with id key to preserve DOM and selection), Chart.js renders on a canvas with mount/unmount callbacks, and ScalablyTyped provides static facades so Chart.js is used safely at runtime via ScalablyTyped facades.
AI-written summary · about
chapters (19)
- 0:00Scala.js, Laminar and Vite intro
- 1:27Vite live reloading setup
- 3:39SBT config for Scala.js + Vite
- 6:53Scala.js main with DOM types
- 8:18Live coding Scala.js + Vite
- 9:46Laminar UI integration
- 11:59Live editable bar chart
- 13:27Laminar vars and signals
- 16:04Functional reactive programming with signals
- 17:29Rendering data in Laminar
- 20:00DOM state with split
- 24:01Chart.js with Scala.js/Laminar
- 28:27Chart.js dynamic updates
- 30:37Input bindings for labels
- 32:27Refactoring with updaters
- 34:59Reusable UI components
- 37:13Editing doubles with state
- 38:36Final live bar chart demo
- 38:57Summary & Q&A
related talks
44mGetting started with Scala js, Laminar and Vite
31mSCALA FROM B TO F - BACKEND DEVELOPER ON FRONTEND
29mFull Stack Scala Web Application.
31mHow I learned to stop worrying and love the frontend
56mScala.js: Safety and Sanity in the Wild West of Web development
40mFull Stack Scala
20mQuickly develop web applications with the FastScala framework
44mWriting a Database in Scala.js