• This repository has been archived on 29/Aug/2022
  • Stars
    star
    258
  • Rank 158,189 (Top 4 %)
  • Language
    Go
  • License
    MIT License
  • Created about 4 years ago
  • Updated over 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

⚡ Live views for GoLang with reactive HTML over WebSockets 🔌

GoLive

💻 Reactive HTML Server Side Rendered by GoLang over WebSockets 🚀

Use Go and Zero JavaScript to program reactive front-ends!

How?

  1. Render Server Side HTML
  2. Connect to same server using Websocket
  3. Send user events
  4. Change state of component in server
  5. Render Component and get diff
  6. Update instructions are sent to the browser

Getting Started

Any suggestions are absolutely welcome

This project it's strongly inspired by Elixir Phoenix LiveView.

Component Example

package components 

import (
	"github.com/brendonmatos/golive"
	"time"
)

type Clock struct {
	golive.LiveComponentWrapper
	ActualTime string
}

func NewClock() *golive.LiveComponent {
	return golive.NewLiveComponent("Clock", &Clock{})
}

func (t *Clock) Mounted(_ *golive.LiveComponent) {
	go func() {
		for {
			t.ActualTime = time.Now().Format(time.RFC3339Nano)
			time.Sleep((time.Second * 1) / 60)
			t.Commit()
		}
	}()
}

func (t *Clock) TemplateHandler(_ *golive.LiveComponent) string {
	return `
		<div>
			<span>Time: {{ .ActualTime }}</span>
		</div>
	`
}

Server Example

  
package main

import (
	"github.com/brendonmatos/golive"
	"github.com/brendonmatos/golive/examples/components"
	"github.com/gofiber/fiber/v2"
	"github.com/gofiber/websocket/v2"
)

func main() {
	app := fiber.New()
	liveServer := golive.NewServer()

	app.Get("/", liveServer.CreateHTMLHandler(components.NewClock, golive.PageContent{
		Lang:  "us",
		Title: "Hello world",
	}))

	app.Get("/ws", websocket.New(liveServer.HandleWSRequest))

	_ = app.Listen(":3000")
}

That's it!

More Examples

Slider

Simple todo

All at once using components!

GoBook

Go to repo