Tutorial (Optional)

Run as Desktop App (Optional)

This step is optional. Continue only if you want to run your app as a native desktop WebView.

Optional Step 1

Extract shared app logic

// internal/app/app.go (shared by web and desktop)
package app

import (
    mb "github.com/YoshihideShirai/marionette/backend"
    mf "github.com/YoshihideShirai/marionette/frontend"
)

func New() *mb.App {
    app := mb.New()
    app.Page("/", func(ctx *mb.Context) mf.Node {
        return mf.TextComponent(mf.TextProps{Text: "Hello World", Size: "lg"})
    })
    return app
}

Optional Step 2

Create web and desktop entrypoints under cmd/

// cmd/marionette-hello-web/main.go
package main

import "marionette-hello/internal/app"

func main() {
    a := app.New()
    if err := a.Run("127.0.0.1:8080"); err != nil {
        panic(err)
    }
}
// cmd/marionette-hello-desktop/main.go
package main

import (
    "log"

    "marionette-hello/internal/app"
    "github.com/YoshihideShirai/marionette/desktop"
)

func main() {
    a := app.New()
    if err := desktop.Run(a, desktop.Options{Title: "Marionette Desktop", Width: 1200, Height: 800}); err != nil {
        log.Fatal(err)
    }
}

Optional Step 3

Switch targets by command

go run ./cmd/marionette-hello-web
go run -tags marionette_desktop ./cmd/marionette-hello-desktop

On Linux, install GTK 3 and WebKitGTK development packages before running the desktop command.

After this, check the Components Gallery to expand your UI.