Skip to content

Use any web browser as GUI, with Go in the backend and modern web technologies in the frontend.

License

Notifications You must be signed in to change notification settings

webui-dev/go-webui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

WebUI Go

Use any web browser or WebView as GUI.
With Go in the backend and modern web technologies in the frontend.

Screenshot

Features

  • Parent library written in pure C
  • Fully Independent (No need for any third-party runtimes)
  • Lightweight ~200 Kb & Small memory footprint
  • Fast binary communication protocol between WebUI and the browser (Instead of JSON)
  • Multi-platform & Multi-Browser
  • Using private profile for safety

Installation

Note

Until the next stable release it is recommended to use go-webui's latest development version.

  • As Go module

    The easiest way to setup go-webui as a Go module is to use the setup.sh script.

    It will run go get to retrieve the go-webui module and bootstrap the version of the WebUI C library that it is using.

    • Release version
    # Available soon.
    # sh -c "$(curl -fsSL https://raw.githubusercontent.com/webui-dev/go-webui/v2.5.1-beta-1.0/setup.sh)"
    • Development version
    sh -c "$(curl -fsSL https://raw.githubusercontent.com/webui-dev/go-webui/main/setup.sh)"
  • As submodule

    The instructions below set up go-webui in a modules subdirectory of a go project.

    go-project
    ├── modules
    │   └── go-webui
    ├── ...
    └── go.mod
    

    Add and init the submodule

    git submodule add https://github.com/webui-dev/go-webui.git modules/go-webui
    git submodule update --init --filter=blob:none --recursive

    replace the path accordingly in the g.mod file.

    require github.com/webui-dev/go-webui/v2 v2.4.3
    
    replace github.com/webui-dev/go-webui/v2 v2.4.3 => ./modules/go-webui
    
  • As git clone - for development and contribution purposes

    The command below retrieves go-webui as a lightweight, filtered clone.

    git clone --recursive --shallow-submodules --filter=blob:none --also-filter-submodules \
      https://github.com/webui-dev/go-webui.git

Usage

Example

<!-- index.html -->
<!doctype html>
<html>
   <head>
      <script src="webui.js"></script>
      <style>
         body {
            background: linear-gradient(to left, #36265a, #654da9);
            color: AliceBlue;
            font: 16px sans-serif;
            text-align: center;
            margin-top: 30px;
         }
      </style>
   </head>
   <body>
      <h1>Welcome to WebUI!</h1>
      <input type="text" id="name" value="Neo" />
      <button onclick="handleGoResponse();">Call Go</button>
      <br />
      <samp id="greeting"></samp>
      <script>
         async function handleGoResponse() {
            const inputName = document.getElementById('name');
            // Call a Go function.
            const result = await webui.greet(inputName.value);
            document.getElementById('greeting').innerHTML = result;
         }
      </script>
   </body>
</html>
// main.go
package main

import (
	"fmt"

	ui "github.com/webui-dev/go-webui/v2"
)

func greet(e ui.Event) string {
	name, _ := ui.GetArg[string](e)
	fmt.Printf("%s has reached the backend!\n", name)
	jsResp := fmt.Sprintf("Hello %s 🐇", name)
	return jsResp
}

func main() {
	// Create a window.
	w := ui.NewWindow()
	// Bind a Go function.
	ui.Bind(w, "greet", greet)
	// Show frontend.
	w.Show("index.html")
	// Wait until all windows get closed.
	ui.Wait()
}

Find more examples in the examples/ directory.

Documentation

Enable TLS/SSL

Enable WebUI's security layer by adding the webui_tls build tag.

go run -tags webui_tls <path>

Debugging

To use WebUI's debug build, add the webui_log build tag. E.g.:

go run -tags webui_log minimal.go

UI & The Web Technologies

Borislav Stanimirov discusses using HTML5 in the web browser as GUI at the C++ Conference 2019 (YouTube).

CPPCon

Web application UI design is not just about how a product looks but how it works. Using web technologies in your UI makes your product modern and professional, And a well-designed web application will help you make a solid first impression on potential customers. Great web application design also assists you in nurturing leads and increasing conversions. In addition, it makes navigating and using your web app easier for your users.

Why Use Web Browsers?

Today's web browsers have everything a modern UI needs. Web browsers are very sophisticated and optimized. Therefore, using it as a GUI will be an excellent choice. While old legacy GUI lib is complex and outdated, a WebView-based app is still an option. However, a WebView needs a huge SDK to build and many dependencies to run, and it can only provide some features like a real web browser. That is why WebUI uses real web browsers to give you full features of comprehensive web technologies while keeping your software lightweight and portable.

How Does it Work?

Diagram

Think of WebUI like a WebView controller, but instead of embedding the WebView controller in your program, which makes the final program big in size, and non-portable as it needs the WebView runtimes. Instead, by using WebUI, you use a tiny static/dynamic library to run any installed web browser and use it as GUI, which makes your program small, fast, and portable. All it needs is a web browser.

Runtime Dependencies Comparison

WebView Qt WebUI
Runtime Dependencies on Windows WebView2 QtCore, QtGui, QtWidgets A Web Browser
Runtime Dependencies on Linux GTK3, WebKitGTK QtCore, QtGui, QtWidgets A Web Browser
Runtime Dependencies on macOS Cocoa, WebKit QtCore, QtGui, QtWidgets A Web Browser

Wrappers

Language Status Link
Go ✔️ Go-WebUI
Nim ✔️ Nim-WebUI
Pascal ✔️ Pascal-WebUI
Python ✔️ Python-WebUI
Rust not complete Rust-WebUI
TypeScript / JavaScript ✔️ Deno-WebUI
V ✔️ V-WebUI
Zig not complete Zig-WebUI

Supported Web Browsers

Browser Windows macOS Linux
Mozilla Firefox ✔️ ✔️ ✔️
Google Chrome ✔️ ✔️ ✔️
Microsoft Edge ✔️ ✔️ ✔️
Chromium ✔️ ✔️ ✔️
Yandex ✔️ ✔️ ✔️
Brave ✔️ ✔️ ✔️
Vivaldi ✔️ ✔️ ✔️
Epic ✔️ ✔️ not available
Apple Safari not available coming soon not available
Opera coming soon coming soon coming soon

License

Licensed under the MIT License.

Stargazers

Stargazers repo roster for @webui-dev/go-webui