# bingoui

**Repository Path**: sh2024/bingoui

## Basic Information

- **Project Name**: bingoui
- **Description**: 基于wasm的ui库
基于bootstrap，使用go语言完成前端界面编写。
more go style ，more bingo
- **Primary Language**: Go
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2025-05-29
- **Last Updated**: 2025-05-29

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# bingoui
基于go、js、wasm的web前端框架，目前只实现了部分组件，后续会逐步完善。
通过bingoui，使用go语言也能开发前端代码，再不用混合go和js开发，而且对于wasm知识要求降低，提高开发效率。


例如：
```go
bg := widgets.ButtonGroup{
		Buttons: []*widgets.Button{
			{Text: "hello", Style: widgets.BtnStyleSuccess, Outline: true, Disabled: false, Size: widgets.BtnSizeSm,Handler: Hello},
			{Text: "world", Style: widgets.BtnStyleDanger, Outline: false, Disabled: false, Size: widgets.BtnSizeSm,
				Handler: Hello},
		},
		Vertical: true,
		Size:     widgets.BtnSizeSm,
	}
```

## 版本
* 0.0.1 基本样例可跑 2024-01-16
* 0.0.2 


# 基本组件
框架基于bootstrap5样式，提供了常用的界面组件。
## Button


## Input

## Select


## Checkbox Radiobox

## 复合组件


# 布局组件
## Row

## Form

# 模版组件
## 弹出对话框


## 悬浮对话框


# 前端工程及样例使用
## 编译
样例使用如下指令编译

 GOOS=js GOARCH=wasm go build -o main.wasm

## 运行
通过安装 live server 直接运行index.html

## 注意
* 1.需要将 main.wasm 和wasm_exec.js index.html 目录关系在文件中约定清楚
* 2.依赖bootstrap5 ，文件在css和js目录下
* 3.main.go 为测试页面

## 建议
* 生产环境建议使用tinygo进行编译，压缩生成的wasm文件大小
* 前端js及静态文件的使用建议使用cdn，减少前端文件大小
* 对于复杂的项目可以考虑多工程，将不同功能的模块功能分离到不同的工程中，减少复杂性，提高开发效率。