Web Dashboard Subscriptions¶

Subscribe to Notifer topics through the web dashboard at app.notifer.io.

Overview¶

The Notifer web dashboard provides a full-featured interface for:

📬 Real-time notifications via Server-Sent Events (SSE)
📋 Message history with search and filtering
🔔 Desktop notifications (optional browser permission)
🎨 Dark mode support
📱 Mobile-responsive design

Getting Started¶

Registration:

Email: your@email.com
Password: (strong password)

Login: - Email + Password - Google OAuth (Sign in with Google)

Click "Discover" in the sidebar
Browse available public topics
Click "Subscribe" on any topic
Topic appears in "Subscribed" list

Method 1: Topic Access Token

Get topic access token from topic owner
Click "Subscribe" button (top right)
Enter topic name
Enter access token
Click "Subscribe"

Method 2: Direct URL

Visit: https://app.notifer.io/subscribe?topic=TOPIC_NAME&token=ACCESS_TOKEN

The topic will be automatically added to your subscriptions.

3. View Messages¶

Click on any subscribed topic to view:

Real-time feed - New messages appear instantly
Message history - Scroll to load older messages
Search - Filter by text, priority, tags
Sort - By time, priority, or relevance

Dashboard Sections¶

My Topics¶

Location: Sidebar → "My Topics"

Topics you own:

┌─────────────────────────────────────┐
│ 📁 My Topics (3)                    │
├─────────────────────────────────────┤
│ ⚙️ server-alerts        42 messages │
│ 📊 analytics            15 messages │
│ 🚀 deployments          8 messages  │
└─────────────────────────────────────┘

Actions: - Click to view messages - Click ⚙️ to edit settings - Click 🗑️ to delete topic

Subscribed Topics¶

Location: Sidebar → "Subscribed"

Topics you're subscribed to (owned by others):

┌─────────────────────────────────────┐
│ 🔔 Subscribed (2)                   │
├─────────────────────────────────────┤
│ 🌐 public-announcements  120 msgs   │
│ 👥 team-alerts           34 msgs    │
└─────────────────────────────────────┘

Actions: - Click to view messages - Click 🔕 to unsubscribe

Discover Public Topics¶

Location: Sidebar → "Discover"

Browse public topics:

┌─────────────────────────────────────┐
│ 🔍 Search: _________________        │
├─────────────────────────────────────┤
│ 🌍 weather-updates                  │
│    Global weather alerts            │
│    [Subscribe]                      │
├─────────────────────────────────────┤
│ 📰 tech-news                        │
│    Latest tech industry news        │
│    [Subscribe]                      │
└─────────────────────────────────────┘

Filters: - Search by name or description - Sort by: Newest, Popular, Most Active

Viewing Messages¶

Message Feed¶

┌─────────────────────────────────────────────────┐
│ 🚨 CRITICAL: Database Down           Priority 5 │
│ Server prod-db-01 is unresponsive               │
│ Tags: critical, database, production            │
│ 2025-11-22 10:30:45                             │
├─────────────────────────────────────────────────┤
│ ⚠️ High Memory Usage                 Priority 4 │
│ Server prod-web-02: 92% memory used             │
│ Tags: warning, memory, prod-web-02              │
│ 2025-11-22 10:15:22                             │
└─────────────────────────────────────────────────┘

Message Details¶

Click any message to view full details:

┌─────────────────────────────────────────────────┐
│ 🚨 CRITICAL: Database Down                      │
│ Priority: 5 (Max/Urgent)                        │
│ Tags: critical, database, production            │
│ Published: 2025-11-22 10:30:45                  │
│                                                 │
│ Message:                                        │
│ Server prod-db-01 is unresponsive              │
│                                                 │
│ **Status:** All write operations failing        │
│ **Impact:** High - affecting all users          │
│                                                 │
│ **Action Required:**                            │
│ 1. Restart primary database                     │
│ 2. Failover to replica if needed                │
│                                                 │
│ [Copy Link] [Mark as Read] [Delete]             │
└─────────────────────────────────────────────────┘

