Nginx UI Overview

Relevant source files

Nginx UI is a modern, full-featured web interface designed to simplify the management of Nginx servers. It provides a comprehensive suite of tools for configuration editing, SSL certificate automation, log analytics, and multi-node cluster management, all through a streamlined Vue 3 dashboard powered by a Go-based backend.

System Architecture

The project is organized as a monorepo consisting of a high-performance Go backend and a responsive Vue 3 frontend pnpm-workspace.yaml1-3 The backend interacts directly with the host system's Nginx binary and configuration files, while the frontend provides a rich user interface for administrative tasks. The application supports zero-downtime restarts via the risefront package go.mod6 and manages its lifecycle through the cosy framework go.mod61

The backend entry point is main.go, which initializes the cosy kernel, sets up the Gin router, and manages the application context with signal handling for graceful shutdown main.go40-146

Core Architecture Components:

Component	Technology	Responsibility
Backend	Go 1.26+, Gin, GORM, Cosy	API services, Nginx control, ACME automation, Log indexing go.mod3-73
Frontend	Vue 3, Vite, Ant Design	User interface, real-time monitoring, configuration editor app/package.json32-90
Database	SQLite	Persistence for users, certificates, nodes, and settings via GORM go.mod71
Log Engine	Bleve	High-performance full-text indexing and search for Nginx logs go.mod15

Sources: go.mod1-75 app/package.json1-94 pnpm-workspace.yaml1-10 main.go1-60

High-Level Component Interaction

The following diagram illustrates how the major subsystems relate to the core Nginx service and the end-user.

System Context Diagram

Sources: README.md5-12 go.mod15-59 app/package.json1-63

Key Features

Configuration Management: Visual editor for Nginx configuration with syntax highlighting and validation via gonginx go.mod59
SSL Automation: Integrated ACME client using the lego library for automated certificate issuance and renewal go.mod31
Real-time Monitoring: Dashboard providing server metrics (CPU, RAM) and Nginx performance statistics using gopsutil go.mod53
Log Analytics: Advanced indexing of access logs for traffic analysis and geographic visualization using bleve and geoip2 go.mod15-47
Cluster Management: Manage multiple Nginx nodes from a single interface with node proxy support go.mod50
Security: Built-in support for 2FA (TOTP), WebAuthn/Passkeys, and JWT authentication go.mod37-49
AI Integration: Integrated LLM chat assistant using go-openai go.mod52 and MCP (Model Context Protocol) server support via mcp-go go.mod42
Internationalization: Multi-language support managed via vue3-gettext app/package.json59 and automated synchronization via Weblate .github/workflows/weblate-sync.yml1-10

Sources: go.mod1-75 app/package.json1-94 .github/workflows/weblate-sync.yml1-10

Codebase Entry Points

The project structure bridges the Go ecosystem with modern frontend tooling. The backend utilizes the cosy framework for application structure go.mod61 The frontend is a Vite-powered Vue 3 application app/package.json7-90

Code Entity Space Mapping

Sources: go.mod30-73 app/package.json32-90 main.go30-63

Detailed Documentation Sections

For deeper technical dives into specific areas of the Nginx UI codebase, please refer to the following child pages:

Getting Started: Covers installation methods including the Linux installation script, Docker deployment, and manual builds from source README.md95-103 It also introduces the first-run setup wizard and basic configuration. For details, see Getting Started.
Project Structure: A detailed breakdown of the monorepo directory layout, including the app frontend, docs site, and backend package organization pnpm-workspace.yaml1-3 For details, see Project Structure.

Sources: