An open API service indexing awesome lists of open source software.

https://github.com/tkdeng/htmlc

Compiles HTML to Elixir. Who says HTML is not a programming language?
https://github.com/tkdeng/htmlc

compiler elixir exs go golang html html5 htmlc iex template-engine

Last synced: 6 months ago
JSON representation

Compiles HTML to Elixir. Who says HTML is not a programming language?

Awesome Lists containing this project

README

          

# HTMLC (HTML Compiler)

[icon](./assets/icon.png)

Compiles HTML to Elixir.
Who says HTML is not a programming language?

This module is just another templating engine.
With elixir, we can leverage its ability to call individual functions in `iex` mode.
Elixir can quickly build templates on the fly.

> Notice: This Project Is Still In Beta.

## Installation

```shell
# install the go module
go get github.com/tkdeng/htmlc

# or install the binary
git clone https://github.com/tkdeng/htmlc.git &&\
cd htmlc &&\
make install &&\
cd ../ && rm -r htmlc

# install into /usr/bin
make install

# install locally (with dependencies)
make local

# build without dependency installation
make build

# install dependencies
make deps

# uninstall htmlc
make clean
```

## Golang Usage

```go
import (
"github.com/tkdeng/htmlc"
)

func main(){
htmlc.Compile("./src", "./output.exs")

engine, err := htmlc.Engine("./output.exs")

// on page request
buf, err := engine.Render("index", htmlc.Map{"args": "my args"}, "layout")
}
```

## Gofiber Usage

```go
import (
"github.com/gofiber/fiber/v3"
htmlcfiber "github.com/tkdeng/htmlc/gofiber"
)

func main(){
engine, err := htmlcfiber.New("./src")
if err != nil {
panic(err)
}

app := fiber.New(fiber.Config{
Views: engine,
})

app.Get("/", func(c fiber.Ctx) error {
return c.Render("index", fiber.Map{"title": "Test"}, "layout")
})

app.Listen(":3000")
}
```

## Binary Usage

```shell
htmlc ./src --out="./output.exs"
```

You can also specify a port number, to automatically start a static-like http server.

```shell
htmlc ./src --port="3000"
```

Note: by default, "--out" is set to the same directory, with the file name set to the base folder name.

## Elixir Template Usage

```shell
# compile
htmlc ./src

# start template engine
elixir ./html.exs

# render page
> render, mypage/home, mylayout/layout, eyJqc29uIjogImFyZ3MifQ==
# base64({"json": "args"})

# render widget (optional)
> widget, mywidget/app, eyJqc29uIjogImFyZ3MifQ==
# base64({"json": "args"})

# render layout (optional)
> layout, mylayout/layout, eyJqc29uIjogImFyZ3MifQ==, eyJqc29uIjogImh0bWwgY29udGVudCJ9
# base64({"json": "args"}), base64({"json": "html content"})

# stop template engine
stop
```

### IEX Template Usage

```elixir
# compile
htmlc --iex ./src

# start template engine
iex ./html.exs

# render page
iex> App.render "mypage/home", "mylayout/layout", %{args: "myarg"}

# render widget (optional)
iex> App.widget "mywidget/app", %{args: "myarg"}

# render layout (optional)
iex> App.layout "mylayout/layout", %{args: "myarg"}, %{body: "page embed"}

# stop template engine
iex> System.halt
```

## HTML Templates

### Layout

```html




{title}
{@head}

{@body}

```

### Page

```html
<_@head>

<_@body>

Hello, World


<_#app n="2">
widget body


{&main}

```

### Widget

```html



{n} * 2 = <%
args.n * 2
%>

Markdown

Markdown

```