A polyglot purely functional & reactive UI framework for more predictable code

Get Started GitHub

OutWatch is declarative

OutWatch combines functional and reactive programming to enable you to build performant web applications using pure functions.

You won’t see any imperative calls like dispatch or setState. Declarative code makes your app easier to reason about and more predictable, allowing you peace of mind.

Simple components

In OutWatch components are just functions, no boilerplate necessary. Reactive Programming allows us to create fully self-responsible components that never touch external state.

No more wondering where an action or a change in state came from. Components are fully decoupled and therefore extremely reusable.

Complete type safety

With OutWatch typos and type-errors are a thing of the past. Your editor will immediately catch such bugs, without needing to compile.

Explore the whole API with its documentation right there in-line with your code.


$ sbt new outwatch/seed.g8
$ bower install purescript-outwatch
import outwatch.dom._
import outwatch.dom.dsl._
import monix.execution.Scheduler.Implicits.global

object Hello {
  def main(args: Array[String]): Unit = {

    val name = Handler.create[String]().unsafeRunSync()

    val node = div(
      input(placeholder := "Name", onInput.value --> name),
      h2("Hello ", child <-- name)

    OutWatch.renderInto("#app", node).unsafeRunSync()
module Main where

import OutWatch.Dom
import OutWatch.Core (render) as OutWatch

main =
  let names = createStringHandler[]

      node = div
        [ input[placeholder := "Name", inputString ==> names]
        , hr[]
        , h2[text "Hello ", childShow <== names.src]

  in OutWatch.render "#app" node

Get Started with Scala Get Started with PureScript