Giter VIP home page Giter VIP logo

gotron's Introduction

Build Status

Gotron

Go Api for Electron.

Example Projects

A list of boilerplate projects using gotron.

Prerequisites

go1.11 with modules enabled, nodejs and npm must be available on your system.

Quick Start

On the first run it will download Electron and stores it in .gotron in your working directory.

package main

import (
    "github.com/Equanox/gotron"
)

func main() {
    // Create a new browser window instance
    window, err := gotron.New()
    if err != nil {
        panic(err)
    }

    // Alter default window size and window title.
    window.WindowOptions.Width = 1200
    window.WindowOptions.Height = 980
    window.WindowOptions.Title = "Gotron"

    // Start the browser window.
    // This will establish a golang <=> nodejs bridge using websockets,
    // to control ElectronBrowserWindow with our window object.
    done, err := window.Start()
    if err != nil {
        panic(err)
    }
    
    // Open dev tools must be used after window.Start 
    // window.OpenDevTools()
    
    // Wait for the application to close
    <-done
}

When everything worked you should see this

Hello Gotron

Use Your Own WebUI

gotron expects a folder containing your HTML/JS/CSS code and passes it to electronJS. make sure it contains at least a index.html as entrypoint.

Pass a path to your webUI on gotrons New(uiFolder ...string) function.

window, err := gotron.New("path/to/your/webui")
if err != nil {
    panic(err)
}

Communicate between backend and frontend

Frontend to backend communication is realized through javascript like event driven apporach.

Backend

Handle incoming events

window.On(&gotron.Event{Event: "event-name"}, func(bin []byte) {
	//Handle event here
}

Send event to frontend

// Create a custom event struct that has a pointer to gotron.Event
type CustomEvent struct {
    *gotron.Event
    CustomAttribute string 'json:"AtrNameInFrontend"'
}

window.Send(&CustomEvent{
    Event: &gotron.Event{Event: "event-name"},
    CustomAttribute: "Hello World!",
    })

Frontend

In frontend a websocket needs to be created. Adress is always localhost and port can be taken from global variable global.backendPort

let ws = new WebSocket("ws://localhost:" + global.backendPort + "/web/app/events");

Handle incoming events

// This is being called for all incoming messages
ws.onmessage = (message) => {
    let obj = JSON.parse(message.data);
    
    // event name
    console.log(obj.event);

    // event data
    console.log(obj.AtrNameInFrontend);
}

Send event to backend

ws.send(JSON.stringify({
    "event": "event-name",
    "AtrNameInFrontend": "Hello World!",
}))

Distribution/Packaging

To package a go application together with electornjs use gotron-builder.

Install gotron-builder

We provide executables for Linux, MacOS and Windows.
Download the newest release from https://github.com/Equanox/gotron/releases and add it to your $PATH.

Using gotron-builder

It expects...

  • a directory containing a golang main package
  • and a directory with a webUI containing at least a index.html

By default it will implicitly use...

  • golang main package from the current directory
  • webUI from .gotron/assets

To pack the code from Quick Start use

gotron-builder

in the root of your repo.

Pass your go code and webUI explicitly.

gotron-builder --go=your/go/dir --app=your/webapp/dir

For cross compilation you can use the same flags as electron-builder would expect them

gotron-builder --win 

Read about the requirements for cross-compilation in electron-builders documentation.

Tasks

  • Basic js + webpack example
  • React example
  • Typescript-React example
  • Vue.js example
  • Elm example
  • Flutter Hummingbird example
  • Hide nodejs/Electron behind go api
  • Create executables for Win, Linux, MacOS
  • Hide nodejs/Electron behind go api
  • Msgs between golang and Electron renderer process, abstracted in a javascript/typescript package
  • Implement complete BrowserWindow api see => BrowserWindow.md
  • Implement complete electron-builder api in gotron-builder

Sponsors

benchkram-logo

License

MIT

Except Roboto (ui/js/src/Roboto-Light.ttf , ui/react/src/Roboto-Light.ttf) which is licensed under Apache 2.0
https://github.com/google/roboto

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.