Pretty Nice Framework

mkdir mysite && cd mysite
npx prettynice init

-- server/src/Main.gren

module Main exposing (main)

import Node exposing (Environment)
import Prettynice
import Prettynice.Request exposing (Request)
import Prettynice.Response as Response exposing (Response)
import Task exposing (Task)

main : Prettynice.Program Model {}
main =
    Prettynice.defineProgram
        { init = init
        , router = router
        }

type alias Model = {}

init : Environment -> Prettynice.Init Model {}
init env =
    Prettynice.startProgram
        { env = env
        , host = "127.0.0.1"
        , port_ = 3000
        , model = {}
        }

router : Model -> Request -> Response msg -> Task Never (Response msg)
router model request response =
    response
        |> Response.asText "Hello!"
        |> Task.succeed

-- client/src/Components/Counter.gren

module Components.Counter exposing (component, Model, Msg, Props)

import Prettynice.Component exposing (Component)
import Transmutable.Html exposing (..)
import Transmutable.Html.Events exposing (..)

component : Component Props Model Msg
component =
        { init = init
        , update = update
        , view = view
        , subscriptions = subscriptions
        }

-- Model holds component state
type alias Model =
    { count : Int }

-- Props define the arguments passed into your component
type alias Props =
    { start : Int }

-- This can be called server-side to initialize your component with Props from the server
init : Props -> { model : Model, command : Cmd Msg }
init props =
    { model = { count = props.start }
    , command = Cmd.none
    }