petaki/inertia-goPublic

NotificationsYou must be signed in to change notification settings
Fork14
Star282

⏩ Inertia.js server-side adapter for Go.

License

MIT license

282 stars 14 forks Branches Tags Activity

Star

Notifications

You must be signed in to change notification settings

Branches Tags

Folders and files

Name		Name	Last commit message	Last commit date
Latest commit History 125 Commits
.github/workflows		.github/workflows
LICENSE.md		LICENSE.md
README.md		README.md
context.go		context.go
errors.go		errors.go
go.mod		go.mod
header.go		header.go
inertia.go		inertia.go
inertia_test.go		inertia_test.go
middleware.go		middleware.go
middleware_test.go		middleware_test.go
page.go		page.go
ssr.go		ssr.go
template.go		template.go
template_test.go		template_test.go

Repository files navigation

Inertia.js Go Adapter

The Inertia.js server-side adapter for Go. Visitinertiajs.com to learn more.

Installation

Install the package using thego get command:

go get github.com/petaki/inertia-go

Usage

1. Create new instance

url:="http://inertia-app.test"// Application URL for redirectrootTemplate:="./app.gohtml"// Root template, see the example belowversion:=""// Asset versioninertiaManager:=inertia.New(url,rootTemplate,version)

Or create withembed.FS for root template:

import"embed"//go:embed templatevartemplateFS embed.FS// ...inertiaManager:=inertia.NewWithFS(url,rootTemplate,version,templateFS)

2. Register the middleware

mux:=http.NewServeMux()mux.Handle("/",inertiaManager.Middleware(homeHandler))

3. Render in handlers

funchomeHandler(w http.ResponseWriter,r*http.Request) {// ...err:=inertiaManager.Render(w,r,"home/Index",nil)iferr!=nil {// Handle server error...    }}

Or render with props:

// ...err:=inertiaManager.Render(w,r,"home/Index",map[string]interface{}{"total":32,})//...

4. Server-side Rendering (Optional)

First, enable SSR with the url of the Node server:

inertiaManager.EnableSsrWithDefault()// http://127.0.0.1:13714

Or with custom url:

inertiaManager.EnableSsr("http://ssr-host:13714")

This is a simplified example using Vue 3 and Laravel Mix.

// resources/js/ssr.jsimport{createInertiaApp}from'@inertiajs/vue3';importcreateServerfrom'@inertiajs/vue3/server';import{renderToString}from'@vue/server-renderer';import{createSSRApp,h}from'vue';createServer(page=>createInertiaApp({    page,render:renderToString,resolve:name=>require(`./pages/${name}`),setup({ App, props, plugin}){returncreateSSRApp({render:()=>h(App,props)}).use(plugin);}}));

The following config creates thessr.js file in the root directory, which should not be embedded in the binary.

// webpack.ssr.mix.jsconstmix=require('laravel-mix');constwebpackNodeExternals=require('webpack-node-externals');mix.options({manifest:false}).js('resources/js/ssr.js','/').vue({version:3,options:{optimizeSSR:true}}).webpackConfig({target:'node',externals:[webpackNodeExternals({allowlist:[/^@inertiajs/]})]});

You can find the example for the SSR based root template below. For more information, please read the official Server-side Rendering documentation oninertiajs.com.

Examples

The following examples show how to use the package.

Share a prop (globally)

inertiaManager.Share("title","Inertia App Title")

Share a prop (context based)

funcauthenticate(next http.Handler) http.Handler {returnhttp.HandlerFunc(func(w http.ResponseWriter,r*http.Request) {// ...ctx:=inertiaManager.WithProp(r.Context(),"authUserID",user.ID)next.ServeHTTP(w,r.WithContext(ctx))    })}

Share a function with root template (globally)

inertiaManager.ShareFunc("asset",assetFunc)

<scriptsrc="{{ asset"js/app.js" }}"></script>

Share data with root template (globally)

inertiaManager.ShareViewData("env","production")

{{ if eq .env "production" }}    ...{{ end }}

Share data with root template (context based)

ctx:=inertiaManager.WithViewData(r.Context(),"meta",meta)r=r.WithContext(ctx)

<metaname="description"content="{{ .meta }}">

Root template

<!DOCTYPE html><html><head><metacharset="utf-8"><metaname="viewport"content="width=device-width, initial-scale=1"><linkhref="css/app.css"rel="stylesheet"><linkrel="icon"type="image/x-icon"href="favicon.ico"></head><body><divid="app"data-page="{{ marshal .page }}"></div><scriptsrc="js/app.js"></script></body></html>

Root template with Server-side Rendering (SSR)

<!DOCTYPE html><html><head><metacharset="utf-8"><metaname="viewport"content="width=device-width, initial-scale=1"><linkhref="css/app.css"rel="stylesheet"><linkrel="icon"type="image/x-icon"href="favicon.ico">        {{ if .ssr }}            {{ raw .ssr.Head }}        {{ end }}</head><body>        {{ if not .ssr }}<divid="app"data-page="{{ marshal .page }}"></div>        {{ else }}            {{ raw .ssr.Body }}        {{ end }}</body></html>