Add getting started tutorials for DashCaddy
Tutorials covering: - Getting Started (setup wizard, timezone, deployment modes) - Theme Customization (theme builder, presets, color customization) - Viewing Logs (log viewer, live streaming, filtering) - Quick Search (keyboard shortcuts, navigation) - Backup & Restore (manual/automated backup, restore workflow) - Stats Monitoring (resource monitor, live stats, alerts) Also includes: - Self-contained HTML getting started guide - 30+ screenshots capturing UI workflows - Issues/notes documenting test instance observations Workflows documented: - Light theme screenshots - Dark theme screenshots (partial - theme builder) - App selector (noted as empty in test instance) - Theme builder modal - Logs viewer - Quick search - Backup modal - Stats monitoring Total: 6 tutorial files, 30+ screenshots, 1 HTML guide
This commit is contained in:
90
src/tutorials/01-getting-started.md
Normal file
90
src/tutorials/01-getting-started.md
Normal file
@@ -0,0 +1,90 @@
|
||||
# Getting Started with DashCaddy
|
||||
|
||||
This tutorial walks you through the initial setup of DashCaddy — logging in, configuring your timezone, and choosing a deployment mode. By the end, you'll have your dashboard ready to use.
|
||||
|
||||
**Prerequisites:** Access to a DashCaddy instance with TOTP credentials.
|
||||
|
||||
---
|
||||
|
||||
## Step 1: Access the Dashboard
|
||||
|
||||
Navigate to your DashCaddy instance URL (e.g., `https://test.dashcaddy.net/`). You'll be greeted with a TOTP authentication overlay asking for a 6-digit code.
|
||||
|
||||
**What you should see:**
|
||||
- A centered 6-digit input field
|
||||
- The DashCaddy logo above the input
|
||||
- An empty error message area below
|
||||
|
||||
Generate your TOTP code using your authenticator app (the secret was provided during account setup) and enter the 6 digits. The inputs auto-advance as you type each digit.
|
||||
|
||||
**Troubleshooting:**
|
||||
- If you see "Invalid code" error, check that your device clock is synchronized (TOTP is time-based)
|
||||
- If the input doesn't accept digits, refresh the page and try again
|
||||
|
||||
---
|
||||
|
||||
## Step 2: Select Your Timezone
|
||||
|
||||
After successful login, the Setup Wizard appears. The first step asks for your timezone.
|
||||
|
||||
**What you should see:**
|
||||
- Welcome message: "Welcome to DashCaddy! 🎉"
|
||||
- "Let's set up your self-hosted app dashboard. This will only take a few minutes."
|
||||
- "Your Timezone" dropdown with a long list of timezones
|
||||
|
||||
Scroll or search for your timezone in the dropdown (e.g., "America/Los_Angeles" for Pacific time). Click to select it.
|
||||
|
||||
Screenshot: `screenshots/01-getting-started/light/02-timezone-selected.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 3: Choose Deployment Mode
|
||||
|
||||
After setting your timezone, click **Continue →** to proceed to the deployment mode selection.
|
||||
|
||||
**What you should see:**
|
||||
- "Professional Home Lab Setup" (default selection)
|
||||
- Options for:
|
||||
- **🚀 Simple** — Access apps via IP:Port only. No DNS or SSL setup needed.
|
||||
- **🏠 Professional Home Lab** — Custom TLD + Private DNS + Internal CA. Full HTTPS with your own certificate authority.
|
||||
- **🌍 Public Server** — Real domain + Public DNS + Let's Encrypt. Internet-accessible with trusted SSL.
|
||||
- **⚙️ Custom** — I'll configure everything myself. Full control over every setting.
|
||||
|
||||
Screenshot: `screenshots/01-getting-started/light/03-deployment-mode-selection.png`
|
||||
|
||||
Choose the mode that matches your setup:
|
||||
- For home lab use without a domain: **Simple**
|
||||
- For a home lab with custom domain (e.g., `.home`): **Professional Home Lab**
|
||||
- For a public server with real domain: **Public Server**
|
||||
- For maximum control: **Custom**
|
||||
|
||||
Click **Continue →** to proceed or **← Back** to return to the previous step.
|
||||
|
||||
---
|
||||
|
||||
## Step 4: Complete or Skip Setup
|
||||
|
||||
Depending on your chosen mode, you may see additional configuration screens. You can:
|
||||
|
||||
- Fill in the requested information and click **Continue →**
|
||||
- Or click **Skip Setup** to postpone configuration and access the dashboard immediately
|
||||
|
||||
**What you should see:**
|
||||
After completing or skipping setup, you'll see the main dashboard with:
|
||||
- Weather widget at top left
|
||||
- Clock showing current time
|
||||
- Status cards in the main area
|
||||
- Navigation sections: STATUS, TOOLS, ADMIN
|
||||
|
||||
Screenshot: `screenshots/01-getting-started/light/01-initial-dashboard.png`
|
||||
|
||||
---
|
||||
|
||||
## Common Issues
|
||||
|
||||
| Issue | Solution |
|
||||
|-------|----------|
|
||||
| TOTP code rejected | Ensure your device time is correct; try regenerating the code |
|
||||
| Setup wizard shows no apps | The wizard is for initial configuration; apps are added via TOOLS → App Selector |
|
||||
| Timezone not saving | The timezone should auto-save; refresh and check if it persisted |
|
||||
| "Continue" button not clickable | Try scrolling down — the button may be below the viewport |
|
||||
118
src/tutorials/02-theme-customization.md
Normal file
118
src/tutorials/02-theme-customization.md
Normal file
@@ -0,0 +1,118 @@
|
||||
# Customizing the Dashboard Theme
|
||||
|
||||
DashCaddy includes a powerful theme builder that lets you customize colors, accents, and visual elements. This tutorial shows how to access and use the theme builder.
|
||||
|
||||
**Prerequisites:** Logged into DashCaddy dashboard.
|
||||
|
||||
---
|
||||
|
||||
## Step 1: Open the Theme Builder
|
||||
|
||||
Locate the theme button in the top bar of the dashboard. It's represented by a 🎨 icon with the text "Light" (showing your current theme).
|
||||
|
||||
**What you should see:**
|
||||
- Top bar with: Weather widget, Clock, Settings gear, Theme toggle (🎨 Light), License badge
|
||||
|
||||
Click the **🎨 Light** button (or click **Customize** text if visible) to open the Theme Builder modal.
|
||||
|
||||
Screenshot: `screenshots/03-theme-customization/light/01-light-theme-dashboard.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 2: Explore the Theme Builder
|
||||
|
||||
The Theme Builder modal opens with several sections:
|
||||
|
||||
**Header:**
|
||||
- Theme Builder title
|
||||
- Edit dropdown (currently editing "New Theme")
|
||||
- Delete button
|
||||
- Name field for your theme
|
||||
|
||||
**Start From Presets:**
|
||||
A list of built-in theme presets you can start from:
|
||||
- **Dark** — Dark background with light text
|
||||
- **Light** — Light background
|
||||
- **Blue** — Blue-tinted theme
|
||||
- **Black** — Pure black background
|
||||
- **Nord** — Nord color palette
|
||||
- **Dracula** — Dracula color scheme
|
||||
- **Solarized Dark** / **Solarized Light** — Solarized themes
|
||||
- **Taxi** — Yellow-tinted theme
|
||||
- **Ocean** — Ocean blue theme
|
||||
|
||||
**Preview Area:**
|
||||
A sample card showing how your theme looks, including:
|
||||
- Secondary text preview
|
||||
- Accent Button preview
|
||||
- Status indicators (Online/Offline)
|
||||
|
||||
Screenshot: `screenshots/03-theme-customization/light/04-theme-builder-open.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 3: Select a Base Theme
|
||||
|
||||
Click on one of the preset themes (e.g., "Dark") to start from that base. The preview will update to show how the selected preset looks.
|
||||
|
||||
**What you should see:**
|
||||
The preview card updates to reflect the selected preset's colors. The "Start from" selection highlights your choice.
|
||||
|
||||
Screenshot: `screenshots/03-theme-customization/dark/05-dark-preset-selected.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 4: Customize Colors (Optional)
|
||||
|
||||
Below the presets, you'll find granular color controls organized into sections:
|
||||
|
||||
**Base Colors:**
|
||||
- Background — Main background color
|
||||
- Card — Card/panel background color
|
||||
- Text — Primary text color
|
||||
- Muted Text — Secondary/hint text color
|
||||
- Border — Border and divider color
|
||||
|
||||
**Accent Colors:**
|
||||
- Accent — Primary accent color (buttons, links, highlights)
|
||||
- Accent Strong — Deeper accent for emphasis
|
||||
|
||||
**Status Colors:**
|
||||
- OK Background — Background for success/OK indicators
|
||||
- OK Text — Text color for success states
|
||||
- Error Bg — Background for error indicators
|
||||
- Error Text — Text color for error states
|
||||
|
||||
Each color field is editable — click on a color swatch or enter a hex value to customize.
|
||||
|
||||
---
|
||||
|
||||
## Step 5: Save Your Theme
|
||||
|
||||
When you're satisfied with your customizations:
|
||||
|
||||
1. Click **Save Theme** at the bottom of the modal
|
||||
2. The theme will be applied to your dashboard immediately
|
||||
3. Click **Cancel** to discard changes, or **✕** to close the modal
|
||||
|
||||
Screenshot: `screenshots/03-theme-customization/dark/02-dark-theme-dashboard.png`
|
||||
|
||||
---
|
||||
|
||||
## Importing and Exporting Themes
|
||||
|
||||
The Theme Builder supports theme import/export for backup or sharing:
|
||||
|
||||
- **Import** — Load a previously exported theme file (.json)
|
||||
- **Export** — Download your current theme as a file for backup or sharing
|
||||
|
||||
---
|
||||
|
||||
## Common Issues
|
||||
|
||||
| Issue | Solution |
|
||||
|-------|----------|
|
||||
| Theme builder button not visible | Scroll to top of dashboard — the button is in the top bar |
|
||||
| Colors not updating in preview | Click directly on a color swatch to edit it |
|
||||
| Theme not saving | Ensure you click "Save Theme" before closing the modal |
|
||||
| Preset click not working | Try clicking directly on the preset name text |
|
||||
88
src/tutorials/03-viewing-logs.md
Normal file
88
src/tutorials/03-viewing-logs.md
Normal file
@@ -0,0 +1,88 @@
|
||||
# Viewing Service Logs
|
||||
|
||||
DashCaddy provides a centralized log viewer that lets you monitor logs from your services in real-time. This tutorial shows how to access and use the logs viewer.
|
||||
|
||||
**Prerequisites:** Logged into DashCaddy dashboard with running services.
|
||||
|
||||
---
|
||||
|
||||
## Step 1: Access the Logs Viewer
|
||||
|
||||
The Logs viewer is found in the TOOLS section of the dashboard.
|
||||
|
||||
**What you should see:**
|
||||
- Dashboard with navigation sections: STATUS, TOOLS, ADMIN
|
||||
- Various cards and widgets in the main area
|
||||
|
||||
Look for a "Logs" button (📋 Logs) in the TOOLS section of the dashboard. Note that some menu items may require clicking on the section header (like "TOOLS") to expand the menu first.
|
||||
|
||||
Screenshot: `screenshots/04-viewing-logs/light/01-dashboard.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 2: The Logs Modal
|
||||
|
||||
Click on **Logs** to open the logs viewer modal.
|
||||
|
||||
**What you should see:**
|
||||
- **Title:** DNS Logs (or relevant service name)
|
||||
- **Show dropdown:** Options to show 25, 50, 100, or 200 log lines
|
||||
- **Live/Controls:** Live streaming toggle (📡 Live) and pause button (⏸️ Pause)
|
||||
- **Close button:** ✕ in the top right
|
||||
- **Log content area:** Shows the actual log entries
|
||||
|
||||
Screenshot: `screenshots/04-viewing-logs/light/02-logs-modal-open.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 3: Understanding the Log Display
|
||||
|
||||
The log viewer shows:
|
||||
- **Timestamp** — When each log entry was created
|
||||
- **Service** — Which service generated the entry
|
||||
- **Message** — The actual log content
|
||||
|
||||
**Log Line Options:**
|
||||
Use the "Show" dropdown to control how many log lines are displayed at once:
|
||||
- 25 lines — For quick overview
|
||||
- 50 lines — Default view
|
||||
- 100 lines — For more context
|
||||
- 200 lines — For detailed analysis
|
||||
|
||||
---
|
||||
|
||||
## Step 4: Live Log Streaming
|
||||
|
||||
DashCaddy supports real-time log streaming:
|
||||
|
||||
**To enable live streaming:**
|
||||
- Click the **📡 Live** button to start streaming logs in real-time
|
||||
- New log entries will appear automatically at the top or bottom of the list
|
||||
|
||||
**To pause streaming:**
|
||||
- Click **⏸️ Pause** to stop auto-updating
|
||||
- This lets you scroll through logs without new entries pushing content
|
||||
|
||||
**What you should see:**
|
||||
When live streaming is active, new log entries appear automatically. The "Loading logs..." message will be replaced with actual log data if logs are available from your services.
|
||||
|
||||
---
|
||||
|
||||
## Step 5: Filtering and Navigation
|
||||
|
||||
The log viewer supports keyboard navigation:
|
||||
- Use **↑/↓ arrow keys** to navigate through log entries
|
||||
- **Enter** to select an entry (if applicable)
|
||||
- **Esc** to close the modal
|
||||
|
||||
---
|
||||
|
||||
## Common Issues
|
||||
|
||||
| Issue | Solution |
|
||||
|-------|----------|
|
||||
| Logs show "Loading logs..." | No services are running, or services haven't generated logs yet |
|
||||
| Can't find Logs button | The button may be in a collapsed menu — click on "TOOLS" section header to expand |
|
||||
| Log entries not appearing | Live streaming may be paused — click 📡 Live to resume |
|
||||
| Too many logs | Use the "Show" dropdown to limit displayed lines |
|
||||
| Can't scroll through logs | Make sure pause (⏸️ Pause) is enabled to prevent new entries from pushing content |
|
||||
86
src/tutorials/04-quick-search.md
Normal file
86
src/tutorials/04-quick-search.md
Normal file
@@ -0,0 +1,86 @@
|
||||
# Using Quick Search
|
||||
|
||||
DashCaddy's Quick Search feature provides instant access to services, settings, and apps across your dashboard. This tutorial shows how to use it.
|
||||
|
||||
**Prerequisites:** Logged into DashCaddy dashboard.
|
||||
|
||||
---
|
||||
|
||||
## Step 1: Open Quick Search
|
||||
|
||||
Quick Search is accessed via a modal that can be triggered in two ways:
|
||||
|
||||
**Method 1: Keyboard shortcut**
|
||||
- Press **Ctrl+K** (or **Cmd+K** on Mac) to open Quick Search
|
||||
|
||||
**Method 2: Via the UI**
|
||||
- The Quick Search modal can be accessed from the dashboard header or menu
|
||||
|
||||
Screenshot: `screenshots/05-quick-search/light/01-dashboard.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 2: The Quick Search Modal
|
||||
|
||||
When opened, the Quick Search modal appears centered on your screen with a search input field.
|
||||
|
||||
**What you should see:**
|
||||
- Search input field at the top
|
||||
- Keyboard shortcut hints below the input:
|
||||
- **ESC** — Close the modal
|
||||
- **↑↓ Navigate** — Move between search results
|
||||
- **Enter Select** — Select the highlighted result
|
||||
- **Esc Close** — Another reminder to close with Escape
|
||||
|
||||
Screenshot: `screenshots/05-quick-search/light/02-quick-search-open.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 3: Search for Services or Settings
|
||||
|
||||
Click on the search input field and start typing. Quick Search supports fuzzy matching and will show results as you type.
|
||||
|
||||
**What to search for:**
|
||||
- Service names (e.g., "Plex", "Gitea", "Nextcloud")
|
||||
- Settings names (e.g., "backup", "theme", "notifications")
|
||||
- Dashboard features (e.g., "logs", "stats", "docker")
|
||||
|
||||
Screenshot: `screenshots/05-quick-search/light/03-quick-search-typed.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 4: Navigate and Select Results
|
||||
|
||||
Use the keyboard to navigate through search results:
|
||||
|
||||
1. **↑/↓ arrows** — Move the selection highlight up or down through results
|
||||
2. **Enter** — Select and open the highlighted item
|
||||
3. **ESC** — Close the Quick Search modal without selecting anything
|
||||
|
||||
**Result types may include:**
|
||||
- Services (apps you've deployed)
|
||||
- Settings pages
|
||||
- Dashboard features and modals
|
||||
- Documentation links
|
||||
|
||||
---
|
||||
|
||||
## Step 5: Quick Actions
|
||||
|
||||
Depending on the selected result, Quick Search can:
|
||||
- Open a service's management modal
|
||||
- Navigate to a settings page
|
||||
- Open a specific dashboard feature
|
||||
- Show detailed information about a service
|
||||
|
||||
---
|
||||
|
||||
## Common Issues
|
||||
|
||||
| Issue | Solution |
|
||||
|-------|----------|
|
||||
| Quick Search doesn't open | Try the keyboard shortcut (Ctrl+K/Cmd+K) |
|
||||
| No results appearing | Try shorter search terms; check spelling |
|
||||
| Results not relevant | Quick Search may need services to be configured first |
|
||||
| Can't select with Enter | Make sure a result is highlighted (has focus) |
|
||||
| Modal won't close | Press ESC to close; if it doesn't work, click outside the modal |
|
||||
108
src/tutorials/05-backup-restore.md
Normal file
108
src/tutorials/05-backup-restore.md
Normal file
@@ -0,0 +1,108 @@
|
||||
# Backup & Restore Your Configuration
|
||||
|
||||
DashCaddy includes a comprehensive backup system that saves your entire configuration — services, credentials, themes, and settings — into a single file. This tutorial shows how to create backups and restore from them.
|
||||
|
||||
**Prerequisites:** Logged into DashCaddy dashboard.
|
||||
|
||||
---
|
||||
|
||||
## Step 1: Access the Backup Modal
|
||||
|
||||
The Backup feature is found in the TOOLS section of the dashboard.
|
||||
|
||||
**What you should see:**
|
||||
- Dashboard with STATUS, TOOLS, ADMIN navigation
|
||||
- Service cards and widgets
|
||||
|
||||
Navigate to the TOOLS section and click on **Backup** to open the Backup & Restore modal.
|
||||
|
||||
Screenshot: `screenshots/06-backup-restore/light/01-dashboard.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 2: The Backup Modal
|
||||
|
||||
The Backup modal opens with three tabs and detailed information about what gets backed up.
|
||||
|
||||
**What you should see:**
|
||||
- **Title:** 💾 Backup & Restore
|
||||
- **Description:** "Full backup of your entire DashCaddy setup — server config, credentials, themes, and browser preferences in one file."
|
||||
- **Tab buttons:** Manual, Automated, History
|
||||
|
||||
Screenshot: `screenshots/06-backup-restore/light/02-backup-modal-open.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 3: Manual Backup (Export)
|
||||
|
||||
The **Manual** tab is selected by default and contains export options.
|
||||
|
||||
**What you should see:**
|
||||
- **📤 Export Backup** section with description:
|
||||
- "Downloads everything — services, Caddyfile, credentials, encryption key, themes, and all browser preferences."
|
||||
- **⬇️ Download Full Backup** button
|
||||
|
||||
**To create a manual backup:**
|
||||
1. Click **⬇️ Download Full Backup**
|
||||
2. Your browser will download a backup file (typically `.tar.gz` or similar archive)
|
||||
3. Save this file in a safe location
|
||||
|
||||
The backup file includes:
|
||||
- All service configurations
|
||||
- Caddy reverse proxy configuration
|
||||
- Encrypted credentials
|
||||
- Encryption keys
|
||||
- Custom themes
|
||||
- Browser preferences and settings
|
||||
|
||||
---
|
||||
|
||||
## Step 4: Restore from Backup
|
||||
|
||||
The **📥 Restore Backup** section lets you restore from a previously saved backup file.
|
||||
|
||||
**To restore from backup:**
|
||||
1. Click the upload/restore button (may be labeled differently in your version)
|
||||
2. Select your backup file from your computer
|
||||
3. Confirm the restore operation when prompted
|
||||
4. Wait for the restore process to complete
|
||||
|
||||
**⚠️ Warning:** Restoring a backup will replace your current configuration. Make sure to:
|
||||
- Export your current configuration first (if needed)
|
||||
- Verify the backup file is from a trusted source
|
||||
|
||||
---
|
||||
|
||||
## Step 5: Automated Backups
|
||||
|
||||
The **Automated** tab lets you schedule regular backups.
|
||||
|
||||
**What you might see:**
|
||||
- Backup schedule configuration
|
||||
- Options for backup frequency (daily, weekly, etc.)
|
||||
- Backup retention settings
|
||||
|
||||
Configure automated backups to ensure you always have recent restore points available.
|
||||
|
||||
---
|
||||
|
||||
## Step 6: Backup History
|
||||
|
||||
The **History** tab shows previous backup operations.
|
||||
|
||||
**What you might see:**
|
||||
- List of past backups
|
||||
- Timestamps for each backup
|
||||
- Restore options for individual backups
|
||||
|
||||
---
|
||||
|
||||
## Common Issues
|
||||
|
||||
| Issue | Solution |
|
||||
|-------|----------|
|
||||
| Download button not working | Check browser popup blocker; try a different browser |
|
||||
| Backup file won't upload | Ensure you're uploading the correct file format; check file size limits |
|
||||
| Restore fails | Verify the backup file is complete and not corrupted |
|
||||
| Automated backup not running | Check that the DashCaddy service is running; verify schedule settings |
|
||||
| Forgotten encryption key | Without the encryption key from backup, some credentials may not restore |
|
||||
113
src/tutorials/06-stats-monitoring.md
Normal file
113
src/tutorials/06-stats-monitoring.md
Normal file
@@ -0,0 +1,113 @@
|
||||
# Monitoring Resources with Stats
|
||||
|
||||
DashCaddy's Stats feature provides real-time and historical monitoring of CPU, memory, network, and disk usage for your containers. This tutorial shows how to access and interpret the monitoring data.
|
||||
|
||||
**Prerequisites:** Logged into DashCaddy dashboard with Docker containers running.
|
||||
|
||||
---
|
||||
|
||||
## Step 1: Access the Stats Modal
|
||||
|
||||
The Stats monitoring is found in the STATUS section of the dashboard.
|
||||
|
||||
**What you should see:**
|
||||
- Dashboard with STATUS, TOOLS, ADMIN navigation
|
||||
- Various service cards and status indicators
|
||||
|
||||
Navigate to the STATUS section and click on **Stats** to open the Resource Monitor.
|
||||
|
||||
Screenshot: `screenshots/07-stats-monitoring/light/01-dashboard.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 2: The Stats Modal
|
||||
|
||||
The Stats modal opens with resource monitoring data organized into tabs.
|
||||
|
||||
**What you should see:**
|
||||
- **Title:** 📊 Resource Monitor
|
||||
- **Description:** "Real-time and historical CPU, memory, network, and disk usage for containers."
|
||||
- **Tabs:** Live Stats, 24h Summary, Alerts
|
||||
|
||||
Screenshot: `screenshots/07-stats-monitoring/light/02-stats-modal-open.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 3: Live Stats View
|
||||
|
||||
The **Live Stats** tab shows real-time resource usage.
|
||||
|
||||
**What you might see:**
|
||||
- Container list with real-time metrics
|
||||
- CPU usage percentage per container
|
||||
- Memory usage (used/available)
|
||||
- Network I/O rates
|
||||
- Disk I/O rates
|
||||
- Auto-refresh indicator: "Auto-refresh every 5s"
|
||||
|
||||
**Refresh controls:**
|
||||
- **🔄 Refresh Now** — Manually trigger a refresh of all stats
|
||||
- Automatic refresh can be paused if needed
|
||||
|
||||
Screenshot: `screenshots/07-stats-monitoring/light/02-stats-modal-open.png`
|
||||
|
||||
---
|
||||
|
||||
## Step 4: 24h Summary View
|
||||
|
||||
The **24h Summary** tab shows aggregated statistics over the past 24 hours.
|
||||
|
||||
**What you might see:**
|
||||
- Peak CPU usage
|
||||
- Average memory usage
|
||||
- Total network traffic
|
||||
- Disk usage trends
|
||||
- Historical graphs if available
|
||||
|
||||
This view helps identify resource usage patterns and plan for capacity needs.
|
||||
|
||||
---
|
||||
|
||||
## Step 5: Alerts View
|
||||
|
||||
The **Alerts** tab shows any resource-related alerts.
|
||||
|
||||
**What you might see:**
|
||||
- High CPU warnings
|
||||
- Memory pressure alerts
|
||||
- Disk space warnings
|
||||
- Network issues
|
||||
|
||||
Alerts help you stay on top of problems before they cause service disruptions.
|
||||
|
||||
---
|
||||
|
||||
## Understanding the Metrics
|
||||
|
||||
**CPU Usage:**
|
||||
- Shows percentage of CPU being used by each container
|
||||
- High CPU (>80%) sustained may indicate performance issues
|
||||
|
||||
**Memory Usage:**
|
||||
- Shows RAM used vs. available
|
||||
- Watch for containers with memory limits approaching capacity
|
||||
|
||||
**Network I/O:**
|
||||
- Bytes/packets in and out
|
||||
- Helps identify unexpected network activity
|
||||
|
||||
**Disk I/O:**
|
||||
- Read/write speeds
|
||||
- Important for storage-heavy workloads
|
||||
|
||||
---
|
||||
|
||||
## Common Issues
|
||||
|
||||
| Issue | Solution |
|
||||
|-------|----------|
|
||||
| Stats show "Loading container stats..." | No containers running, or Docker is not responding |
|
||||
| Auto-refresh not working | Click "🔄 Refresh Now" manually; check Docker daemon |
|
||||
| Missing container in stats | Container may have stopped; check container status |
|
||||
| Network stats show zeros | Network monitoring may not be enabled for that container |
|
||||
| High CPU alerts | Check which container is using resources; consider resource limits |
|
||||
Reference in New Issue
Block a user