htmx + Go 백엔드 조합

Question

htmx + Go로 웹앱을 만드는 사례가 늘고 있는데 어떤 구조인가요?

김영삼 · Accepted Answer

htmx + Go 조합은 "JavaScript 최소화" 철학의 대표 스택입니다.

// Go (net/http + html/template)
package main

import (
    "html/template"
    "net/http"
)

func main() {
    tmpl := template.Must(template.ParseGlob("templates/*.html"))
    
    http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
        tmpl.ExecuteTemplate(w, "index.html", nil)
    })
    
    // htmx가 호출하는 엔드포인트 — HTML 조각 반환
    http.HandleFunc("/api/items", func(w http.ResponseWriter, r *http.Request) {
        items := getItems()
        tmpl.ExecuteTemplate(w, "items-partial.html", items)
    })
    
    http.ListenAndServe(":8080", nil)
}

<!-- htmx로 동적 로딩 -->
<div hx-get="/api/items" hx-trigger="load">로딩 중...</div>

장점: 빠른 바이너리, JS 빌드 불필요, 배포 간단 (단일 바이너리)

React/Vue 없이도 충분히 동적인 웹앱을 만들 수 있습니다.

댓글 1