Markdown rendering: - Bold, italic, code formatting - Links are clickable - Code blocks with syntax highlighting - Lists, tables, blockquotes

Real-Time Updates¶

Server-Sent Events (SSE)¶

The web dashboard uses SSE for real-time notifications:

Connection status indicator:

🟢 Connected     - Receiving real-time updates
🟡 Connecting    - Establishing connection
🔴 Disconnected  - Reconnecting...

Automatic features: - ✅ Auto-reconnect on connection loss - ✅ Resume from last message (no duplicates) - ✅ Efficient (single connection for all topics) - ✅ Battery-friendly on laptops

Desktop Notifications¶

Enable browser notifications to receive alerts even when dashboard tab is in background:

Setup: 1. Click 🔔 icon in top navigation 2. Browser will prompt for permission 3. Click "Allow"

Notification example:

┌─────────────────────────────────┐
│ 🚨 server-alerts                │
│ CRITICAL: Database Down         │
│ Server prod-db-01 is...         │
│                                 │
│ Click to view details           │
└─────────────────────────────────┘

Notification settings: - Choose which topics trigger notifications - Filter by priority (e.g., only priority 4+) - Enable/disable notification sound - Customize notification duration

Search and Filtering¶

Text Search¶

Location: Top of message feed

🔍 Search messages...

Search options: - Message content - Title - Tags

Example:

Search: "database error"
→ Shows all messages containing "database error"

Filter by Priority¶

Priority: [All] [5] [4] [3] [2] [1]

Click priority badge to filter:

5 - Urgent/Critical only
4 - High priority and above
3 - Default and above
All - Show all priorities

Filter by Tags¶

Click any tag to filter messages:

Tags: [production] [staging] [development]

Tag filtering logic: - Single tag: Show messages with that tag - Multiple tags: Show messages with ANY selected tag (OR)

Clear filters: Click ✕ on active filter chips

Sort Options¶

Sort by: [Newest] [Oldest] [Priority] [Relevance]

Newest: Latest messages first (default)
Oldest: Oldest messages first
Priority: Highest priority first
Relevance: Best match for search query

Creating Topics¶

From Web Dashboard¶

Click "+ New Topic" button
Fill in details:

┌─────────────────────────────────────┐
│ Create New Topic                    │
├─────────────────────────────────────┤
│ Name:                               │
│ [my-server-alerts_______________]   │
│                                     │
│ Description (optional):             │
│ [Production server monitoring___]   │
│                                     │
│ Access Level:                       │
│ ⚪ Public  ⚫ Private                │
│                                     │
│ Discoverable:                       │
│ ☑ Show in public topic list         │
│                                     │
│ [Cancel]  [Create Topic]            │
└─────────────────────────────────────┘

Click "Create Topic"

Topic name rules: - 3-50 characters - Lowercase letters, numbers, hyphens - Must start with letter - Unique across Notifer

Topic Settings¶

Edit topic settings after creation:

Access: - Public - Anyone can subscribe and publish - Private - Requires authentication

Discovery: - Discoverable - Appears in public topic list - Hidden - Only accessible via direct URL

Access Tokens: - Create tokens for external services - Set expiration date - Revoke anytime

Publishing Messages¶

From Web Dashboard¶

Open topic
Click "Publish" button
Fill in message form:

┌─────────────────────────────────────┐
│ Publish Message                     │
├─────────────────────────────────────┤
│ Title (optional):                   │
│ [Critical Database Alert________]   │
│                                     │
│ Message:                            │
│ ┌─────────────────────────────────┐ │
│ │ Server prod-db-01 is down!      │ │
│ │                                 │ │
│ │ **Action:** Investigate ASAP    │ │
│ └─────────────────────────────────┘ │
│                                     │
│ Priority: [3 ▼]                     │
│ Tags: [critical, database_______]   │
│                                     │
│ ☑ Use Markdown formatting           │
│                                     │
│ [Preview] [Cancel] [Publish]        │
└─────────────────────────────────────┘

