Elanat Framework

Posted on Sep 9

Try WebForms Core 2.1 in Go

#go #backend #architecture #webformscore

WebForms Core 2.1 brings a server-centric approach to Web development where the backend generates UI commands and WebFormsJS executes them in the browser.

WebForms Core technology was developed by Elanat and led by Mohammad Rabie.

Instead of building a large JavaScript application, you can keep your UI logic on the server and use regular HTML as the UI layer.

WebForms Core + Go

WebForms Core can now be experienced with Go.

The architecture is simple:

Go
 │
 ▼
webforms.go
 │
 ▼
HTML + Commands
 │
 ▼
WebFormsJS
 │
 ▼
DOM

The Go backend acts as the Commander, while WebFormsJS acts as the Executor.

Install Package (webforms.go Module)

CLI

go get github.com/webforms-core/go

github.com/webforms-core/go is the Go module that provides the WebForms Core backend API.

WebFormsJS Installation via Package

JavaScript in npm: webformsjs on npm

CLI:

npm install webformsjs

WebFormsJS is also available directly from the following GitHub repository:

WebFormsJS GitHub Repository

If you install WebFormsJS through npm, the package can be imported and used directly in your JavaScript project. Alternatively, you can obtain the source files from the GitHub repository.

Example

A minimal Go application can look like this:

package main

import (
    "fmt"
    "net/http"

    "your-project-name/webformscore"
)

func main() {
    http.Handle("/script/",
        http.StripPrefix("/script/",
            http.FileServer(http.Dir("script"))))

    http.HandleFunc("/", handleForm)

    fmt.Println("Server started at http://localhost:8080")
    http.ListenAndServe(":8080", nil)
}

func handleForm(w http.ResponseWriter, r *http.Request) {

    form := WebFormsCore.New()

    json := `{"user":{"name":"Adriano","age":30,"email":"adriano@example.com","phone":"+1234567890"}}`

    form.BindJSONToTemplate(
        "card",
        json,
        "user",
        "{{value}}",
        false,
    )

    html := `<!DOCTYPE html>
<html>
<head>
  <title>Using WebForms Core in Go</title>
  <script type="module" src="/script/web-forms.js"></script>
</head>
<body>

<h1>WebForms Core in Go</h1>

<div id="card">
    <h2>👤 User Info</h2>

    <div>Name: {{name}}</div>
    <div>Age: {{age}}</div>
    <div>Email: {{email}}</div>
    <div>Phone: {{phone}}</div>
</div>

</body>
</html>` + form.ExportToHtmlComment(true)

    w.Header().Set("Content-Type", "text/html; charset=utf-8")
    fmt.Fprint(w, html)
}

Binding JSON to HTML

The interesting part is:

form.BindJSONToTemplate(
    "card",
    json,
    "user",
    "{{value}}",
    false,
)

The card value identifies the HTML element where the template binding is applied.

The user path tells WebForms Core to navigate into the user object:

{
    "name": "Adriano",
    "age": 30,
    "email": "adriano@example.com",
    "phone": "+1234567890"
}

WebForms Core then maps its properties to the template:

{{name}}
{{age}}
{{email}}
{{phone}}

So the HTML can remain completely ordinary HTML—no React, Vue, or other frontend framework is required.

Important: Pay Attention to the Module Path

The your-project-name/webformscore import path in the example is only a placeholder.

WebForms Core for Go is available from the following repositories:

If you install WebForms Core using the CLI command:

go get github.com/webforms-core/go

remove:

"your-project-name/webformscore"

and replace it with:

"github.com/webforms-core/go"

Then the application can use the WebForms Core package directly.

Server Commander, Client Executor

The important concept is that Go does not directly manipulate the browser DOM.

The flow is:

Go
 ↓
WebForms Core
 ↓
Generated Commands
 ↓
WebFormsJS
 ↓
DOM

The backend decides what should happen, and WebFormsJS executes it.

This separation also means WebFormsJS is not tied to Go. The same client-side technology can work with different backend languages.

Why Try It with Go?

Go provides a simple and efficient environment for HTTP servers and backend applications. Combined with WebForms Core, it offers another way to build Web applications without turning the frontend into a large JavaScript application.

If you already use Go, WebForms Core 2.1 gives you a new way to build dynamic Web interfaces: Go on the server, HTML as the UI layer, and WebFormsJS as the bridge between them.

DEV Community