The web framework for Go

Build modern web apps
with the power of GOX

Build pages and actions in Go. Return data, HTML or components. Your favorite framework, when you need it.

FROM TERMINAL TO BROWSER

Your first page starts here.

Install GOX, create a project, and bring it to life.

01Install GOX

Go 1.26+ · Linux, macOS or WSL

$go install github.com/gox-lang/server/cmd/gox@latest

If gox is not on your PATH

Go installs gox in GOBIN, or in $(go env GOPATH)/bin when GOBIN is unset. The commands below install it in ~/.local/bin and persist PATH for Bash/Zsh.

$gox_bin="$(go env GOBIN)"
$gox_bin="${gox_bin:-$(go env GOPATH)/bin}"
$mkdir -p "$HOME/.local/bin"
$if [ "$gox_bin" != "$HOME/.local/bin" ]; then
$    install -m 755 "$gox_bin/gox" "$HOME/.local/bin/gox"
$fi
$gox_path_line='export PATH="$HOME/.local/bin:$PATH"'
$for gox_profile in "$HOME/.profile" "$HOME/.bashrc" \
$    "${ZDOTDIR:-$HOME}/.zshrc" "${ZDOTDIR:-$HOME}/.zprofile"; do
$    touch "$gox_profile"
$    grep -Fqx "$gox_path_line" "$gox_profile" ||
$        printf '\n%s\n' "$gox_path_line" >> "$gox_profile"
$done
$for gox_profile in "$HOME/.bash_profile" "$HOME/.bash_login"; do
$    if [ -f "$gox_profile" ]; then
$        grep -Fqx "$gox_path_line" "$gox_profile" ||
$            printf '\n%s\n' "$gox_path_line" >> "$gox_profile"
$    fi
$done
$export PATH="$HOME/.local/bin:$PATH"

Open a new terminal and run gox version to verify the persistent installation.

02Check your version

$gox version

↳GOX Server v0.1.3Example output

03Create. Run. Build.

$gox createproject my-project
$cd my-project
$gox run

Your new project

Hello Gox

A page rendered by Go. Ready for your next idea.

Explore all the installation options and choose the one that fits your workflow.

All installation options →

GOX CAPABILITIES

A simple start. Room to build more.

From your first page to an interactive application.

Pages & Actions

Build pages and server logic in Go, together.

Explore the docs

JavaScript ready

Call Go actions directly from the browser.

Explore the docs

SSRT & Hydration

Send HTML first. Add interaction where it matters.

Explore the docs

Go at the core

Build on Go’s types, concurrency and ecosystem.

Explore the docs

WebSockets

Exchange events and data between Go and connected browsers in real time.

Explore the docs

Channels

Organize real-time conversations into channels with their own participants.

Explore the docs

Typed forms

Send a form to an Action. Match input names to parameters and convert their values.

Explore the docs

Files, round trip

Send and receive files through Actions or WebSockets.

Explore the docs

From an idea to your next project.

Explore the guides, concepts and examples in the GOX documentation.

Read the documentation

CLIENT FRAMEWORKS

Your favorite framework. Still your choice.

Go on the server. The tools you love in the browser.

1. Add the framework

my-project/Project root

gox client add react

2. Declare your component


client Profile react {
    src: "components/Profile.jsx"
}

3. Use it in a template


<@Profile name="George" hydrate="load" />

Explore the React integration docs

components/Profile.jsx


import { useState } from "react"

export default function Profile({ name }) {
    const [following, setFollowing] = useState(false)
    const label = following ? "Following" : "Follow"

    return <article className="profile">
        <div className="avatar">G</div>
        <div>
            <h3>{name}</h3>
            <p>Full stack with GOX.</p>
            <button className="profile-follow" type="button"
                aria-pressed={following}
                onClick={() => setFollowing(!following)}>
                {label}
            </button>
        </div>
    </article>
}

Live component

George

Full stack with GOX.

1. Add the framework

my-project/Project root

gox client add preact

2. Declare your component


