hyperbole: Interactive HTML apps using type-safe serverside Haskell

Create interactive HTML applications with type-safe serverside Haskell. Inspired by HTMX, Elm, and Phoenix LiveView.

{-# LANGUAGE DeriveAnyClass #-}
{-# LANGUAGE OverloadedStrings #-}
{-# LANGUAGE TypeFamilies #-}
module Main where

import Data.Text (Text)
import Web.Hyperbole
import Web.Atomic.CSS


main :: IO ()
main = do
  run 3000 $ do
    liveApp quickStartDocument (runPage page)

page :: (Hyperbole :> es) => Eff es (Page '[Message])
page = do
  pure $ do
    hyper Message1 $ messageView "Hello"
    hyper Message2 $ messageView "World!"

data Message = Message1 | Message2
  deriving (Generic, ViewId)

instance HyperView Message es where
  data Action Message = Louder Text
    deriving (Generic, ViewAction)

  update (Louder msg) = do
    let new = msg <> "!"
    pure $ messageView new

messageView :: Text -> View Message ()
messageView msg = do
  button (Louder msg) ~ border 1 $ text msg

Examples

The examples directory contains an app demonstrating many features. See them in action at hyperbole.live

Getting Started with Cabal

Create a new application:

$ mkdir myapp
$ cd myapp
$ cabal init

Add hyperbole and text as dependencies to the .cabal file:

    build-depends:
        base
      , hyperbole
      , text

Paste the above example into Main.hs, and run:

$ cabal run

Visit http://localhost:3000 to view the application

Learn More

• Using NIX
• Local Development
• Comparison with Similar Frameworks

In the Wild

The NSO uses Hyperbole to manage Level 2 Data pipelines for the DKIST telescope. It uses complex user interfaces, workers, databases, and more. The entire codebase is open source.

Contributors

• Sean Hess
• Kamil Figiela
• Christian Georgii
• Pfalzgraf Martin
• Tushar Adhatrao
• Benjamin Thomas
• Adithya Obilisetty