a0c8483c0e
- New ARCHITECTURE_HTMX.md — comprehensive HTMX architecture doc - ARCHITECTURE.md — updated to point to HTMX version - UI_COMPONENTS.md — replaced React tree with HTMX partials - SPRINT_PLAN.md — all sprint tasks updated for HTMX - BUILD_SYSTEM.md — simplified (no Vite, no npm) - TIMELINE.md — 3.5 week HTMX timeline - PROGRESS.md — updated status + HTMX - AGENTS.md — updated checkpoint with HTMX decision
4.4 KiB
4.4 KiB
Hostkeeper V2 — Build System
Status: Updated untuk HTMX Last Updated: 2026-07-07 Frontend: Go HTML template + HTMX + TailwindCSS v4 (tanpa Vite/npm/React)
1. Build Overview
Hostkeeper V2 adalah single Go binary yang melayani HTML + static files.
| Platform | Output | Wrapper | Backend |
|---|---|---|---|
| macOS (ARM64) | .dmg |
Electron (opsional) | Go binary |
| macOS (x64) | .dmg |
Electron (opsional) | Go binary |
| Windows (x64) | .exe installer |
Electron (opsional) | Go binary |
| Linux (x64) | .AppImage |
Electron (opsional) | Go binary |
| Android (ARM64) | .aab |
WebView | Go library (.aar) |
| iOS (ARM64) | .ipa |
WKWebView | Go framework (.xcframework) |
Catatan: Tanpa Electron app tetap bisa jalan — tinggal buka http://localhost:1947 di browser.
2. Build Pipeline
┌──────────────┐ ┌──────────────┐ ┌──────────────┐
│ TailwindCSS │ │ Go Build │ │ Platform │
│ Build │ → │ (single │ → │ Package │
│ (CSS) │ │ binary) │ │ (opsional) │
└──────────────┘ └──────────────┘ └──────────────┘
Step 1: CSS Build
# TailwindCSS v4 — input.css → output.css
npx @tailwindcss/cli -i static/css/input.css -o static/css/output.css
# Atau via Makefile
make css
Step 2: Go Build
# Development (hot reload via air)
go run .
# Production (single binary with embedded static)
CGO_ENABLED=0 go build -ldflags="-s -w" -o dist/hostkeeper .
# Cross-compile
CGO_ENABLED=0 GOOS=darwin GOARCH=arm64 go build -o dist/hostkeeper-darwin-arm64 .
CGO_ENABLED=0 GOOS=linux GOARCH=amd64 go build -o dist/hostkeeper-linux-amd64 .
CGO_ENABLED=0 GOOS=windows GOARCH=amd64 go build -o dist/hostkeeper-windows-amd64.exe .
Step 3: Elektron Package (Opsional)
cd app/electron
npm install
npm run build # produces .dmg / .exe / .AppImage
3. Development Workflow
# Terminal 1: Go backend (dengan hot reload)
cd app/backend
go run .
# Terminal 2: CSS watch
cd app/backend
npx @tailwindcss/cli -i static/css/input.css -o static/css/output.css --watch
# Buka browser
open http://localhost:1947
Hot Reload Tools
# Install air
go install github.com/air-verse/air@latest
# Run
air
4. Struktur Build Output
dist/
├── hostkeeper ← Go binary (single file)
├── static/ ← Embedded static assets
│ ├── css/
│ ├── js/
│ ├── xterm/
│ └── img/
└── views/ ← Embedded HTML templates
├── layout.html
└── partials/
GoFiber embed package untuk embed static + views:
//go:embed static/* views/*
var embedFS embed.FS
func main() {
app := fiber.New()
app.Static("/static", "./static")
engine := html.NewFileSystem(http.FS(embedFS), ".html")
app.Settings.Views = engine
}
5. Dependencies
Go
github.com/gofiber/fiber/v2
github.com/gofiber/contrib/websocket
github.com/gofiber/template/html/v2
github.com/fasthttp/websocket
JavaScript (static files — download, bukan npm)
static/js/htmx.min.js ← https://unpkg.com/htmx.org@2
static/js/alpine.min.js ← https://cdn.jsdelivr.net/npm/alpinejs@3
static/xterm/xterm.js ← https://unpkg.com/@xterm/xterm
static/xterm/xterm.css ← https://unpkg.com/@xterm/xterm/css
CSS Tooling
@tailwindcss/cli ← npx, build time only
6. Makefile
.PHONY: dev build css clean
dev:
@echo "Starting dev server..."
@go run .
css:
npx @tailwindcss/cli -i static/css/input.css -o static/css/output.css
css-watch:
npx @tailwindcss/cli -i static/css/input.css -o static/css/output.css --watch
build:
CGO_ENABLED=0 go build -ldflags="-s -w" -o dist/hostkeeper .
build-all:
GOOS=darwin GOARCH=arm64 go build -o dist/hostkeeper-darwin-arm64 .
GOOS=darwin GOARCH=amd64 go build -o dist/hostkeeper-darwin-amd64 .
GOOS=linux GOARCH=amd64 go build -o dist/hostkeeper-linux-amd64 .
GOOS=windows GOARCH=amd64 go build -o dist/hostkeeper-windows-amd64.exe .
clean:
rm -rf dist/