Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/maragudk/gomponents
HTML components in pure Go.
https://github.com/maragudk/gomponents
go golang gomponents html
Last synced: about 19 hours ago
JSON representation
HTML components in pure Go.
- Host: GitHub
- URL: https://github.com/maragudk/gomponents
- Owner: maragudk
- License: mit
- Created: 2020-09-12T07:01:22.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2024-11-06T11:30:51.000Z (2 months ago)
- Last Synced: 2025-01-11T11:15:32.503Z (about 24 hours ago)
- Topics: go, golang, gomponents, html
- Language: Go
- Homepage: https://www.gomponents.com
- Size: 455 KB
- Stars: 1,413
- Watchers: 14
- Forks: 38
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- go-awesome - gomponents - declarative view components that can be rendered in HTML5 (Open source library / Word Processing)
- awesome-golang-repositories - gomponents
README
# Tired of complex template languages?
[](https://pkg.go.dev/maragu.dev/gomponents)
[](https://github.com/maragudk/gomponents/actions/workflows/ci.yml)
[](https://codecov.io/gh/maragudk/gomponents)
[](https://goreportcard.com/report/maragu.dev/gomponents)
Try HTML components in pure Go.
_gomponents_ are HTML components written in pure Go.
They render to HTML 5, and make it easy for you to build reusable components.
So you can focus on building your app instead of learning yet another templating language.
```shell
go get maragu.dev/gomponents
```
Made with ✨sparkles✨ by [maragu](https://www.maragu.dev/).
Does your company depend on this project? [Contact me at [email protected]](mailto:[email protected]?Subject=Supporting%20your%20project) to discuss options for a one-time or recurring invoice to ensure its continued thriving.
## Features
Check out [www.gomponents.com](https://www.gomponents.com) for an introduction.
- Build reusable HTML components
- Write declarative HTML 5 in Go without all the strings, so you get
- Type safety from the compiler
- Auto-completion from the IDE
- Easy debugging with the standard Go debugger
- Automatic formatting with `gofmt`/`goimports`
- Simple API that's easy to learn and use (you know most already if you know HTML)
- Useful helpers like
- `Text` and `Textf` that insert HTML-escaped text,
- `Raw` and `Rawf` for inserting raw strings,
- `Map` for mapping data to components and `Group` for grouping components,
- and `If`/`Iff` for conditional rendering.
- No external dependencies
- Mature and stable, no breaking changes
## Usage
```shell
go get maragu.dev/gomponents
```
```go
package main
import (
. "maragu.dev/gomponents"
. "maragu.dev/gomponents/components"
. "maragu.dev/gomponents/html"
)
func Navbar(authenticated bool, currentPath string) Node {
return Nav(
NavbarLink("/", "Home", currentPath),
NavbarLink("/about", "About", currentPath),
If(authenticated, NavbarLink("/profile", "Profile", currentPath)),
)
}
func NavbarLink(href, name, currentPath string) Node {
return A(Href(href), Classes{"is-active": currentPath == href}, g.Text(name))
}
```
(Some people don't like dot-imports, and luckily it's completely optional.)
For a more complete example, see [the examples directory](internal/examples/).
There's also the [gomponents-starter-kit](https://github.com/maragudk/gomponents-starter-kit) for a full application template.
### What's up with the specially named elements and attributes?
Unfortunately, there are some name clashes in HTML elements and attributes, so they need an `El` or `Attr` suffix,
to be able to co-exist in the same package in Go.
I've chosen one or the other based on what I think is the common usage.
In either case, the less-used variant also exists in the codebase:
- `cite` (`Cite`/`CiteAttr`, `CiteEl` also exists)
- `data` (`DataEl`/`Data`, `DataAttr` also exists)
- `form` (`Form`/`FormAttr`, `FormEl` also exists)
- `label` (`Label`/`LabelAttr`, `LabelEl` also exists)
- `style` (`StyleEl`/`Style`, `StyleAttr` also exists)
- `title` (`TitleEl`/`Title`, `TitleAttr` also exists)