Overview

The web template creates a full-stack web application with server-rendered HTML. Unlike single-page apps (SPAs) where JavaScript renders the page in the browser, server-rendered apps generate complete HTML on the server. This is great for SEO, fast initial loads, and simpler architecture. You write templates that combine HTML with your data, and the server sends the finished page to the browser.

When to Use This Template

Use the web template when:

Building a website - Server-rendered HTML pages
Need layouts - Shared headers, footers, navigation
Static assets - CSS, JavaScript, images
SEO matters - Search engine friendly HTML

What You Get

View engine - Template rendering with layouts
Static file serving - Embedded or file-based assets
Page handlers - Clean separation of routes and views
Component system - Reusable UI pieces

Quick Start

mizu new mysite --template web
cd mysite
go mod tidy
mizu dev

Open http://localhost:8080 in your browser.

Project Structure

mysite/
├── cmd/
│   └── web/
│       └── main.go         # Entry point
├── app/
│   └── web/
│       ├── app.go          # Application setup
│       ├── config.go       # Configuration
│       └── routes.go       # Route registration
├── handler/
│   ├── home.go             # Home page handler
│   └── about.go            # About page handler
├── assets/
│   ├── embed.go            # Asset embedding
│   ├── css/
│   │   └── style.css       # Stylesheets
│   └── js/
│       └── app.js          # JavaScript
├── views/
│   ├── layouts/
│   │   └── main.html       # Main layout
│   ├── pages/
│   │   ├── home.html       # Home page
│   │   └── about.html      # About page
│   └── partials/
│       └── nav.html        # Navigation partial
├── go.mod
└── .gitignore

Key Features

View Engine

Renders HTML templates with data:

func Home() mizu.Handler {
    return func(c *mizu.Ctx) error {
        return c.Render("pages/home", map[string]any{
            "Title": "Welcome",
            "Items": []string{"One", "Two", "Three"},
        })
    }
}

Layouts

Wrap pages in a consistent layout:

<!-- views/layouts/main.html -->
<!DOCTYPE html>
<html>
<head>
    <title>{{.Title}}</title>
    <link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
    {{template "partials/nav" .}}
    <main>
        {{template "content" .}}
    </main>
</body>
</html>

Static Assets

Serve CSS, JS, and images:

app.Mount("/static/", staticHandler())

Assets are embedded in the binary for easy deployment.

Handlers

// handler/home.go
package handler

import "github.com/go-mizu/mizu"

func Home() mizu.Handler {
    return func(c *mizu.Ctx) error {
        return c.Render("pages/home", map[string]any{
            "Title":   "Home",
            "Message": "Welcome to my site!",
        })
    }
}

Views

<!-- views/pages/home.html -->
{{define "content"}}
<h1>{{.Message}}</h1>
<p>This is the home page.</p>
{{end}}

Getting Started

Commands

Templates Overview

Minimal Template

API Template

Contract Template

Web Template

Live Template

Sync Template

Reference

When to Use This Template

What You Get

Quick Start

Project Structure

Key Features

View Engine

Layouts

Static Assets

Handlers

Views

Next Steps

Project Structure

Tutorial

​When to Use This Template

​What You Get

​Quick Start

​Project Structure

​Key Features

​View Engine

​Layouts

​Static Assets

​Handlers

​Views

​Next Steps

Project Structure

Tutorial

When to Use This Template

What You Get

Quick Start

Project Structure

Key Features

View Engine

Layouts

Static Assets

Handlers

Views

Next Steps