/pongo2components

Enables web components for the pongo2 templating engine.

Primary LanguageGoMIT LicenseMIT

pongo2-components

Adds web components to the existing pongo2 template engine.
Now you can make components similar to how you would in popular JS frameworks.

How to install and initialize

Install via go get -u github.com/leandergangso/pongo2-components

Import and initialize the package as seen bellow.

package main

import (
    "github.com/flosch/pongo2"
    "github.com/leandergangso/pongo2-components"
)

func init() {
    err := pongo2components.Init() 
    if err != nil {
        panic(err)
    }
}

func main() {
    // ...
}

Note: you should init pongo2components before any calls to pongo2.

How to use (basic example)

A basic button component.

  1. Registering and setup button component.
// components/button.go
package components

import (
    "github.com/leandergangso/pongo2-components"
)

func init() {
    button := pongo2components.Component{
        Name:     "button",
        FilePath: "components/button.html",
        Props:    []pongo2components.Prop{"value", "type"}
    }
    pongo2components.Register(button)
}
  1. Create html component with available props.
<!-- components/button.html -->
<button class="{{type}}">{{value}}</button>
  1. Use button component.
<!-- views/login.html -->
{% component 'button' value="Login" type="primary" %}

See /example directory for more examples.