Introduction

fnComponent

Package fncmp is a project aimed to bring granular control to server-side rendering with Go with functionality such as maintaining state in functional components, event handling in HTML components.

Granular control

Developers can serve HTML components from a web server using packages such as templ or with fncmp's HTML struct. The FnComponent struct provides enhanced functionality to these components including when and how they are rendered to the DOM.

convert a component to a FnComponent

component := fncmp.HTML("<button>Click me</button>")
fn := fncmp.NewFn(ctx, component)

If we wanted this component in a specific location in the DOM:

fn.AppendElement("menu")

Event listeners

The ability to create and respond to DOM events is a key feature of fncmp.
We can apply a function to be called when the "click" event is triggered on the component.

info

fncmp supplies a set of OnEvent constants to be used with the WithEvents method. Further parsing of events is covered in the reference documentation.

component = component.WithEvents(handleClick, fncmp.OnClick)   

In this example, a component 'Greeting' is returned when the "click" event is triggered.

func handleClick(ctx context.Context) fncmp.FnComponent {
    return fncmp.NewFn(ctx, Greeting)
}

These short examples only hint at what can be done with fncmp. Please following the tutorial and reference documentation to learn more.