Digital Handbook

Appearance

Portal.Response.Hosting ​

Website: portal.response.hosting

Staging: staging.portal.response.hosting

Vue 3 multi-component link portal application that connects to NocoDB backend, providing intelligent content management with specialized components for videos, books, podcasts, quotes, and standard URLs.

Billing ​

Hosting Platform ​

Current Hosting ​

  • Provider: Netlify
  • Plan/Tier: Production plan with serverless functions
  • Server Location: Global CDN
  • SSL Certificate: Netlify managed SSL

Domain Management ​

  • Domain Registrar: To be documented
  • DNS Provider: Netlify DNS
  • CDN: Netlify Edge Network

Technical Stack ​

  • Framework: Vue 3 with Composition API
  • Build System: Vite
  • CSS Framework: Tailwind CSS v4
  • Database: NocoDB (hosted at nocodb.response.hosting)
  • Deployment: Netlify with serverless functions
  • Backup Strategy: To be documented

Project Info ​

Project Details ​

  • Start Date: To be documented
  • Launch Date: To be documented
  • Project Status: Active Production
  • Last Updated: To be documented

Client Contact ​

  • Primary Contact: Response Team
  • Email: To be documented
  • Phone: To be documented
  • Role/Title: Internal Project

Project Team ​

  • Project Manager: To be documented
  • Developer(s): To be documented
  • Designer: To be documented
  • Content Manager: To be documented

Notes ​

Development Notes ​

  • Architecture: Vue 3 Composition API with intelligent component routing
  • Content Types: Supports URL links, videos, books, podcasts, and quotes
  • Authentication: Token-based auth via Netlify Functions for private categories
  • Component Selection: DynamicLink component intelligently routes to specialized components
  • API Integration: Google Books API and Open Library API for metadata enhancement

Content Updates ​

  • Database: NocoDB with enhanced schema supporting multiple content types
  • Metadata Enhancement: Automatic fetching and caching of book covers and metadata
  • Local Storage: Manages favorites, muted items, layout preferences, and auth tokens
  • Category Priority: Special ordering for Internal, Policies, Our Values, Account Mgmt Mindsets

Client Feedback ​

  • Feature Enhancement: Multi-component system with specialized displays
  • User Experience: Theme support (light/dark/system), layout modes (grid/row)
  • Performance: Lazy loading for enhanced metadata, smart caching for API calls

Performance Notes ​

  • Build System: Vite for fast development and optimized production builds
  • API Optimization: Caching to prevent duplicate API calls
  • Responsive Design: Mobile-first approach with sidebar navigation
  • HTTPS Enforcement: All external resources use HTTPS

Third Party Services ​

Analytics & Tracking ​

  • Google Analytics: Account details to be documented
  • Tag Manager: Container information to be documented
  • Performance Monitoring: Built-in Vue 3 devtools support

Database Services ​

  • NocoDB: Primary database at nocodb.response.hosting
  • API Endpoints: Project ID and table-based data operations
  • Authentication: xc-token header authentication

External APIs ​

  • Google Books API: Primary source for book metadata and covers
  • Open Library API: Fallback source for book information
  • Platform APIs: YouTube, Vimeo, Twitch for video metadata

Development Tools ​

  • Repository: Git version control
  • Build Pipeline: Netlify automated deployments
  • Environment: Development and production configurations

Content Enhancement ​

  • Book Metadata: Lazy-loaded covers, author, genre, rating information
  • Video Integration: Thumbnail generation, embed support for major platforms
  • Podcast Support: Spotify embeds, Apple Podcasts, SoundCloud players
  • Audio Player: Custom HTML5 controls for direct audio files

Credentials / Keys ​

Hosting & Domain ​

  • Netlify Account: Deployment and hosting management
  • Domain Management: DNS and SSL certificate access
  • Environment Variables: APP_TOKEN for authentication

Development ​

  • Repository Access: Git version control credentials
  • NocoDB Access: Database connection and API credentials
  • Local Development: npm run dev and npm run dev:netlify commands

Third Party Services ​

  • Google Books API: API key for book metadata
  • Open Library API: API access for book information
  • Video Platform APIs: Access tokens for enhanced metadata

APIs & Integrations ​

  • NocoDB API: xc-token authentication header
  • External APIs: Google Books, Open Library integration
  • Netlify Functions: Serverless function authentication

Security ​

  • SSL Certificates: Netlify managed certificates
  • Authentication: Token-based access for private categories
  • API Security: Environment variable protection

⚠️ Security Note: All sensitive credentials and API keys should be stored securely using proper credential management systems. This documentation should only reference the location or method to access credentials, not the actual sensitive information.

Portal Features ​

Multi-Component System ​

  • Intelligent Routing: DynamicLink component selects appropriate specialized components
  • Content Types: URL links, videos, books, podcasts, quotes with custom displays
  • Type Detection: Explicit type field, URL pattern detection, content analysis
  • Fallback System: Standard Link component as default

Content Management ​

  • Enhanced Schema: Core fields plus type-specific fields (book, quote, podcast)
  • Metadata Enhancement: Automatic book cover and metadata fetching
  • Category Organization: Special ordering and authentication for private categories
  • Tag System: Comma-separated tags with filtering capabilities

User Experience ​

  • Theme Support: Light, dark, and system mode preferences
  • Layout Options: Grid and row layouts for different viewing preferences
  • Local Storage: Persistent user preferences and authentication
  • Responsive Design: Mobile-first with sidebar navigation

Authentication System ​

  • Private Categories: Internal, Policies, Our Values, Account Mgmt Mindsets
  • Token Validation: Netlify Function validation against APP_TOKEN
  • Secure Storage: localStorage for authenticated sessions
  • Access Control: isPublic() function controls category visibility

Data Management ​

  • NocoDB Integration: Direct API integration with enhanced schema
  • Real-time Updates: Event-driven data refresh
  • Caching Strategy: Smart caching for API calls and metadata
  • Error Handling: Robust error handling for API failures

Development Commands ​

bash
# Standard development (limited Netlify Functions)
npm run dev

# Development with Netlify Functions support
npm run dev:netlify

# Build for production
npm run build

# Preview production build
npm run preview

# Deploy the production build
netlify deploy --prod

Contact Information ​

Website: portal.response.hosting

NocoDB Backend: nocodb.response.hosting

Additional contact details to be added