DEV Community

David Marko
David Marko

Posted on

Mastering LiveView development in GoLang

LiveView is a programming approach that allows developers to build interactive, real-time user interfaces for web applications. It was introduced as a part of the Phoenix web development framework for the Elixir programming language. There are LiveView implementations available for many popular languages and web frameworks, Go included.

LiveView uses websockets to create a persistent connection between the client and the server, which enables the server to push updates to the client in real-time. This allows developers to build interactive user interfaces that can update dynamically in response to user actions or changes in the application state, without the need for traditional page reloads or AJAX requests.

In GoLang world, LiveView applications are built using a combination of Go code on the server and HTML and CSS on the client. The server-side Go code is responsible for rendering the HTML template, handling user input, and updating the client with new data as needed. The client-side code handles tasks such as rendering the user interface and handling user interactions. (this part is fully managed by LiveView implementation)

Overall, the LiveView programming approach is designed to make it easier for developers to build real-time, interactive web applications, while still allowing them to leverage the benefits of a server-side architecture.

Let’s take a look on how simple ‘Live Counter’ Go example can look like. For LiveView Go implementation we are using Live project hosted on Github. Screenshot below contains full Live(View) application integrated with Fiber Framework.

Live Application

Key implementation parts include:

  1. Dependency definition
  2. Model definition
  3. Application 'Mount' entry point implementation
  4. Counter click event implementation
  5. Fiber application setup + Live part included
  6. We can still use an endpoints implemented in Fiber way.

And our template snippet looks like this:
Template

  1. Button with Live click listener emitting 'value-change' events
  2. Keyboard connected event trigger
  3. And we display Counter value using standard Go HTML template syntax

Go Live project provides real-time user experiences with server-rendered HTML completely in Go. Inspired by and borrowing from Phoenix LiveViews, Live is intended as a replacement for React, Vue, Angular etc. You can write an interactive web apps just using Go and its templates. The structures provided in this package are compatible with net/http, so will play nicely with middleware and other frameworks. But integrations with other frameworks like Fiber exist as well.

If you are interested in details and can get a full idea how you can use Live View programming approach in Go, you are welcome to take a part in this new Udemy Course "Mastering Live(View) development in Go" .

Course image

Top comments (1)

Collapse
 
t0nghe profile image
Tonghe Wang

Thanks for sharing! This is great.