Click "Publish"

Features: - Markdown preview - Priority selection (1-5) - Multiple tags (comma-separated) - Character counter (max 4,000)

Account Settings¶

Profile Settings¶

Location: Click profile icon → "Settings"

┌─────────────────────────────────────┐
│ Profile                             │
├─────────────────────────────────────┤
│ Email: user@example.com             │
│ Name: [John Doe__________________]  │
│ Timezone: [America/New_York ▼]      │
│                                     │
│ [Save Changes]                      │
└─────────────────────────────────────┘

Notification Preferences¶

┌─────────────────────────────────────┐
│ Notifications                       │
├─────────────────────────────────────┤
│ Desktop Notifications:              │
│ ☑ Enable desktop notifications      │
│ ☑ Play sound                        │
│                                     │
│ Minimum Priority:                   │
│ ○ All  ○ 3+  ⚫ 4+  ○ 5 only        │
│                                     │
│ [Save Changes]                      │
└─────────────────────────────────────┘

API Keys¶

Location: Settings → "API Keys"

Manage API keys for programmatic access:

┌─────────────────────────────────────┐
│ API Keys                            │
├─────────────────────────────────────┤
│ 🔑 Production Server                │
│    Created: 2025-11-20              │
│    Last used: 2 hours ago           │
│    [Revoke]                         │
├─────────────────────────────────────┤
│ 🔑 CI/CD Pipeline                   │
│    Created: 2025-11-15              │
│    Last used: 5 minutes ago         │
│    [Revoke]                         │
├─────────────────────────────────────┤
│ [+ Create New API Key]              │
└─────────────────────────────────────┘

Create API Key: 1. Click "+ Create New API Key" 2. Enter name/description 3. Copy and save key (shown once!) 4. Use in scripts/integrations

Subscription Plan¶

Location: Settings → "Subscription"

View and manage subscription:

┌─────────────────────────────────────┐
│ Current Plan: ESSENTIALS            │
├─────────────────────────────────────┤
│ Messages today: 456 / 15,000        │
│ Private topics: 3 / 10              │
│                                     │
│ [Upgrade to TEAM] [Manage Plan]     │
└─────────────────────────────────────┘

Plans: - FREE: 1,000 messages/day, 1 private topic, 5 subscriptions - ESSENTIALS: 15,000 messages/day, 10 private topics, 25 subscriptions - TEAM: 50,000 messages/day, 50 private topics, unlimited subscriptions, team features

Dark Mode¶

Toggle: Click 🌙/☀️ icon in top navigation

Features: - Automatic based on system preference - Manual toggle - Reduced eye strain for night work - Persistent across sessions

Keyboard Shortcuts¶

g + h - Go to Home
g + t - Go to My Topics
g + s - Go to Subscribed
g + d - Go to Discover

Actions¶

n - New Topic
p - Publish Message
/ - Focus search
Esc - Close modal/clear search

Message Feed¶

j / ↓ - Next message
k / ↑ - Previous message
Enter - Open message details
r - Mark as read

Mobile Web Experience¶

The web dashboard is fully responsive:

Mobile Layout¶

┌──────────────────┐
│ ☰  Notifer    🔔 │
├──────────────────┤
│ 📬 My Topics     │
│                  │
│ ⚙️ server-alerts │
│ 42 messages      │
│                  │
│ 📊 analytics     │
│ 15 messages      │
├──────────────────┤
│ [+ New Topic]    │
└──────────────────┘

Mobile features: - Hamburger menu for navigation - Swipe gestures (swipe message to delete) - Touch-optimized buttons - Collapsible sections - Bottom navigation bar

Recommendation: For best mobile experience, use the native iOS/Android app with push notifications!

Best Practices¶

1. Organize Topics¶

By environment:

prod-alerts
staging-alerts
dev-logs

By system:

api-monitoring
database-alerts
frontend-errors

By team:

team-engineering
team-sales
team-support