client Profile preact {
    src: "components/Profile.jsx"
}

3. Use it in a template


<@Profile name="George" hydrate="load" />

Explore the Preact integration docs

components/Profile.jsx


import { useState } from "preact/hooks"

export default function Profile({ name }) {
    const [following, setFollowing] = useState(false)
    const label = following ? "Following" : "Follow"

    return <article className="profile">
        <div className="avatar">G</div>
        <div>
            <h3>{name}</h3>
            <p>Full stack with GOX.</p>
            <button className="profile-follow" type="button"
                aria-pressed={following}
                onClick={() => setFollowing(!following)}>
                {label}
            </button>
        </div>
    </article>
}

Live component

George

Full stack with GOX.

1. Add the framework

my-project/Project root

gox client add solid

2. Declare your component


client Profile solid {
    src: "components/Profile.jsx"
}

3. Use it in a template


<@Profile name="George" hydrate="load" />

Explore the Solid integration docs

components/Profile.jsx


import { createSignal } from "solid-js"

export default function Profile(props) {
    const [following, setFollowing] = createSignal(false)
    const label = () => following() ? "Following" : "Follow"

    return <article class="profile">
        <div class="avatar">G</div>
        <div>
            <h3>{props.name}</h3>
            <p>Full stack with GOX.</p>
            <button class="profile-follow" type="button"
                aria-pressed={following()}
                onClick={() => setFollowing(!following())}>
                {label()}
            </button>
        </div>
    </article>
}

Live component

George

Full stack with GOX.

1. Add the framework

my-project/Project root

gox client add vue

2. Declare your component


client Profile vue {
    src: "components/Profile.vue"
}

3. Use it in a template


<@Profile name="George" hydrate="load" />

Explore the Vue integration docs

components/Profile.vue


<script setup>
import { computed, ref } from "vue"

defineProps({ name: String })
const following = ref(false)
const label = computed(() => following.value ? "Following" : "Follow")
</script>

<template>
    <article class="profile">
        <div class="avatar">G</div>
        <div>
            <h3>{{ name }}</h3>
            <p>Full stack with GOX.</p>
            <button class="profile-follow" type="button"
                :aria-pressed="following"
                @click="following = !following">
                {{ label }}
            </button>
        </div>
    </article>
</template>

Live component

George

Full stack with GOX.

1. Add the framework

my-project/Project root

gox client add svelte

2. Declare your component


client Profile svelte {
    src: "components/Profile.svelte"
}

3. Use it in a template


<@Profile name="George" hydrate="load" />

Explore the Svelte integration docs

components/Profile.svelte


<script>
    let { name } = $props()
    let following = $state(false)
    let label = $derived(following ? "Following" : "Follow")
</script>

<article class="profile">
    <div class="avatar">G</div>
    <div>
        <h3>{name}</h3>
        <p>Full stack with GOX.</p>
        <button class="profile-follow" type="button"
            aria-pressed={following}
            onclick={() => following = !following}>
            {label}
        </button>
    </div>
</article>

Live component

George

Full stack with GOX.

GOX TOOLS · VS CODE

It all starts in your editor.

Install GOX and start building without leaving VS Code. Autocompletion, diagnostics and formatting, right where you write.

Install GOX Tools ↗Explore the documentation →

Build modern web appswith the power of GOX

Your first page starts here.

01Install GOX

02Check your version

03Create. Run. Build.

Hello Gox

A simple start. Room to build more.

Pages & Actions

JavaScript ready

SSRT & Hydration

Go at the core

WebSockets

Channels

Typed forms

Files, round trip

From an idea to your next project.

Your favorite framework. Still your choice.

1. Add the framework

2. Declare your component

3. Use it in a template

George

1. Add the framework

2. Declare your component

3. Use it in a template

George

1. Add the framework

2. Declare your component

3. Use it in a template

George

1. Add the framework

2. Declare your component

3. Use it in a template

George

1. Add the framework

2. Declare your component

3. Use it in a template

George

It all starts in your editor.

Build modern web apps
with the power of GOX