Templates

# List all frontend templates
mizu new --list-templates frontend

mizu new ./my-app --template frontend/react

my-app/
├── cmd/server/
│   └── main.go              # Entry point
├── app/server/
│   ├── app.go               # App setup with frontend middleware
│   ├── config.go            # Configuration
│   └── routes.go            # API routes
├── frontend/                  # Frontend application
│   ├── src/                 # Source code
│   ├── public/              # Static assets
│   ├── package.json
│   └── vite.config.ts       # Build configuration
├── dist/                    # Build output
├── go.mod
└── Makefile

my-app/
├── cmd/server/
├── app/server/
│   ├── app.go               # App with view engine
│   ├── routes.go
│   └── handlers.go          # HTML handlers
├── views/                   # HTML templates
│   ├── layouts/
│   ├── pages/
│   └── partials/
├── static/                  # CSS, JS, images
│   ├── css/
│   └── js/
└── Makefile

// Change from dist to build
//go:embed all:../../build
var buildFS embed.FS

app.Use(frontend.WithOptions(frontend.Options{
    Root: "./build",
}))

// vite.config.ts
export default {
  build: {
    outDir: '../build',  // Changed from dist
  },
}

cd frontend
npm install axios react-query

// app/server/config.go
type Config struct {
    Port    string  // Backend port
    DevPort string  // Frontend dev server port
}

func LoadConfig() *Config {
    return &Config{
        Port:    getEnv("PORT", "3000"),
        DevPort: getEnv("DEV_PORT", "5174"),  // Changed from 5173
    }
}

// vite.config.ts
export default {
  server: {
    port: 5174,  // Must match DevPort
  },
}

make dev        # Start development (both frontend and backend)
make build      # Build for production
make clean      # Clean build artifacts
make install    # Install dependencies