2. Use Priorities Wisely¶

5 - Production outages, security incidents
4 - Warnings, failed jobs
3 - General updates, info
2 - Background tasks
1 - Debug logs

3. Tag Consistently¶

Create a tagging schema:

Environments: production, staging, dev
Services: api, database, frontend
Severity: critical, warning, info

4. Filter Notifications¶

Set minimum priority for desktop notifications:

Work topics: Priority 4+ only
Personal topics: All priorities
Debug topics: Disable notifications

5. Regular Cleanup¶

Archive or delete old topics
Remove unused subscriptions
Clean up API keys you no longer use

Troubleshooting¶

Not Receiving Real-Time Updates¶

Solutions: 1. Check connection status (top right) 2. Refresh page (Ctrl/Cmd + R) 3. Check browser console for errors 4. Disable ad blockers (may block SSE) 5. Check firewall/proxy settings

Desktop Notifications Not Working¶

Solutions: 1. Check browser notification permissions 2. Verify notifications enabled in topic settings 3. Check system notification settings (OS level) 4. Try different browser

Messages Not Loading¶

Solutions: 1. Check internet connection 2. Clear browser cache 3. Check browser console for errors 4. Verify topic access permissions

Slow Performance¶

Solutions: 1. Limit displayed messages (auto-loads 50 at a time) 2. Close unused topics 3. Clear browser cache 4. Disable desktop notifications if not needed

Privacy and Security¶

Data Storage¶

Messages stored for 30 days
Encrypted in transit (HTTPS)
Encrypted at rest (database)

Account Security¶

Strong password required (min 8 chars)
Two-factor authentication (coming soon)
Session timeout after 7 days
API key rotation recommended

Topic Privacy¶

Public topics: Anyone can view and subscribe
Private topics: Requires authentication
Hidden topics: Not discoverable via search

Browser Compatibility¶

Supported browsers:

✅ Chrome 90+ (recommended)
✅ Firefox 88+
✅ Safari 14+
✅ Edge 90+
⚠️ Internet Explorer: Not supported

Progressive Web App (PWA): Install as desktop app (Chrome/Edge):

Click install icon in address bar
Click "Install"
App opens in standalone window
Works offline (cached)

Next Steps¶

Mobile App Guide - Install iOS/Android app with push notifications
SSE Guide - Subscribe programmatically via SSE
Publishing Guide - Send messages via HTTP/API
API Reference - Complete API documentation

Pro Tip: Install the web app as a PWA for a native app-like experience on desktop! 🚀

Web Dashboard Subscriptions¶

Overview¶

Getting Started¶

1. Sign Up / Login¶

2. Subscribe to Topics¶

Subscribe to Public Topics¶

Subscribe to Private Topics¶

3. View Messages¶

Dashboard Sections¶

My Topics¶

Subscribed Topics¶

Discover Public Topics¶

Viewing Messages¶

Message Feed¶

Message Details¶

Real-Time Updates¶

Server-Sent Events (SSE)¶

Desktop Notifications¶

Search and Filtering¶

Text Search¶

Filter by Priority¶

Filter by Tags¶

Sort Options¶

Creating Topics¶

From Web Dashboard¶

Topic Settings¶

Publishing Messages¶

From Web Dashboard¶

Account Settings¶

Profile Settings¶

Notification Preferences¶

API Keys¶

Subscription Plan¶

Dark Mode¶

Keyboard Shortcuts¶

Navigation¶

Actions¶

Message Feed¶

Mobile Web Experience¶

Mobile Layout¶

Best Practices¶

1. Organize Topics¶

2. Use Priorities Wisely¶

3. Tag Consistently¶

4. Filter Notifications¶

5. Regular Cleanup¶

Troubleshooting¶

Not Receiving Real-Time Updates¶

Desktop Notifications Not Working¶

Messages Not Loading¶

Slow Performance¶

Privacy and Security¶

Data Storage¶

Account Security¶

Topic Privacy¶

Browser Compatibility¶

Next Steps¶